PDA

View Full Version : Resizable resize, but doesn't show the panel content[Solved]



Daniels
13 Jan 2010, 11:06 AM
I've added a Ext.Resizable on a Panel. This Panel starts reduced, so his contents isn't showed completely. When I resize the panel on browser it have a increase of width and height, but the panel doesn't expand. The new area is transparent. My code for Ext.Resizable is really simple and work for other things. Here it is:


compEl.resizer = new Ext.Resizable(compEl.id, {
handles : 's,e,se'
}); Someone have an idea why the new are it's coming transparent?

Daniels
14 Jan 2010, 2:05 AM
I still don't have idea why it happens. I add two images for help to understand my problem.

Condor
14 Jan 2010, 2:07 AM
Add resizeChild:true.

Daniels
14 Jan 2010, 2:11 AM
Add resizeChild:true.

Thanks for answering, Condor.

I'd tried the resizeChild. Actually, I'd tried almost every property of the Ext.Resizable, but my problem continues...

Condor
14 Jan 2010, 2:14 AM
What exactly is compEl?

If it is not an Ext.Element then you can't use resizeChild. In that case you'll have to resize the object yourself in the 'resize' event.

Daniels
14 Jan 2010, 2:18 AM
What exactly is compEl?

If it is not an Ext.Element then you can't use resizeChild. In that case you'll have to resize the object yourself in the 'resize' event.

The compEl is the element of comp. comp is a var who keep the reference to a Ext.Panel. I get compEl this way:


var compEl = Ext.get(comp.id);

Condor
14 Jan 2010, 2:23 AM
You can't just resize a panel el and expect the panel to update correctly!

You will need to write a 'resize' event listener for the Resizer that updates the panel size.

Daniels
14 Jan 2010, 2:30 AM
You can't just resize a panel el and expect the panel to update correctly!

You will need to write a 'resize' event listener for the Resizer that updates the panel size.

It really works, thanks man.

Just a little question. I'd tried it before that way:


compEl.resizer.on('resize', function(r,w,h,e) {
compEl.setWidth(w);
compEl.setHeight(h);
});

Why it doesn't work and the code bellow works fine?



compEl.resizer.on('resize', function(r,w,h,e) {
comp.setWidth(w);
comp.setHeight(h);
});

Condor
14 Jan 2010, 2:38 AM
An Ext.Panel consists of several Ext.Elements (el, header, bwrap, tbar, body, bbar, footer).

Resizing only a single element won't notify the panel of a change, so the panel also won't update the other elements.

Daniels
14 Jan 2010, 2:46 AM
Thanks for explanation, Condor. Problem solved :)