elegant solution.
I don't think that your approach works well for dynamic content. I
don't really know the size of the cell tree in advance so I can't
adjust the size of the containing panel when placing the cell tree in
it.
At first, I used like you a HtmlPanel as my main container, and I had
outside scrolling working fine, but I had to switch from it when I
started to use a SplitLayoutPanel for one of my views, because the
split panel worked only when specifying the exact height for it, I
couldn't get it to work with a height of 100%.
So I switched to using RootLayoutPanel and converted all my outer
panels to layout panels and the SplitLayoutPanel started to work
correctly (not surprisingly, as the documentation for layout panels
clearly says that you have to attach them only to other layout
panels). Having solved that I bumped into this inner scrolling
problem.
From the layout panels documentation:
ScrollPanel... works well in layout panels (see below), which provide
it with the explicit size it needs to scroll properly.
And below we have this example:
<g:DockLayoutPanel unit='EM'>
<g:north size='4'>
<g:Label>Header</g:Label>
</g:north>
<g:west size='16'>
<g:Label>Navigation</g:Label>
</g:west>
<g:center>
<g:ScrollPanel>
<g:Label>Content Area</g:Label>
</g:ScrollPanel>
</g:center>
</g:DockLayoutPanel>
Which is like my code, except they use static content for the scroll
panel.
I suppose an elegant solution must exist, because almost all web apps
will use dynamic content.
On Jul 3, 4:22 am, Williame <william.eub...@uah.edu> wrote:
> I feel your pain. I've spent hours trying to make my center docklayoutpanel
> scrollable while at the same time make it replacable by new widgets based on
> menu choices. Most things worked fine by putting a Scrollpanel in the
> center block, except TabLayoutPanel put a few level inside it would never
> show the tab headers. I found that ResizeLayoutPanel can help. Hope it
> never gets deprecated.
>
> You can use Window.getClientWidth() and Window.getclientHeight() to get the
> visible window size in pixel, then subtract the size of the other screen
> elements. But this did not resize well for me and I did not want to write a
> lot of code to handle and propagate onResize.
>
> In the end I went with an html panel for my main outer interface, so I could
> use simple div elements for the top(north) elements, and used a
> ResizeLayoutPanel for the placeholder for content. In the java side of the
> uibinder code I put in a call to a ResizeLayoutPanel size adjustment after
> clearing and placing new panels into the ResizeLayoutPanel widget.
>
> <g:HTMLPanel styleName="{style.mainPanel}">
> <div class="{style.header}">My Company name</div>
>
> <div ...............................
> <!-- content widget placeholder -->
> <g:ResizeLayoutPanel ui:field="uberContent" title="Content"
> styleName="{style.appcontent}" height="384px" width="681px"/>
>
> </g:HTMLPanel>
>
> In the code to replace the content widget with a different widget, the panel
> size of the new widget can be used to resize the placeholder widget if the
> new panel is a fixed size layout panel. If it is not, you need to
> explicitly specify the size of the new panel:
>
> uberContent.clear()
> MyPanel panel = new MyPanel();
> uberContent.add(panel);
> adjustContent(panel.getOffsetHeight(),panel.getOffsetWidth());
>
> In adjustContent(int height, int width) method, reset placeholder widget
> size to just a little bigger than the new panel added to it:
>
> uberContent.setHeight(height + 50 + "px");
> uberContent.setWidth(width + 20 + "px");
>
> The css for the placeholder widget, uberContent, sets margin-bottom to keep
> the panel below the header div's. The scrolling seems to work like a normal
> web app, resizes work pretty well too. Tested with latest of each: IE,
> firefox, chrome, safari and opera. Even iPad(safari). The overflow css
> attribute seems to wreak havok on layout panels, especially tablayoutpanel.
> I have it set to "overflow: scroll;" for the style.mainpanel, outer
> htmlpanel. But not set at all for the ResizeLayoutPanel style.
> DockLayoutpanel sets overflow: hidden by design.
>
> I wouldn't be surprised if there are several better, more elegant solutions,
> which I would love to know of, but this worked for me. Hope it helps.
> <Discalimer> I am neither java, css or gwt expert. But do love gwt. Thank
> you Google!! </Disclaimer>
> -William
--
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-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.
No comments:
Post a Comment