How do I make a smartgwt vlayout overlap another vlayout?

Question

I am working with SmartGWT 4.0 and I have a screen which has 2 side-by-side VLayouts within an HLayout. So, there is basically a Vlayout on he left and right side of the HLayout.

I want to be able to take the first VLayout on the left, and when I change the size of it, I want it to overlap the Vlayout on the right, and not just push the other layout smaller.

This example from the SmartGWT Showcase, shows 2 Labels next to each other. As the size of the "Member1" is widened, it shrinks the size of "Member 2" label. I'd like to see the "Member 1" label overlap and hide the "Member 2" label.

Seems like a simple problem, I hope someone can help with this.

Answer 1

SO .. I have a SmartGWT Canvas that has an HLayout (headerLayout) for a header, and then a much larger HLayout (bodyLayout) for the main body of my web-app.

I did addMember(leftSidebar), and then addMember(workarea) to the "bodyLayout".
When I expand sidebar, by changing it's width, the "workarea" layout pushes over, and resizes accordingling.

But, what I wanted to happen was that the sidebar overlaps "workarea".

I then changed addChild(sidebar) to addMember(workarea) to "bodyLayout", this kind of worked except that the leftSidebarwas on top of "workarea". Ideally, I would have liked the workarea to start just right of the leftSidebar.

The way I did this was to:

bodyLayout.addChild(leftSidebar);
bodyLayout.addMember(sidebarSpacer);
bodyLayout.addMember(workarea);

The first addMember is just a spacer that the work area can be next to on the right. This "sidebarSpacer" just sits there and is a big label with nothing in it. The child "leftSidebar" can sit on top of it, and overlap it, but this is what I wanted. The workarea now appears to be to the right of the sidebar. When I expand the sidebar, it overlaps the workarea underneath it.

There might be a better way to handle this in SmartGWT, but this worked for me for now until I can find something better.

Hope this helps someone else.