PDA

View Full Version : Make a scrollable panel position on center of its container



Torakiki
22 Jun 2011, 5:25 PM
Hello there, I'm new to Sencha Touch and I'm trying hard to get my first app working :)

There's one problem driving me mad, hope you can help me!! Here's what happens:

My app has a TabPanel, containing 4 tabs. In one of them I need to display an image representing a map of a campus, which needs to be panned/scrolled around by the user.
I would like the map to appear centered within its container Panel, instead of appearing sticked to the bottom left corner. I searched the forum for some advice: found something but it isn't working for me...



mapp.views.Map = new Ext.Panel({
layout: "fit",
items:[
{
scroll: 'both',
width: 1000,
height: 792,
html:'<img src="img/map.png" width="1000" height="792" border="0" usemap="#Map" />',
listeners:{
afterrender: function(thisPanel) {
var d = thisPanel.body.dom;
d.scrollTop = (d.scrollHeight - d.offsetHeight)/2;
}
}
}
]
});

I also tried to bind the "scroll" event on the map Panel to track down the "scrollTop" value of that panel, but it always remains 0.
What am I doing wrong?

Thanks for your help!

Torakiki
23 Jun 2011, 3:33 PM
Bumping... Tried everything but still no luck :((