开发手册 欢迎您!
软件开发者资料库

Sencha Touch - 设备配置文件

Sencha Touch设备配置文件 - 从简单和简单的步骤学习Sencha Touch,从基本到高级概念,包括概述,环境,命名约定,架构,MVC解释,第一个应用程序,构建应用程序,迁移步骤,核心概念,数据,主题,设备配置文件,依赖关系,环境检测,事件,布局,历史和支持,上传和下载,查看组件,打包,本机IOS,API。

在当今的技术世界中,我们拥有多种设备,如移动设备,平板电脑,台式机和不同屏幕尺寸的笔记本电脑.因此,需要开发可从具有良好外观和感觉的所有设备访问的应用程序.但是,为不同设备开发不同代码非常耗时且成本高昂.

Sencha Touch通过提供设备配置文件功能帮助我们实现这一目标.基于活动配置文件,将运行和适用不同的依赖关系.

我们可以在编写应用程序代码时声明设备配置文件.我们可以有多个设备作为 :

Ext.application({   name: 'MyApp',   profiles: ['Phone', 'Tablet']});

一旦完成,配置文件将被加载为 :

  • MyApp.profiles.Phone.js

  • MyApp.profiles.Tablet.js

写一个简单的电话资料

Ext.define('Mail.profile.Phone', {   extend: 'Ext.app.Profile',   config: {      name: 'Phone',      views: ['phoneView']   },   isActive: function() {      return Ext.os.is('Phone');   }});

编写简单的平板电脑配置文件

Ext.define('Mail.profile.Tablet', {   extend: 'Ext.app.Profile',   config: {      name: 'Tablet',      views: ['tableView']   },   isActive: function() {      return Ext.os.is('Tablet');   }});

正如我们在配置文件中看到的,我们有isActive函数来确定特定设备是否处于活动状态.如果设备处于活动状态,则会加载并实例化相应的依赖关系.

如上例所示,如果我们使用的是手机设备,那么手机配置文件的isActive函数将返回true和依赖关系将加载与手机设备相关的内容;这里将加载phoneView.如果设备是平板电脑,那么手机配置文件的isActive功能将返回false,平板电脑配置文件的isActive功能将返回true并且将加载依赖性tabletView.

启动过程

这里要注意的另一点是,当我们在应用程序中有配置文件时,应用程序代码的加载和实例化将按以下顺序 : 去;

  • 首先实例化控制器,并且将加载每个控制器的init函数.

  • 将调用Profile的启动函数.

  • 将调用应用程序的启动函数.

配置文件和应用程序的启动函数都是可选的,因此如果我们不定义它们中的任何一个,它们将不会被调用.

查看以下代码,了解可以定义不同启动和初始化函数的位置和方式.

控制器的初始化函数

Ext.define('MyApp.controller.Main', {   extend: 'Ext.app.Controller',      init : function (){      Ext.Msg.alert('Controller's init method');   },      config: {      refs: {         tab: '#divId     }   }});

配置文件的启动功能

Ext.define('Mail.profile.Tablet', {   extend: 'Ext.app.Profile',   config: {      name: 'Tablet', views: ['tableView']   },   isActive: function() {      return Ext.os.is('Tablet');   }   launch : function() {      Ext.Msg.alert('profile's launch function');   }});

应用程序的启动功能

Ext.application({   name: 'Sencha', launch: function() {      Ext.Msg.alert(Application's launch function);   }});