PDA

View Full Version : defaultAlign property not working



cflynn07
1 Feb 2012, 1:42 PM
dockedItems: [{ xtype: 'toolbar',
dock: 'bottom',
layout: 'hbox',
pack: 'center',
items: [{
xtype: 'button',
text: 'menu button',
menu: {
xtype: 'menu',
defaultAlign: 'tr-bl',
width: 300,
height: 300,
items: [
{text: 'item 1'},
{text: 'item 1'},
{text: 'item 1'}
]
}
}]
}],


I have a menu that's paired with a button on a toolbar, and I'm attempting to play with the 'defaultAlign' property to change how that menu is anchored to the button. The first time I open the menu it appears to be attached to 'bl-bl' so it's directly over the button.

The second time I click the button the menu is anchored at 'bl-tl' regardless of what I specify for defaultAlign.

Ext JS 4.0.7

Second time after opening:

31262

mitchellsimoens
2 Feb 2012, 8:28 AM
This has and hasn't been fixed in 4.1.0 beta2. This works just fine at aligning the menu to the top of the button:


new Ext.container.Viewport({
layout : 'fit',
items : {
xtype : 'panel',
dockedItems : [
{
xtype : 'toolbar',
dock : 'bottom',
items : [
{
xtype : 'button',
text : 'Add',
menu : {
items : [
{ text : 'Item 1' },
{ text : 'Item 2' }
]
}
}
]
}
]
}
});

But testing this more as to why this worked and not yours I found a new bug that we get to fix. The bug appears when you give the menu a height, then the menu is aligned 1/3 way up from the bottom:


new Ext.container.Viewport({
layout : 'fit',
items : {
xtype : 'panel',
dockedItems : [
{
xtype : 'toolbar',
dock : 'bottom',
items : [
{
xtype : 'button',
text : 'Add',
menu : {
height : 300,
items : [
{ text : 'Item 1' },
{ text : 'Item 2' }
]
}
}
]
}
]
}
});