View Full Version : A few Layout problems

alex weber
3 Jun 2011, 9:41 PM
Hello all,

I'm using ExtJS 3.3, and I'm having a few layout problems that I'm hoping someone will know the answer to. I don't have a succinct example to post right now, but I'll make one if it becomes necessary.

http://papalocksmith.com/ (http://www.papalocksmith.com/)
Anyway, I'm using the GroupTabs sample, and I have a number of Panels inside each tab. Many of these panels are collapsed by default, all have titles so they have titlebars. My basic structure within each tab section is:
Containing Panel (Collapsible)->Some Number of Panels with Column Layout->2-3 Panels with Form Layout (these serve as my columns)

This is generally getting me the look I'm going for, however, I'm having a few problems under specific conditions that I can't seem to solve:
1) When I expand a collapsed Panel for the first time, the contents are initially rendered at some strange size, and then immediately re-arrange/resize themselves after the expansion animation completes. While this ultimately comes out right, it looks very unprofessional when it happens. I've tried using the "forceLayout: true" property on every panel in the hierarchy, but it seems to have no effect at all.

2) When enough Panels are expanded, a scrollbar becomes necessary. This works fine, and the scrollbar appears/disappears as needed. However, the items laid out within each panel don't appear to account for the scrollbar. This is especially problematic for the Panel which CAUSES the scrollbar to appear when it initially lays itself out, as it becomes cut off on the right. Panels which expand after the scrollbar is already there size correctly.

Pointers would be appreciated, I'm new to ExtJS and this is my first project with it, so I'm probably overlooking obvious things. But if it's not that obvious I'll build a small sample which demonstrates the problem. Thanks in advance!

Tim Toady
4 Jun 2011, 5:46 AM
Something like this is difficult to diagnose without seeing your code.