常規(guī)的Sencha touch 應(yīng)用都是"header content footer"結(jié)構(gòu),這樣的結(jié)構(gòu)無疑將使用TabPanel來實現(xiàn),而且TabPanel肯定是card布局,這樣就會如果要實現(xiàn)"view"之間的跳轉(zhuǎn),animateActiveItem()方法將被使用,

但是通過st的源碼

animateActiveItem: function(activeItem, animation) {var layout = this.getLayout(),defaultAnimation;if (this.activeItemAnimation) {this.activeItemAnimation.destroy();}this.activeItemAnimation = animation = new Ext.fx.layout.Card(animation);if (animation && layout.isCard) {animation.setLayout(layout);defaultAnimation = layout.getAnimation();if (defaultAnimation) {defaultAnimation.disable();}animation.on('animationend', function() {if (defaultAnimation) {defaultAnimation.enable();}animation.destroy();}, this);}return this.setActiveItem(activeItem);}

?

我們可以輕易的發(fā)現(xiàn)這個方法僅限于在Card布局中適用,

那么我們常常要是想做一個單一的panel時,來使用動畫跳轉(zhuǎn).我們的應(yīng)用要是不使用這樣的容器來實現(xiàn)怎么辦呢?

?

這里我們就需要使用一個整體的Panel(Main.js)來組織其他的Panel :

var panel = Ext.create('Ext.Panel', {layout: 'card',items: [{html: "Your Firse Panel xtype name"},{html: "Your Second Panel xtype name"},{html: "Your Third Panel xtype name"}] });panel.setActiveItem(0);

這樣首先加載的將是"

Your Firse Panel xtype"

如果需要跳轉(zhuǎn)這里需要注意的是.要使用該View設(shè)置其的setActiveItem("xtype name") 或者 animateActiveItem("xtype name");

over!

轉(zhuǎn)載于:https://www.cnblogs.com/Brose/p/st_panel_card.html

總結(jié)

以上是生活随笔為你收集整理的Sencha touch Panel之间的跳转(如不使用TabPanel或者Carousel控件而产生跳转的动画效果)...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。