Actually, I saw essentially the same view in Chrome, at least regarding the
height of the select. The width is a different story.
In general, I wouldn't add individual widgets to the root layout panel, I'd
add panels, and put the widgets inside them. That helps get around some of
the browser idiosyncrasies, particularly with select tags. It looks like
the RootLayoutPanel adds a div wrapper around any widget you add to it, and
actually applies the sizing to that. The widget you added is then set to
have top, bottom, left, and right all at 0 within that div. FF seems to
ignore absolute positioning using right: XX; with select tags, but if I
explicitly set the style to change the right: 0; to width: 100%;, I get the
expected width.
You're getting a weird behavior with the height of the select because you
didn't set any vertical sizing parameters for it when you added it, so it's
defaulting to top and bottom of 0. Thus the selector part of it is huge.
(And FF does honor the bottom: 0; setting.)
Here's a revision of your code with a comparison of adding a container:
public void onModuleLoad() {
ListBox list = new ListBox(false);
RootLayoutPanel.get().add(list);
RootLayoutPanel.get().setWidgetTopHeight(list, 0, Unit.PCT, 50,
Unit.PCT);
RootLayoutPanel.get().setWidgetLeftWidth(list, 0, Unit.PCT, 50,
Unit.PCT);
list.getElement().getStyle().setWidth(100, Unit.PCT); // closer to
what you want
for (int i = 0; i < 100; i++) {
list.addItem("item " + i);
}
ListBox list2 = new ListBox(false);
FlowPanel pnl = new FlowPanel();
pnl.add(list2);
RootLayoutPanel.get().add(pnl);
pnl.getElement().getStyle().setBorderStyle(BorderStyle.SOLID);
pnl.getElement().getStyle().setBorderColor("black");
pnl.getElement().getStyle().setBorderWidth(1, Unit.PX);
list2.getElement().getStyle().setWidth(100, Unit.PCT);
RootLayoutPanel.get().setWidgetRightWidth(pnl, 0, Unit.PCT, 50,
Unit.PCT);
for (int i = 0; i < 100; i++) {
list2.addItem("item " + i);
}
}
I don't think that there's any relation between this and issues you might
be having with Canvas.
On Monday, September 16, 2013 8:29:10 AM UTC-4, vincent vigon wrote:
>
> ListBox has a weird behavior with fireFox (23.0.1), not with Chrome and
> Safari.
>
> Here is my code :
>
> public void onModuleLoad(){
>
> ListBox list= new ListBox(false);
>
> RootLayoutPanel.get().add(list);
>
> RootLayoutPanel.get().setWidgetLeftWidth(list,0,Unit.PCT,50,Unit.PCT);
>
> for (int i=0;i<100;i++){
>
> list.addItem("item "+i);
>
> }
>
> }
>
>
> The result is weird with FireFox : the list does not occupy 50% of the
> width, but it occupies 100% of the height.
>
> It seems that the Layout Mechanism does not work on Firefox.
>
> It is probably a problem with Css because I have a second problem
> (probably linked) : on firefox, all my drawing on canvas are black (no
> colors).
>
>
> Thank you for helping me
>
> Vincent
>
>
>
>
>
>
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/groups/opt_out.
