跳轉方式1：

控制層：

bt_kycgFun : function() {this.setCard('myKycg','app.view.mphome.Kycg');},bt_zhxxFun : function() {var nextCard = Ext.getCmp('homeview')var card = null;if (typeof(nextCard) == 'undefined') {card = Ext.create('app.view.mphome.Zhxx');card.down('button[action=back]').on("tap", this.backSettings, this);} else {card = nextCard;}Ext.Viewport.animateActiveItem(card, {type : 'slide',direction : 'left'});},// 返回設置backSettings : function() {Ext.Viewport.animateActiveItem(this.getMyMainCard(), {type : 'slide',direction : 'right'});},//跳轉頁面id：下個頁面Card的id，createCard要創建頁面的地址setCard : function(id,createCard) {var nextCard = Ext.getCmp(id)var card = null;if (typeof(nextCard) == 'undefined') {card = Ext.create(createCard);card.down('button[action=back]').on("tap", this.backSettings, this);} else {card = nextCard;}Ext.Viewport.animateActiveItem(card, {type : 'slide',direction : 'left'});}

下級目錄必須有個返回的按鈕，然后在要跳轉的時候 已經給返回的按鈕寫了返回的時間。返回事件直接掉了這里的頁面直接進來。第二次進去怕重新創建，判斷了下有沒有創建，沒有創建的話就不創建直接通過id直接進去。不知道還有什么更好的辦法。請大家留言。

跳轉方式2：

Ext.define('app.view.mphome.Zhxx', {extend: 'Ext.navigation.View',xtype : "homeview",requires: ['app.store.ModuleTypes'],config: {id : 'homeview',defaultBackButtonText :'返回',navigationBar:{id:'homeBar',items : [{id: 'btnLogout',xtype: 'button',text: '返回',ui : 'back',align: 'left',action : 'back'}]},items: [{id:"showlist",title : Global.title,items :[{id : 'moduletypelist',xtype: 'list',docked: 'top',scrollable: 'vertical',flex: 1,width:'100%',height:'100%',store: 'ModuleTypes',onItemDisclosure:true,itemTpl: ['<div><b>{mkmc}</b></div>'].join('')}]}]} });
這里使用了navigation跳轉，他會自動生成返回跳轉。

跳轉3不帶動畫：

這個本來做的是下面有標簽頁的：

bt_qtkf2Fun : function() {var dzcg_qtkf = Ext.create('app.view.mphome.ktkf.Qtkf_dzcg');dzcg_qtkf.down('button[action=back]').on("tap",this.backSettings, this);// 隱藏主頁的返回Ext.getCmp("mp_toolbar").hide();Ext.getCmp("myKtkf_state").setValue("1");//改變card中第一個panel的狀態this.getMyKtkfCard().add(dzcg_qtkf);this.getMyKtkfCard().setActiveItem(dzcg_qtkf);},// 返回設置backSettings : function() {var card = this.getMyKtkfCard().getActiveItem();this.getMyKtkfCard().setActiveItem(0);// 刪除this.getMyKtkfCard().removeAt(1);// 顯示返回主頁的返回按鈕Ext.getCmp("mp_toolbar").show();Ext.getCmp("myKtkf_state").setValue("0");//改變card中第一個panel的狀態card.destroy();}

總結

以上是生活随笔為你收集整理的【SENCHA TOUCH】页面动画跳转切换的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。