PDA

View Full Version : Component Alignment?



alejandroNNU
1 Nov 2013, 6:49 AM
I have a label inside a panel that I want centered (horizontally) within the panel at all times, how can I achieve this? The only option I see there is defaultAlign but it doesn't seem to change anything, the panel that the label is in does have an absolute layout though, so I'm not sure if that affects it. Any help would be greatly appreciated.

scottmartin
4 Nov 2013, 1:21 PM
Something like this?



Ext.create('Ext.form.Panel', {
title: 'Simple Form',
bodyPadding: 5,
width: 350,
height: 200,

title: 'MyPanel',

renderTo: Ext.getBody(),

html: '<center>This text will be center-aligned.</center> '
});

alejandroNNU
5 Nov 2013, 7:36 AM
not exactly, I have a label component, and it's text is going to be changing constantly, also the panel it's on will be able to get resized, so I just want to keep it centered within the panel, is there an option for that?

droessner
5 Nov 2013, 8:59 AM
You could use the hbox layout with pack: 'center'. Something like this:



Ext.create('Ext.form.Panel', {
title: 'Simple Form',
bodyPadding: 5,
width: 550,
height: 200,
title: 'MyPanel',
renderTo: Ext.getBody(),
layout: {
type: 'hbox',
pack: 'center'
},
items: [{
xtype: 'label',
text: 'Your text label'
}]
});