1
我正在使用sencha應用程序，並且我們有3個選項卡面板，但希望將其他按鈕添加到選項卡欄而不是滑動到選項卡，僅覆蓋第一個tabpanel頂部的按鈕面板。例如，如果您在第一個選項卡上並按下按鈕，則覆蓋面板顯示在頂部。如果您位於第三個標籤面板上，它會將您帶回第一個tabpanel並覆蓋按鈕面板。我如何使用sencha tabbar上的按鈕來放置覆蓋面板
我可以顯示按鈕，但無法將它與面板上的按鈕疊加在一起。
mainPanel中：
Ext.define("MyApp.view.Main", {
extend: 'Ext.Panel',
requires: ['Ext.TitleBar', 'Ext.tab.Panel'],
config: {
fullscreen: true,
id: 'viewMain',
layout: 'vbox',
items: [
{
xtype: 'topbar'
},
{
xtype: 'tabpanel',
tabBarPosition: 'bottom',
flex: 1,
id: 'mainTabs',
cardSwitchAnimation: false,
animation: false,
ui: 'bottom',
items: [
{
xtype: 'mappanel',
id: 'mapPanel'
},
{
xtype: 'showbutton'
},
{
xtype: 'searchpanel'
},
{
xtype: 'directionspanel'
},
{
xtype: 'rcpanel'
}
]
}
]
}
});
ShowButton：
Ext.define("MyApp.view.ShowButton", {
extend: 'Ext.Button',
requires: ['Ext.Button'],
xtype: 'showbutton',
config: {
title: 'Show',
iconCls: 'locate4',
id: 'showBtn',
text: 'OK',
id: 'showBtn',
iconCls: 'locate4',
iconMask: true,
handler: function() {
this.fireEvent('onShowBar', this);
}
}
});
ShowController
Ext.define('MyApp.controller.ShowController', {
extend: 'MyApp.controller.BaseController',
config: {
refs: {
},
control: {
}
},
//called when the Application is launched, remove if not needed
launch: function(app) {
},
onShowBar: function() {
var newShowBar = {
xtype: 'showBar',
docked: 'bottom'
};
this.add([newShowBar]);
}
});
表演酒吧：
Ext.define("MyApp.view.ShowBar", {
extend: 'Ext.Panel',
xtype: 'showbar',
config: {
iconCls: 'locate4',
docked: 'bottom',
modal: false,
style: 'opacity:0.8',
items: [
{
iconCls: 'home',
iconMask: true,
poiGroup: 'accomm'
},
{
iconCls: 'star',
iconMask: true,
poiGroup: 'attractions'
}/*,
{
iconCls: 'hotoffer',
iconMask: true,
poiGroup: 'membersavings'
}*/
]
}
});