Hi, you can do this with VerticalPanel like this:
<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent";> <ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui"> <ui:style> .vpanel td { border: 1px solid black; } </ui:style> <g:VerticalPanel width="100%" height="100%" stylePrimaryName="{style.vpanel}" ui:field="verticalPanel"> <g:Label ui:field="topPanel">TOP</g:Label> <g:Label ui:field="contentPanel">CONTENT</g:Label> <g:Label ui:field="bottomPanel">BOTTOM</g:Label> </g:VerticalPanel> </ui:UiBinder> And in your Java file: @UiField VerticalPanel verticalPanel; ... verticalPanel.setCellHeight(verticalPanel.getWidget(1), "100%"); This works in Firefox both in Standards mode and in Quirks mode. In IE, this doesn't really work in Standards mode: If using RootLayoutPanel, then the row called "CONTENT" gets 100% of the Window height (so the BOTTOM row isn't shown). If using RootPanel, the table doesn't stretch vertically at all. So for IE, this only works in Quirks mode. Make sure to use RootPanel instead of RootLayoutPanel! I'm still looking for a way to make such a layout work in IE and standards mode. I don't care if it's based on tables or divs. Has anyone succeeded with this yet? Chris On Feb 24, 12:40 am, ahhughes <ahhug...@gmail.com> wrote: > Sytax corrected.... the <table> doesn't work for me unless I put it in > a <g:HTMLPanel>... > > MyEntryPoint.ui.xml > ------------------------------ > > <!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent";> > <ui:UiBinder > xmlns:ui='urn:ui:com.google.gwt.uibinder' > xmlns:g='urn:import:com.google.gwt.user.client.ui' > > > <g:HTMLPanel> > <table width='100%' height='100%' border='1'> > <!-- this is the auto-height minimum fill row--> > <tr> > <td> > <g:Label ui:field="topPanel" text="TOP"></g:Label> > </td> > </tr> > <tr height='100%'> > <td width='100%'> > <g:Label ui:field="contentPanel" > text="CONTENT"></g:Label> > </td> > </tr> > <tr> > <td> > <g:Label ui:field="bottomPanel" > text="BOTTOM"></g:Label> > </td> > </tr> > </table> > </g:HTMLPanel> > </ui:UiBinder> > > There's also some trickery in the entry point: > > MyEntryPoint.java > -------------------------- > > public class MyEntryPoint implements EntryPoint { > > interface Binder extends UiBinder<HTMLPanel, MyEntryPoint> {} > > private static final Binder binder = GWT.create(Binder.class); > > @UiField Label topPanel; > @UiField Label contentPanel; > @UiField Label bottomPanel; > > public void onModuleLoad() { > HTMLPanel outer = binder.createAndBindUi(this); > Window.enableScrolling(false); > Window.setMargin("0px"); > RootLayoutPanel.get().add(outer); > } > > } > > On Feb 24, 9:20 am, Andrew Hughes <ahhug...@gmail.com> wrote: > > > > > Hi Chris, > > > You're right... I want to fill the window 100%. One row is of auto-fit > > (minimum height) and the other is 100% (fill whatever is left). > > > Don't quote me on the syntax below (this is off the top of my head). I don't > > want to use <html> in the ui.xml, but it might be the only way :'( > > > <!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent";> > > <ui:UiBinder > > xmlns:ui='urn:ui:com.google.gwt.uibinder' > > xmlns:g='urn:import:com.google.gwt.user.client.ui' > > xmlns:my='urn:import:com.mycompany.myproject.client.ui' > > > > > <table height='100%' width='100%'> > > <tr> > > <td> > > <my:TopPanel ui:field='topPanel/> > > <td> > > </tr> > > <tr height='100%'> > > <td> > > <my:ContentPanel ui:field='contentPanel'/> > > <td> > > </tr> > > </table> > > </ui:UiBinder> > > > On Wed, Feb 24, 2010 at 3:03 AM, Chris Lercher > > <cl_for_mail...@gmx.net>wrote: > > > > [Note: I think my previous answer was dropped by the Google Groups > > > outage (?) - so I'm writing this again...] > > > > Hi Andrew, > > > > you can use <g:VerticalPanel> in UiBinder. But if you use HTML > > > Standars mode (<!doctype html>), then tables render differently than > > > in quirks mode, especially in IE! > > > > To set some options on the VerticalPanel, you'll maybe have to access > > > it programmatically as a @UiField. > > > > Let me know, if you find a way to achieve the layout you want. I'm > > > trying something similar, but I don't see a solution yet that works in > > > all browsers. Do you intend to do the old table trick, setting one row > > > to height="0%", and the other to height="100%"? I think that doesn't > > > work in IE. Or how do you want to achieve this with tables? I assume, > > > you want to make the table stretch to 100% height, where the second > > > row should take up all remaining space? > > > > If OTOH, you don't want to make the whole thing stretch to 100% > > > height, then you can use divs! The first row will fit its height to > > > its contents. In that case you can assign the second row some fixed > > > height. > > > > Chris > > > > On Feb 23, 11:32 am, Andrew Hughes <ahhug...@gmail.com> wrote: > > > > Thanks István, > > > > > This sucks, really sucks! If you want to run "best fit" gwt gui's for > > > > mobile, desktop, 16:9, 4:3, 5:4 screens then you are going to encounter > > > > serious problems. We're not facing these problems, but we will have > > > > different widget's appearing depending on ACL roles (and hence the > > > > layout > > > > will be dynamic). Parent's won't always be aware of the content that > > > they're > > > > holding. > > > > > I know this was possible in the table base panels (pre-2.0) and perhaps > > > > I > > > am > > > > stuck with them. But I have also not seen an example of the table based > > > > panels in UIBinder's (and no I don't want a raw html <table> please). > > > I'll > > > > have to see what I can get working tomorrow. If I can't use table based > > > > panels in UIBinding then this sadly terminates UIBinding in our app. > > > > > :'( > > > > > --AH > > > > > 2010/2/23 István Szoboszlai <mrsz...@gmail.com> > > > > > > Hello, > > > > > > This was also my biggest problem with the GWT layout system I am > > > > > afraid > > > It > > > > > does not support dynamic resizing of divs depending on it's content. > > > > > > It somewhat makes sense, as if you use simple FlowPanels then that > > > resizes > > > > > itself. > > > > > > Still I would also very well use a Layout system that supports dynamic > > > > > resizing depending on content. The most obvious field of use for this > > > is > > > > > replacing the (so much hated) table components with floated divs. > > > > > > So I think this is a good feature request form the GWT team:) > > > > > > Best - Istvan > > > > > > Best Regards > > > > > - István Szoboszlai > > > > > istvan.szobosz...@inepex.com | inepex.com > > > > > > On Tue, Feb 23, 2010 at 6:25 AM, ahhughes <ahhug...@gmail.com> wrote: > > > > > >> Hi Guys, > > > > > >> The LayoutPanels typically take in a (sizing) unit (like PX or PC or > > > > >> EM) and a discrete size for each component, like: > > > > > >> <ui:UiBinder> > > > > >> <g:DockLayoutPanel unit='PX'> > > > > >> <g:north size='64'> > > > > >> <g:Label text="Example"></g:Label> > > > > >> </g:north> > > > > >> </g:DockLayoutPanel> > > > > >> </ui:UiBinder> > > > > > >> But what if I don't want to set a discrete size (whatever the unit), > > > > >> and I want the <g:north> to "auto fit" whatever is placed within the > > > > >> north component? > > > > > >> Cheers. > > > > > >> -- > > > > >> You received this message because you are subscribed to the Google > > > Groups > > > > >> "Google Web Toolkit" group. > > > > >> To post to this group, send email to > > > google-web-tool...@googlegroups.com. > > > > >> To unsubscribe from this group, send email to > > > > >> google-web-toolkit+unsubscr...@googlegroups.com<google-web-toolkit%2Bunsubs > > > > >> cr...@googlegroups.com><google-web-toolkit%2Bunsubs > > > cr...@googlegroups.com> > > > > >> . > > > > >> For more options, visit this group at > > > > >>http://groups.google.com/group/google-web-toolkit?hl=en. > > > > > > -- > > > > > You received this message because you are subscribed to the Google > > > Groups > > > > > "Google Web Toolkit" group. > > > > > To post to this group, send email to > > > google-web-tool...@googlegroups.com. > > > > > To unsubscribe from this group, send email to > > > > > google-web-toolkit+unsubscr...@googlegroups.com<google-web-toolkit%2Bunsubs > > > > > cr...@googlegroups.com><google-web-toolkit%2Bunsubs > > > cr...@googlegroups.com> > > > > > . > > > > > For more options, visit this group at > > > > >http://groups.google.com/group/google-web-toolkit?hl=en. > > > > -- > > > You received this message because you are subscribed to the Google Groups > > > "Google Web Toolkit" group. > > > To post to this group, send email to google-web-tool...@googlegroups.com. > > > To unsubscribe from this group, send email to > > > google-web-toolkit+unsubscr...@googlegroups.com<google-web-toolkit%2Bunsubs > > > cr...@googlegroups.com> > > > . > > > For more options, visit this group at > > >http://groups.google.com/group/google-web-toolkit?hl=en. -- You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To post to this group, send email to google-web-tool...@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
