ScrollPanel not shoing up!

58 views
Skip to first unread message

suvesh

unread,
Sep 29, 2011, 1:16:30 AM9/29/11
to Google Web Toolkit
Greetings,

I recently started learning GWT and have been facing an issue related
to ScrollPanel as described below:
I have got a DockLayoutPanel added to RootLayoutPanel and at the
center of DockLayoutPanel I placed another DockLayoutPanel that I
intend to use for diplaying various views by swapping them in-out via
presenters as and when needed based upon the events on the gwt
controlls.

<g:DockLayoutPanel unit='EM' >
<g:center>
<g:DockLayoutPanel ui:field='mainPanel'
styleName='{style.mainPanel}' ></g:DockLayoutPanel>
</g:center>
</g:DockLayoutPanel>

The first view that I placed at mainPanel has got following structure

<g:HTMLPanel>
<div><g:FlexTable ui:field='header' styleName='{style.header}'
cellSpacing='0' cellPadding='0'/></div>
<g:ScrollPanel>
<g:FlexTable ui:field='table'
styleName='{style.table}' cellSpacing='0' cellPadding='0'/>
</g:ScrollPanel>
</g:HTMLPanel>

The scrollPanel on the FlexTable named 'table' would not shou up even
if I had more rows of data in the 'table' enough to fill the
'mainPanel' center.

I could have used the ScrollPanel instead of the DockLayoutPanel
mainPanel but that causes the 'header' and 'table' to scroll wheras
the right thing to do is scroll only the data in FlexTable 'table'.


Can someone please help or re-direct me to similar issue in the forum.


Thanks in advance

Suvesh


Sudhakar Abraham

unread,
Sep 29, 2011, 8:51:51 AM9/29/11
to Google Web Toolkit
Do not set the size in percentage like(90%) for the widgets inside
ScrollPanel. Instead use unit in gwt like (PX, EM ect..).

S. Abraham
www.DataStoreGwt.com
Persist objects directly in GAE

Ryan Groten

unread,
Sep 29, 2011, 12:13:57 PM9/29/11
to google-we...@googlegroups.com
Why not try putting the view into a DockLayoutPanel itself to separate the header from content?

<g:DockLayoutPanel size="30">
  <g:north>
    <g:FlexTable ui:field='header' styleName='{style.header}' cellSpacing='0' cellPadding='0'/>
  </g:north>
  <g:center>
    <g:ScrollPanel>
      <g:FlexTable ui:field='table' styleName='{style.table}' cellSpacing='0' cellPadding='0'/> 
    </g:ScrollPanel>
  </g:center>
</g:DockLayoutPanel>

Also may want to consider replacing your mainPanel DockLayoutPanel with something like a SimpleLayoutPanel if it's only going to hold a single view.

suvesh

unread,
Sep 30, 2011, 1:24:19 AM9/30/11
to Google Web Toolkit
Well, there are several views so is the need for the inner
DockLayoutPannel. Though not sure how usually its done otherwise ?
Trying to playaround with as much codeas posssible :-)

As a side note I just had to set the size of the ScrollPanel as
suggested on GWT developer guideline and it started appearing nicely.

<g:HTMLPanel >
<div><g:FlexTable ui:field='header' styleName='{style.header}'
cellSpacing='0' cellPadding='0'/></div>
<g:ScrollPanel width='100%' height='100%'>

<g:FlexTable ui:field='table' styleName='{style.table}'
cellSpacing='0' cellPadding='0'/>

</g:ScrollPanel>
</g:HTMLPanel>

This is the link that gave the Hint:

http://code.google.com/webtoolkit/doc/latest/DevGuideUiPanels.html
under "Tables and Frames" towards the end of the page.


Thanks very much for your time and help,

Suvesh
Reply all
Reply to author
Forward
0 new messages