Sencha-touch : toolbar with buttons auto height
My problem, is how can I initiate a panel with a bottom toolbar with vertical buttons.
Here is my code
var filterActionsButtons = [
{
ui : 'confirm',
开发者_运维技巧 text: 'Apply for current view',
},
{
ui : 'action',
text: 'Apply and Save in your profile',
},
{
ui: 'decline',
text: 'Cancel',
handler: function () {
filterPanel.hide();
}
}
];
var filterPanel =
new Ext.Panel({
fullscreen: true,
modal: true,
floating: true,
centered: true,
//width: Ext.is.Phone ? 260 : 400,
//height: Ext.is.Phone ? 260 : 400,
//autoWidth: true,
layout: 'fit',
scroll: 'vertical',
html: '<h2>Agencies</h2>...',
dockedItems: [
{
xtype: 'toolbar',
dock: 'top',
title:'Manage your filters',
},
{
xtype: 'toolbar',
dock: 'bottom',
layout: {
type: 'vbox',
align: 'strech',
},
height: '100',
//height: 'auto',
items: filterActionsButtons,
}
],
});
It works because I specify a height: '100', but I want to specify an auto height or no height. When I specify 'auto' for height property, the buttons are small and align on left, AND when I click on one, he's (the button) strech!!!
So, how can I use height: 'auto' for toolbar with buttons with same width (strech automatically)?
Type
defaults : {
flex : 1
}
in your's toolbar properties
精彩评论