Setting Width of a TextBox inside LayoutPanel

[Chris Odd]

Hello all,

I have a LayoutPanel with one widget added to it (a TextBox).   I want to make the TextBox's width equal to the LayoutPanel's width.

I thought this would work, but it does not (the TextBox is much narrower than the LayoutPanel's width):

LayoutPanel pnl = new LayoutPanel();

TextBox tb = new TextBox();

pnl.add(tb);

pnl.setWidgetLeftWidth(tb, 0, Unit.PCT, 100, Unit.Pct);

Any idea why it doesn't work?  Or ideas for a better approach?

Thanks

[Eddy]

Hello Chris,

I am not an expert about GWT but I always added a panel into a layoutpanel before. After that I added my widgets into the panel.
I am telling about SimplePanel for only one widget or FlowPanel for putting several widgets into.

For example, I used a DockLayoutPanel (and think it is the same for layoutpanel), I set it in Unit.PX made a setSize("100%", "100%").
Then I instanciated a flowPanel, with a setSize("100%", "100%") too, and added my widgets into (telling about the view into an MVP model).
I ensured the view implements RequiresResize, ProvidesResize and implemented some resizes code on the widgets I want to resize.
The behaviour is that when the user resize the browser, the container layoutPanel resize too and the panel take "dynamically" the size of the layoutpanel.
=> perhaps you could set the size of your texbox = size panel and see what happens.

Excuses me for my english but i am french :-)

Hope it could help

Eddy

[Chris Odd]

My original issue was that for textboxes, the call to

pnl.setWidgetLeftWidth(tb, 0, Unit.PCT, 100, Unit.Pct);

does not work.   Other widgets are fine, but for some reason textbox is different.

.LabelledTextBox {

-webkit-box-sizing: border-box; 

    -moz-box-sizing: border-box;   

    box-sizing: border-box;

    width:100%;

height:100%; 

}

On Sep 13, 2016, at 9:52 AM, Eddy <eddy.j...@gmail.com> wrote:

Hello Chris,

I am not an expert about GWT but I always added a panel into a layoutpanel before. After that I added my widgets into the panel.
I am telling about SimplePanel for only one widget or FlowPanel for putting several widgets into.

For example, I used a DockLayoutPanel (and think it is the same for layoutpanel), I set it in Unit.PX made a setSize("100%", "100%").
Then I instanciated a flowPanel, with a setSize("100%", "100%") too, and added my widgets into (telling about the view into an MVP model).
I ensured the view implements RequiresResize, ProvidesResize and implemented some resizes code on the widgets I want to resize.
The behaviour is that when the user resize the browser, the container layoutPanel resize too and the panel take "dynamically" the size of the layoutpanel.
=> perhaps you could set the size of your texbox = size panel and see what happens.

The issue is not that the panels are incorrectly sized, but that the TextBox inside the panel does not expand to take up 100% of its container width, even though I call

pnl.setWidgetLeftWidth(tb, 0, Unit.PCT, 100, Unit.Pct);

Other non-textbox widgets seem to behave just fine.   Not sure what is different about TextBox. 

I did get it to behave the way I wanted using the following workaround… not fully programmatic, had to use CSS:

tb.setStylePrimaryName("LabelledTextBox");

and then putting this in the CSS:

.LabelledTextBox {

    -webkit-box-sizing: border-box; 

    -moz-box-sizing: border-box;   

    box-sizing: border-box;

    width:100%;

    height:100%; 

}

Excuses me for my english but i am french :-)

Hope it could help

Eddy

Le mercredi 20 juillet 2016 00:16:56 UTC+2, Chris Odd a écrit :

Hello all,

I have a LayoutPanel with one widget added to it (a TextBox).   I want to make the TextBox's width equal to the LayoutPanel's width.

I thought this would work, but it does not (the TextBox is much narrower than the LayoutPanel's width):

LayoutPanel pnl = new LayoutPanel();

TextBox tb = new TextBox();

pnl.add(tb);

pnl.setWidgetLeftWidth(tb, 0, Unit.PCT, 100, Unit.Pct);

Any idea why it doesn't work?  Or ideas for a better approach?

Thanks

--
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-tool...@googlegroups.com.
To post to this group, send email to google-we...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.