linuxyf
30 Nov 2011, 1:08 AM
How to show a view on the top level??
linuxyf
1 Dec 2011, 12:54 AM
i refer to kiva example (detail.js), show several sub views from main view by animation effect.
sub view1
Ext.define('ShopSystem.view.view1', {
extend: 'Ext.Container',
xtype: 'zansetting',
id: 'zansetting',
requires: [
'ShopSystem.view.list01'
],
config: {
modal: true,
centered : true,
hideOnMaskTap : false,
padding: 0,
cls: 'ZanCls',
ui: 'zansetting',
// we always want the sheet to be 400px wide and to be as tall as the device allows
width: 400,
height: 600,
top: 100,
left:100,
//kanrival: null,
layout: {
type: 'vbox',
align: 'stretch'
},
items: [{
xtype: 'list01'
}]
},
animationDuration: 500,
show: function(animation) {
this.callParent();
Ext.Animator.run([{
element : this.element,
xclass : 'Ext.fx.animation.SlideIn',
direction: Ext.os.deviceType == "Phone" ? "up" : "left",
duration : this.animationDuration
},
{
element : 'ext-mask-1',
xclass : 'Ext.fx.animation.FadeIn',
duration: this.animationDuration
}
]);
},
hide: function(animation) {
var me = this,
mask = Ext.getCmp('ext-mask-1');
//we fire this event so the controller can deselect all items immediately.
this.fireEvent('hideanimationstart1', this);
//show the mask element so we can animation it out (it is already shown at this point)
mask.show();
Ext.Animator.run([{
element : me.element,
xclass : 'Ext.fx.animation.SlideOut',
duration : this.animationDuration,
preserveEndState: false,
direction: Ext.os.deviceType == "Phone" ? "down" : "right",
onEnd: function() {
me.setHidden(true);
mask.setHidden(true);
}
}, {
element : 'ext-mask-1',
xclass : 'Ext.fx.animation.FadeOut',
duration: this.animationDuration
}]);
},
initialize: function() {
this.on({
scope: this,
hiddenchange: this.onHiddenChange
});
},
onHiddenChange: function(me, hidden) {
if (!hidden) {
}
},
});
sub view2
Ext.define('ShopSystem.view.view2', {
......same as sub view1
items: [{
xtype: 'list02'
}]
},
......same as sub view1
the sub view1 and sub view2 can be called from main view. the sub view2 also can be called from sub view 1
after the main view is started, if i show sub view1 firstly, then i can show sub view2 from sub view1 or main view normally.
but if i show sub view2 from main view firstly, and hide the sub view 2. then i show sub view1 from main view and show sub view2 from sub view1, i found the sub view2 is showed under the sub view1. i want the view showed recently always be on the top level, but right now sub view2 is covered by sub view1.
Powered by vBulletin® Version 4.1.5 Copyright © 2013 vBulletin Solutions, Inc. All rights reserved.