有几个插件似乎表明它是这样的，所以我们在编写自己的插件时大吃一惊。我们可以让它在浏览器中完美地工作，但是当我们尝试部署到设备时，它会出现可怕的错误——在视觉混乱中覆盖组件。有人对此有任何想法吗？
Ext.Viewport.add( Ext.create('WC.view.Wrapper') )
where then the wrapper is a List (Menu) and a Main(Main)
Ext.define('WC.view.Wrapper', {
extend: 'Ext.Container',
xtype: 'ObjectTabContainer',
requires: [
'WC.view.layout.RecordList', // Menu
'WC.view.layout.RightContainer' // Main
],
config: {
items: [
// Hidden appers to display no connection
{
xtype : 'ConnectionStatusIndicator',
docked : 'top'
},
// WC.view.layout.RecordList > list
{
xtype: 'RecordList',
id : 'recordlist'
},
// WC.view.layout.RightContainer > toolbars and data
{
xtype: 'RightContainer',
id : 'rightcontainer'
}
]
}
});
就 z-index 而言，我有
List > style : 'position: absolute; top: 0; left: 0; z-index: 2, height:
100%'
RightContainer > style : 'width: 100%; height: 100%; position: absolute;
top: 0px; left: 0px; opacity: 1; z-index: 3; opacity: 1'
问题是在设备上我看到两个组件略微重叠（不是完全从上到下......）+当我点击按钮时没有任何反应......我尝试使用警报尽可能多地调试，发生的事情是代码在这里停止，没有任何类型的错误......
Ext.define('WC.controller.SlideCtrl', {
extend: 'Ext.app.Controller',
/////////////////////////////////////////////////////////////////////////////
// Require elements for this class (otherwise require them at app.js
level)
/////////////////////////////////////////////////////////////////////////////
requires: [
'WC.view.layout.RecordList',
'WC.view.layout.RightContainer'
],
config: {
refs: {
RecordList : 'RecordList',
RightContainer: 'RightContainer',
menuButton : 'RightContainer RecordInterationToolbar
button[action=openMenu]'
},
control: {
menuButton: {
tap: 'onOpenMenuButtonTapped'
},
.......
........
onOpenMenuButtonTapped: function(){
alert('0')
var main = this.getRightContainer();
var menu = this.getRecordList();
alert('1') ====================>>>>>> here stops > doesn't even
enters the main.isClosed()
alert(main.isClosed())
if (main.isClosed()) {
alert('call open menu')
main.openMenu(menu.getOpenAnimDuration());
alert('after call open menu')
} else {
alert('call open close menu')
main.closeMenu(menu.getCloseAnimDuration());
alert('after call open close menu')
}
alert('end of onOpenMenuButtonTapped')
}
=========> I should at least get the alert('isClosed')
isClosed: function() {
alert('isClosed')
alert(this.getDraggable().offset.x)
alert('return')
return (this.getDraggable().offset.x == 0);
}
请记住，在浏览器中它看起来不错 + 控制器完成了它的肮脏工作！！！加上组件本身在我的设备上完美运行（我的意思是相同的 z-index 和控制器功能）