Sencha-touch :带有自动高度按钮的工具栏
我的问题是如何启动带有带有垂直按钮的底部工具栏的面板。
这是我的代码
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,
}
],
});
它有效,因为我指定了高度:'100',但我想指定自动高度或没有高度。当我为高度属性指定“自动”时,按钮很小并在左侧对齐,当我单击其中一个时,他(按钮)伸展!
那么,如何对具有相同宽度的按钮(自动拉伸)的工具栏使用 height: 'auto' ?
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)?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
输入
您的工具栏属性
Type
in your's toolbar properties