3

I have a FormPanel inside a ScrollPanel. The ScrollPanel is located in the center part of DockLayoutPanel. I want to vertially and horizontally center the FormPanel inside the ScrollPanel. I tried a few ways to do this but no success.

I have tired putting a verticalPanel/horizontalPanel inside the scroll panel, and use it to wrap the formPanel. I set both scroll panel and horizontal panel to 100% width and height. However, the scroll panel is automatically resized according to the size of center part of DockLayoutPanel whereas the horizontal panel's size is always equals to the size of its child- form panel. So I cannot center the formpanel inside of horizontalPanel since their height and width are the same. I try to make the horizontalPanel's size be always the same as scrollPanel, but I have no idea how to do this. Setting horizontalPanel's size to 100% is not working.

So My question is this:

1.How do you center something in scrollPanel. I don't mind using css method if you know how to achieve this.

2.In my case above, is it possible to make the horizontalPanel to be always the same size as its parent container - scroll panel. If it is possible, my 1st question is solved then.

enter image description here

Joey
  • 2,732
  • 11
  • 43
  • 63
  • 1
    I don't see why you would wish to centre a panel within a scroll panel - as the scrolling would have no effect. Might as well use a dialog/popup panel. dialogbox.center(). – Blessed Geek Jul 31 '12 at 09:56
  • I want to center a panel within a scroll panel because I need to center something in the center part of DockLayoutPanel. The scroll panel is in the center of DockLayoutPanel. – Joey Aug 01 '12 at 05:42

1 Answers1

0

I had to center an image inside a horizontal scroll-panel. Sometimes I just have one image and sometimes there is a list of images to be centered and shown. I have fixed the size of the GWT image object and the width of the scroll panel.

I computed the scroll position inorder to center all the items and I used set scroll position (position can be -ve or +ve values).

When user scrolls the items then I would respect the user's decision and scroll them accordingly. However, if the user scrolls to extreme right of left, I would ensure that the scrolling positions are re-adjusted to scroll back to the boundary and not exceed it.

When the page is refreshed by scroll panel centres the items automatically.

In short, you need to center the items programmatically and by default the scroll panel would keep the items on one side (left and top).

Mitra
  • 1