博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
sencha touch中实现页面之间的互相跳转
阅读量:6069 次
发布时间:2019-06-20

本文共 2498 字,大约阅读时间需要 8 分钟。

这两天应为一个页面跳转把我整的死去活来啊!官网的API不给力啊!资料太少了,害的我浪费了好长时间,最终还是弄好了,发现了一个关键问题所在:如果要使用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    );}

转载于:https://www.cnblogs.com/fyq891014/archive/2012/06/07/2990426.html

你可能感兴趣的文章
Ubuntu系统启用Apache Mod_rewrite模块
查看>>
再论堆栈 4 -——编程的物质基础!【转】【译】
查看>>
在MVC控制器里面使用dynamic和ExpandoObject,实现数据转义的输出
查看>>
hadoop怎么读?怎么发音
查看>>
LaTeX排版工具使用
查看>>
JS 一个修改ul的小示例
查看>>
python 递归
查看>>
原型链-面向面试
查看>>
shr 右移测试
查看>>
文件夹中的文件以目录的形式呈现
查看>>
java操作数据库出错
查看>>
linux基础-第十四单元 Linux网络原理及基础设置
查看>>
浅谈一下Windows下的用户权限
查看>>
什么是linux的ftp
查看>>
Python命令行解析argparse常用语法使用简介
查看>>
Spring 4 官方文档学习(十二)View技术
查看>>
jsp页面验证码(完整实例)
查看>>
学习建模 - UML
查看>>
Android解析WindowManager(一)WindowManager体系
查看>>
一个想法(续二):换个角度思考如何解决IT企业招聘难的问题!
查看>>