Sencha Touch 程序设计之 Android 平台 Back 按键处理
2012-04-20 21:34
417 查看
2012
作者:润物无声 发布:2012-04-09 15:23 分类:移动开发
阅读:1105 次 抢沙发
利用 Sencha Touch 结合PhoneGap设计本地APP,免不了要分别处理android平台和iphone平台,两个平台的最大区别之一就是back键的处理。iphone平台没有back按键,只有home按键,按下该键的话程序会自动转入后台处理,该按键的效用等同于android平台的home按键,但是,android平台特殊的地方在于,它还有一个back键,熟悉了android平台的开发者或使用者,把该键的作用理解为退回程序的上一个页面,如果程序已经在主页面,此时则退出程序。
因为Sencha Touch对android平台进行了消息封装,默认对back键的处理,同home键的处理一致,这令很多android开发者或使用者使用其功能的话不太友好,我自己在调试程序的过程中就误操作过了N次,每次按下back键期望程序回退到上一个页面,没想到程序直接消失了,转到后台去了。
网上搜索了一些解决方案,各有利弊,汇总贴可参照Sencha Touch官方论坛《Why-can-t-I-control-Android-phone-s-hardware-Back-button-in-Sencha-with-PhoneGap》,下面介绍一下我设计的一个解决方案,在实测环境中工作良好,总结如下:
1. 首先在Sencha 启动代码中捕获android平台的back按键消息,阻止Sencha 框架的默认处理
2. 在子页面中注册back消息的监听器
3. 实现退出程序的处理,借助于PhoneGap
4. 实现页面跳转的处理(主页面采用card view,类似于扑克的翻牌)
Sencha Touch 程序设计之 Android 平台 Back 按键处理
作者:润物无声 发布:2012-04-09 15:23 分类:移动开发阅读:1105 次 抢沙发
利用 Sencha Touch 结合PhoneGap设计本地APP,免不了要分别处理android平台和iphone平台,两个平台的最大区别之一就是back键的处理。iphone平台没有back按键,只有home按键,按下该键的话程序会自动转入后台处理,该按键的效用等同于android平台的home按键,但是,android平台特殊的地方在于,它还有一个back键,熟悉了android平台的开发者或使用者,把该键的作用理解为退回程序的上一个页面,如果程序已经在主页面,此时则退出程序。
因为Sencha Touch对android平台进行了消息封装,默认对back键的处理,同home键的处理一致,这令很多android开发者或使用者使用其功能的话不太友好,我自己在调试程序的过程中就误操作过了N次,每次按下back键期望程序回退到上一个页面,没想到程序直接消失了,转到后台去了。
网上搜索了一些解决方案,各有利弊,汇总贴可参照Sencha Touch官方论坛《Why-can-t-I-control-Android-phone-s-hardware-Back-button-in-Sencha-with-PhoneGap》,下面介绍一下我设计的一个解决方案,在实测环境中工作良好,总结如下:
1. 首先在Sencha 启动代码中捕获android平台的back按键消息,阻止Sencha 框架的默认处理
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | var App = new Ext.application({ // ... APP 配置参数 launch : function () { // ... 界面初始化 BBGlobalData.mainPanel = Ext.create('Ext.Panel', { fullscreen: true, layout : 'card', cardAnimation : 'slide', items: [ Ext.create('BBShow.view.LoginPanel'), Ext.create('BBShow.view.HomePanel'), Ext.create('BBShow.view.MediaPanel'), Ext.create('BBShow.view.PicCarousel'), Ext.create('BBShow.view.ReportListPanel'), Ext.create('BBShow.view.ReportPanel'), ] }); Ext.Viewport.add(BBGlobalData.mainPanel); document.addEventListener('deviceready', function () { console.log('deviceready'); document.addEventListener("backbutton", function () { console.log('user presses the back button on Android'); // 获取当前的焦点页面,并发送自定义消息'back' BBGlobalData.mainPanel.getActiveItem().fireEvent('back'); }, false); }, false); } }) |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | /*定义登录面板*/ Ext.define('BBShow.view.LoginPanel', { extend: 'Ext.Panel', config: { items: [ { xtype: 'titlebar', docked: 'top', title: '用户登录' }, // 其他页面内容 ], listeners: [ { fn: 'onBack', event: 'back', //注册监听自定义back按键消息 } ] }, onBack: function() { //BBGlobalData.gotoHomePanel(); //如,跳转到其他页面 BBGlobalData.exitApp(); //或退出程序 }, }); |
1 2 3 | BBGlobalData.exitApp = function() { navigator.app.exitApp(); } |
1 2 3 | BBGlobalData.gotoHomePanel = function() { BBGlobalData.mainPanel.setActiveItem(1); } |
相关文章推荐
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- Android SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 在Cocos2d-x中处理Android 系统设备的Menu和Back按键的响应
- (转)【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- Android按键拦截处理最佳实践范例(以Back事件为例)
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- 【Android游戏开发十九】(必看篇)SurfaceView运行机制详解—剖析Back与Home按键及切入后台等异常处理!
- Android中Touch事件的处理
- Android中Touch事件的处理逻辑
- android学习笔记5 android按键事件处理代码走读[framework]
- android的按键处理
- Android 按键消息处理
- Android官方开发文档Training系列课程中文版:键盘输入处理之处理键盘按键
- Android4.x 如何处理Power按键