PDA

View Full Version : [CLOSED] [1.2.3] FormPanel layout issue in FF



baskor
11 Apr 2009, 7:30 AM
I'm developing an application that uses many forms, and I'm getting very frustrated because there are so many form layout issues in GXT.

Here is one of the more serious: I'm using FF3 in OSX and try to open a form inside a window. The layout is completely messed up, because GXT adds scroll bars on fields; see attached image.

Code that demonstrates the bug:



import com.extjs.gxt.ui.client.event.ComponentEvent;
import com.extjs.gxt.ui.client.event.SelectionListener;
import com.extjs.gxt.ui.client.widget.Viewport;
import com.extjs.gxt.ui.client.widget.Window;
import com.extjs.gxt.ui.client.widget.button.Button;
import com.extjs.gxt.ui.client.widget.form.*;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;

public class Test implements EntryPoint {

public void onModuleLoad() {

Viewport vp = new Viewport();

Button openBtn = new Button("Open");
openBtn.addSelectionListener(new SelectionListener<ComponentEvent>() {
@Override
public void componentSelected(ComponentEvent ce) {
Window window = new Window();
window.setLayout(new FitLayout());
window.setSize(328, 310);
window.add(createForm1());
window.show();
}
});

vp.add(openBtn);

RootPanel.get().add(vp);
}

private FormPanel createForm1() {
FormPanel simple = new FormPanel();
simple.setHeading("Simple Form");
simple.setFrame(true);
simple.setWidth(350);

TextField<String> firstName = new TextField<String>();
firstName.setFieldLabel("Name");
firstName.setAllowBlank(false);
simple.add(firstName);

TextField<String> email = new TextField<String>();
email.setFieldLabel("Email");
simple.add(email);

DateField date = new DateField();
date.setFieldLabel("Birthday");
simple.add(date);

TimeField time = new TimeField();
time.setFieldLabel("Time");
simple.add(time);

CheckBox check1 = new CheckBox();
check1.setBoxLabel("Classical");

CheckBox check2 = new CheckBox();
check2.setBoxLabel("Rock");
check2.setValue(true);

CheckBox check3 = new CheckBox();
check3.setBoxLabel("Blue");

CheckBoxGroup checkGroup = new CheckBoxGroup();
checkGroup.setFieldLabel("Music");
checkGroup.add(check1);
checkGroup.add(check2);
checkGroup.add(check3);
simple.add(checkGroup);

Radio radio = new Radio();
radio.setName("radio");
radio.setBoxLabel("Red");
radio.setValue(true);

Radio radio2 = new Radio();
radio2.setName("radio");
radio2.setBoxLabel("Blue");

RadioGroup radioGroup = new RadioGroup("test");
radioGroup.setFieldLabel("Favorite Color");
radioGroup.add(radio);
radioGroup.add(radio2);
simple.add(radioGroup);

TextArea description = new TextArea();
description.setPreventScrollbars(true);
description.setFieldLabel("Description");
simple.add(description);

return simple;
}
}

micgala
13 Apr 2009, 11:37 PM
The exact same problem happens for me also (FF on Mac).

One possible workaround for this is defining a manual size for the formpanel...

and make it big enough to comport the fields...
Big problem is that you have to compile the gwt everytime you want to test this on FF. :(

baskor
29 Jun 2009, 1:22 AM
Do you have any plans of fixing this bug? It is really serious for me, because my application uses forms everywhere.

The bug also exists in [1.2.4] and on Firefox 3 on Windows, so it's not just a OS X issue.

sven
29 Jun 2009, 2:15 AM
This is not an issue in GXT. There are several issues in your code. The initial width of the fields is just too long for your window. So you could change your code, that the fields automatically resize, your you give them a smaller with, or you make the window bigger.

I suggest the first one. I am going to close the issue.