PDA

View Full Version : [CLOSED] ComboBox height



zaccret
30 May 2008, 1:51 AM
Env : Windows XP, GXT 1.0beta3, IE 6, FF2/3
In most cases, there is an issue with combo box height. The field height is bigger than the expand image. You can reproduce the bug with the code :

public void onModuleLoad() {
Viewport viewport = new Viewport();
final FormPanel panel = new FormPanel();
panel.setHeading("Form panel");
panel.setWidth(400);
final ComboBox combo = new ComboBox();
combo.setFieldLabel("File");
panel.add(combo);
viewport.add(panel);
RootPanel.get().add(viewport);
}If I add
combo.setHeight(21); it has no effect.

darrellmeyer
3 Jun 2008, 7:21 AM
Yout cannot change the height of the Combo. I do not see any issues with ComboBox. If what you describe occurs, it is a bug. Please post some test code and a screenshot.

zaccret
9 Jun 2008, 10:15 PM
I can still reproduce the bug in hosted mode with beta4 with the same code. I don't modify the height. Take a look at the screenshot.

public void onModuleLoad() {
Viewport viewport = new Viewport();
final FormPanel panel = new FormPanel();
panel.setHeading("Form panel");
panel.setWidth(400);
final ComboBox combo = new ComboBox();
combo.setFieldLabel("File");
panel.add(combo);
viewport.add(panel);
RootPanel.get().add(viewport);
}

jraue
10 Jun 2008, 11:47 PM
+1

Since beta4, I am facing the same issue with my code in hosted mode, looks exactly like zaccret's screenshot. I think this is related to the style sheet. Some text now appears unnaturally larger than before, most noticably in the ComboBox and TextFields.

The screenshot below shows that behavior. Prior to beta4, the font size/style of the TextFields/Labels/ComboBoxes was like the the Text that says "Vorhandene ..." on the lower-hand side.

Darell, could you please have a look at why this might be?

Thanks a lot,

Joachim

flow
12 Jun 2008, 4:12 AM
+1
GWT 1.5 RC
GXT Beta 5
Hosted

The TextField of the TriggerField "ComboBox" seems to consume slightly more height than it should.
Furthermore, the LabelField's text is not vertically centered.



public void onModuleLoad() {
final Viewport v = new Viewport();

// FormPanel of Product-Properties
final FormPanel formPanel = new FormPanel();
formPanel.setHeading("Large Combobox");
formPanel.setFieldWidth(200);
formPanel.setLabelWidth(200);
formPanel.setLabelAlign(LabelAlign.RIGHT);
formPanel.setBorders(false);
formPanel.setFrame(true);
formPanel.setWidth(500);

final Field<String> prodIdSelectionField = new TriggerField<String>();
prodIdSelectionField.setFieldLabel("id");
prodIdSelectionField.setEnabled(false);
prodIdSelectionField.setReadOnly(true);
formPanel.add(prodIdSelectionField);

final LabelField label = new LabelField();
label.setFieldLabel("Date");
label.setText("06/12/08");
formPanel.setStyleAttribute("padding", "10px");
formPanel.add(label);

v.add(formPanel);
RootPanel.get().add(v);
}

zaccret
12 Jun 2008, 4:40 AM
Well, if I omit the HTML 4.01 Transitional DOCTYPE declaration in the HTML main file (passing to Quirks mode) : the result is better on IE6 and is perfect on FF.
So we should first state here http://extjs.com/forum/showthread.php?t=38334

jraue
12 Jun 2008, 4:43 AM
I think the changes induced by beta3 were that the styles .x-form-field and
.x-form-item are now font-size: 12px wheras they previously were 11px.

Personally, I would very much appreciate if they could be set back to 11px. Then they are consistent with e.g. the way the "Text" item is rendered.

jraue
12 Jun 2008, 4:56 AM
Actually, the defining the font size smaller as pre-beta3 doesnn't solve the combo box selector not aligned problem... :(

Kevin Ott
13 Jun 2008, 9:35 AM
I've encountered this problem as well. I noticed that the stylesheet of the explorer demo adjusts the top by -1 to align the input with the expander.



/* Rule 2 of http://extjs.com/explorer/Resources.css */
.ext-ie .x-form-text { POSITION: relative; TOP: -1px}


This css hack seems to make the problem go away for me.



.ext-ie .x-form-text {
margin: 0px;
height: 18px;
font-size: 11px;
position: relative;
top: -1px
}

darrellmeyer
13 Jun 2008, 11:28 AM
Good catch Kevin. The CSS belongs in the core GXT CSS. With the current code, if you do not import the Resources module, the alignment will be off 1 px in IE. I have moved the style from Resources module into the core CSS. Change is in SVN.

zaccret
15 Jun 2008, 9:50 PM
Wow, bravo, Kevin and thanks Darell for the fix.