Re: Laying out a LayoutPanel
I would use a HeaderPanel. HeaderPanel provides header and footer that are __natively__ (naturally) sized by the browser. So here it goes empty div for the header div/ a table style div for the middle (resizable widget) div style=width: 100%; height: 100%; display: table div style=width: 50%; height: 100%; display: cell/ div style=width: 50%; height: 100%; display: cell/ /div and for the footer almost the same div style=width: 100%; height: 30px; display: table div style=width: 50%; height: 100%; display: cell/ div style=width: 50%; height: 100%; display: cell/ /div This will do the automatically resizing of the middle widgets for you. Instead of div you can consider Widgets, Composite or HTMLPanels or whatever to put in your UIBinder Vassilis On Thu, Feb 20, 2014 at 2:03 AM, Jens jens.nehlme...@gmail.com wrote: Use setWidgetTopBottom() for the upper layers: LayoutPanel layout = new LayoutPanel(); layout.add(leftTop); layout.setWidgetLeftWidth(leftTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetTopBottom(leftTop, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT); layout.add(rightTop); layout.setWidgetRightWidth(rightTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetTopBottom(rightTop, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT); layout.add(leftBottom); layout.setWidgetLeftWidth(leftBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(leftBottom, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.P http://style.unit.pt/T); layout.add(rightBottom); layout.setWidgetRightWidth(rightBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(rightBottom, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT http://style.unit.pt/); -- J. -- 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 google-web-toolkit+unsubscr...@googlegroups.com. To post to this group, send email to google-web-toolkit@googlegroups.com. Visit this group at http://groups.google.com/group/google-web-toolkit. For more options, visit https://groups.google.com/groups/opt_out. -- 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 google-web-toolkit+unsubscr...@googlegroups.com. To post to this group, send email to google-web-toolkit@googlegroups.com. Visit this group at http://groups.google.com/group/google-web-toolkit. For more options, visit https://groups.google.com/groups/opt_out.
Re: Laying out a LayoutPanel
Since I couldn't get SplitLayoutPanel to work as I wanted, I used your suggestion. Works like champ. Thanks! On Wed, Feb 19, 2014 at 6:03 PM, Jens jens.nehlme...@gmail.com wrote: Use setWidgetTopBottom() for the upper layers: LayoutPanel layout = new LayoutPanel(); layout.add(leftTop); layout.setWidgetLeftWidth(leftTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetTopBottom(leftTop, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT); layout.add(rightTop); layout.setWidgetRightWidth(rightTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetTopBottom(rightTop, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT); layout.add(leftBottom); layout.setWidgetLeftWidth(leftBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(leftBottom, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.P http://style.unit.pt/T); layout.add(rightBottom); layout.setWidgetRightWidth(rightBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(rightBottom, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT http://style.unit.pt/); -- J. -- 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 google-web-toolkit+unsubscr...@googlegroups.com. To post to this group, send email to google-web-toolkit@googlegroups.com. Visit this group at http://groups.google.com/group/google-web-toolkit. For more options, visit https://groups.google.com/groups/opt_out.
Re: Laying out a LayoutPanel
don't use LayoutPanel but instead using DockLayoutPanel or SplitLayoutPanel u can put them in East West, North, South easily meet all ur requirements (such as widgets taking up all spaces autorize when browser resizing). Your MainPresenter must use a panel that has word Layout such as LayoutPanel. On Thursday, February 20, 2014 9:31:19 AM UTC+11, Blake wrote: Greetings, I am trying to layout four widgets on a LayoutPanel. Each of the four take up 50% of the width. The bottom two are fixed size (30 pt). The top two should take up the remaining height. None of the widgets should overlap. Auto-resize on browser resize is desired. The closest I've gotten is: Widget leftBottom = ...; Widget leftTop = ...; Widget rightBottom = ...; Widget rightTop = ...; LayoutPanel layout = new LayoutPanel(); layout.add(leftTop); layout.setWidgetLeftWidth(leftTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(leftTop, 33, Style.Unit.PT, 100, Style.Unit.PCT); layout.add(rightTop); layout.setWidgetRightWidth(rightTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(rightTop, 33, Style.Unit.PT, 100, Style.Unit.PCT); layout.add(leftBottom); layout.setWidgetLeftWidth(leftBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(leftBottom, 5, Style.Unit.PT, 28, Style.Unit.PT); layout.add(rightBottom); layout.setWidgetRightWidth(rightBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(rightBottom, 5, Style.Unit.PT, 28, Style.Unit.PT); It comes close to correct except that part of the top two are cut off. I think this is because I have them at 100% but not starting at the bottom. I don't know how to tell it to, in essence, reserve some space at the bottom and take up the rest of the space. Any value I could use in the hight parameter of the top two would only be accurate for one browser size so I can use a fixed measurement or a fixed percent. I need a way of saying start x distance from the bottom and use the rest of the vertical space. I have spent some time on this. Some help would be greatly appreciated. Blake McBride -- 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 google-web-toolkit+unsubscr...@googlegroups.com. To post to this group, send email to google-web-toolkit@googlegroups.com. Visit this group at http://groups.google.com/group/google-web-toolkit. For more options, visit https://groups.google.com/groups/opt_out.
Re: Laying out a LayoutPanel
Use setWidgetTopBottom() for the upper layers: LayoutPanel layout = new LayoutPanel(); layout.add(leftTop); layout.setWidgetLeftWidth(leftTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetTopBottom(leftTop, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT); layout.add(rightTop); layout.setWidgetRightWidth(rightTop, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetTopBottom(rightTop, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT); layout.add(leftBottom); layout.setWidgetLeftWidth(leftBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(leftBottom, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.P http://style.unit.pt/T); layout.add(rightBottom); layout.setWidgetRightWidth(rightBottom, 0, Style.Unit.PCT, 50, Style.Unit.PCT); layout.setWidgetBottomHeight(rightBottom, 0, Style.Unit.PCThttp://style.unit.pt/, 30, Style.Unit.PT http://style.unit.pt/); -- J. -- 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 google-web-toolkit+unsubscr...@googlegroups.com. To post to this group, send email to google-web-toolkit@googlegroups.com. Visit this group at http://groups.google.com/group/google-web-toolkit. For more options, visit https://groups.google.com/groups/opt_out.
