Re: GUI Design - Layout Panels

LayoutPanel can handle all use cases. For example, for your design you can do something like this (use Ui:Binder). It will keep the height of three layers constant, while one of the layers will take all the available space.

Now, when a user clicks on one of the menu options, you call contentPanel.clear(), and then populate it with the new content. Or, if your content is already wrapped in a panel, you can clear the ScrollPanel, and then add your new content panel to it.

<g:LayoutPanel>

    <g:layer top="0" height="52px">
        <g:FlowPanel>
            <g:InlineLabel styleName="menuOption">Option 1</g:InlineLabel>
            <g:InlineLabel styleName="menuOption">Option 2</g:InlineLabel> 
            <g:InlineLabel styleName="menuOption">Option 3</g:InlineLabel> 
        </g:FlowPanel>
    </g:layer> 

    <g:layer top="54px" height="26px">
        <g:FlowPanel>

               // Workspace widgets go here
        </g:FlowPanel> 
    </g:layer> 

    <g:layer top="80px" bottom="26px">

        <g:ScrollPanel>

            <g:FlowPanel ui:field="contentPanel" >

                // Your content goes here
            </g:FlowPanel> 
        </g:ScrollPanel>
    </g:layer>

    <g:layer bottom="0" height="26px"> 
        <g:FlowPanel>

               // Status bar content
        </g:FlowPanel> 
    </g:layer> 

</g:LayoutPanel>

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/MJqVzxpZr5EJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to google-web-toolkit+unsubscribe@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.