sencha touch中实现页面之间的互相跳转

Ext.getCmp()来得到视图或者页面组建就得在引用的页面中添加id属性，因为Ext.getCmp()是通过id来取东西的。明白这点后下面的事就好办多了。

首先在控制层里面定义按钮的事件，并映射组建。

config:{
        refs:{
            camera:'#cameraview',//拍照页面
            description:'#descriptionview',//问题描述页面
            corrective:'#correctiveview',//整改要求页面
            captureButton:'button[action=captureButton]',//#拍照#拍照按钮
            selectButton:'button[action=selectButton]',//#拍照#选择照片按钮
            btnCameraNext:'button[action=btnCameraNext]',//#拍照#下一页按钮
            btnCameraSave:'button[action=btnCameraSave]',//#拍照#保存按钮
            selectTemplate:'button[action=selectTemplate]',//#问题描述#选择模板按钮
            btnDescriptionBack:'button[action=btnDescriptionBack]',//#问题描述#上一步按钮
            btnDescriptionSave:'button[action=btnDescriptionSave]',//#问题描述#保存按钮
            btnDescriptionNext:'button[action=btnDescriptionNext]',//#问题描述#下一页按钮
            btnCorrectiveBack:'button[action=btnCorrectiveBack]',//#整改要求#上一步按钮
            btnCorrectiveSave:'button[acyion=btnCorrectiveSave]',//#整改要求#保存按钮
            btnCorrectiveSubmit:'button[action=btnCorrectiveSubmit]'//#整改要求#提交按钮
        },
        control:{
            //按钮事件
            captureButton:{
                tap:'onCaptureButton'
            },
            selectButton:{
                tap:'onSelectButton'
            },
            btnCameraNext:{
                tap:'onCameraNext'
            },
            btnDescriptionBack:{
                tap:'onDescriptionBack'
            },
            btnDescriptionNext:{
                tap:'onDescriptionNext'
            },
            btnCorrectiveBack:{
                tap:'onCorrectiveBack'
            },
        }
    }

下面是具体的上一页、下一页的翻页事件。虽说有点繁琐，但功能算是实现了。

//向左翻页
slideLeftTransition:{
    type: 'slide',
    direction: 'left'
},
//向右翻页
slideRightTransition: {
    type: 'slide',
    direction: 'right'
},
onCameraNext:function(){
    Ext.Viewport.animateActiveItem(
        Ext.getCmp('descriptionview'),
        this.slideLeftTransition
    );
},
onDescriptionBack:function(){
    Ext.Viewport.animateActiveItem(
        Ext.getCmp('cameraview'),
        this.slideRightTransition
    );
},
onDescriptionNext:function(){
    Ext.Viewport.animateActiveItem(
        Ext.getCmp('correctiveview'),
        this.slideLeftTransition
    );
},
onCorrectiveBack:function(){
    Ext.Viewport.animateActiveItem(
        Ext.getCmp('descriptionview'),
        this.slideRightTransition
    );
}