PDA

View Full Version : Scrolling doesn't work after update with HTML



wdonne
31 Mar 2011, 12:23 AM
Hi,

I have panels with layout set to 'fit' containing another panel with scroll set to 'vertical'. This is part of a larger structure:



items:
[
{
flex: 2,
height: '100%',
layout: 'fit',
xtype: 'panel',
items:
[
{
scroll: 'vertical',
xtype: 'panel'
}
]
},
{
flex: 5,
height: '100%',
layout: 'fit',
xtype: 'panel',
items:
[
{
scroll: 'vertical',
xtype: 'panel'
}
]
}
],


The scrolling panels are updated with HTML using the "update" method. The first time this results in both panels scrolling perfectly. After the next time, however, the containers appear to consider their contents no longer to be higher than the view port and hence the scrollbar occupies the entire height. Because of this scrolling doesn't work. You can see there is more content below by "stretching" a bit on the panel.

A difference between the first and next calls to update is that at the first call the panels haven't been rendered yet. It looks like the height of the contents isn't recalculated after an update with HTML of a rendered panel. I have tried to use the "doComponentLayout" and "doLayout" methods on the containing panels after the update, but to no avail.

Best regards,

Werner.

wdonne
31 Mar 2011, 12:25 AM
I forgot to mention I'm using version 1.0.1a.

Werner.

wdonne
31 Mar 2011, 1:59 AM
The error is mine entirely. The call to "doLayout" should have been to the inner scrolling panel instead of its container.

The whole sits in a panel that is part of a card layout panel. The left panel (inside the one with flex: 2) contains links that refresh the right one. The scrolling problem will occur for the right panel if "doLayout" isn't called on its container (the one with flex: 5). If the whole is shown following a card switch this is not necessary.

My suggestion is to add more "doLayout" calls inside of Sencha Touch at points where it is known that the layout is no longer valid.

Werner.