Sencha Touch 2 快速入门系列(九) -- 配置(Profile)
来源:互联网 发布:ubuntu装在u盘上 编辑:程序博客网 时间:2024/06/06 05:29
本文已添加至Sencha Touch 2快速入门系列索引:http://blog.csdn.net/ardy_c/article/details/7544470
转载请注明出处:http://blog.csdn.net/ardy_c/article/details/8543597
设备配置(Device Profile)
现在是移动web应用将要工作于大量不同的设备中,小至手机,大至平板电脑。而用户希望在不同的设备上能得到不同的体验。尽管如此,你写的大部分应用逻辑和资源都是可以共享使用的。为不同的平台写app,既容易出错,也让人感到烦恼。非常感谢地,Device Profiles给我们提供了一种方式,让我们可以在不同种类的设备之间,尽可能多地共享我们写的代码,并且很容易地根据不同的设备进行行为、外观和工作流的自定义。
建立配置(Setting up Profile)
Device Profiles存在于一个应用的环境之中(context)。例如,如果我们想创建一个email应用为手机及平板使用,我们可以定义我们的app.js,如下
Ext.application({ name: 'Mail', profiles: ['Phone', 'Tablet']});
我们在上面的代码没有为应用定义一个启动的函数,因此,在(启动)那个时候它将会加载那两个配置。按照惯例,程序希望找到以下两个文件 app/profile/Phone.js 和 app/profile/Tablet.js 。下面是我们的适用于手机的配置文件:
Ext.define('Mail.profile.Phone', { extend: 'Ext.app.Profile', config: { name: 'Phone', views: ['Main'] }, isActive: function() { return Ext.os.is.Phone; }});
适用于平板的配置文件也是跟随相同的模式。在我们的手机配置文件里,我们只提供了三项信息:配置文件名,当这个配置被激活时将被加载的view集,和一个isActive函数。
isActive函数的作用是决定当什么设备访问时可以激活这项配置。目前,最大的分割点就是为手机和平板创建配置(profiles),使用集成的 Ext.os.is.iPhone 和 Ext.os.is.Tablet 属性。你可以在isActive函数里面写任何你喜欢的代码,只要当设备运行时它总是返回 true 或 false 即可。
决定激活的配置(Determining the Active Profile)
一但配置文件被加载,它们的isActive函数就会被依次调用。第一个返回true的配置将为被Application用作启动配置。这个配置也会被Application设定为当前的配置,并且Application准备加载这个配置里的所有指定的依赖:数据模型(models), 视图(views),控制器(Controllers)和构成这个app的其它类。
例如,让我们修改一下我们的Application,让它能够加载它自己的一些 Models 和 Views:
Ext.application({ name: 'Mail', profiles: ['Phone', 'Tablet'], models: ['User'], views: ['Navigation', 'Login']});当我们在手机是加载这个app 时,Phone配置将会被激活,并且Application将会加载以下文件:
- app/model/User.js
- app/view/Navigation.js
- app/view/Login.js
- app/view/phone/Main.js
这同样适用于所有的模型(Models)、视图(Views)、控制器(Controllers)和存储(Stores)在一个配置(Profile)中加载。这是非常重要的,它让我们可以很容易地在不同的配置中共享行为、视图逻辑及其它资源。如果你需要加载的类不适合这种约定的要求,你可以指定类的全称来代替:
Ext.define('Mail.profile.Phone', { extend: 'Ext.app.Profile', config: { name: 'Phone', views: ['Main', 'Mail.view.SpecialView'], models: ['Mail.model.Message'] }, isActive: function() { return Ext.os.is.Phone; }});正如上所见,你可以同时使用类的全名(例如:Mail.view.SomeView)进行匹配,以及使用相对路径的类名进行指定。所有定义在配置(Profile)里面的模型(Models)、视图(Views)、控制器(Controllers)和存储(Stores)都可以获得同样的代遇。这就意味着,如果你只想为平板加载多个模型(Models)或存储(Stores),但又不想加载如 Mail.model.tablet.User 这种相对路径的类,那你就必须通过使用类的全名来代替了(例如:Mail.model.User)。
启动过程(The Launch Process)
使用配置的启动过程几乎和不使用的情况一样。基于配置(Profile)的应用有三个阶段的启动过程。当全部依赖加载完成后,下面的事情就会发生:
1. 控制器被实例化,每一个控制器的 init 函数被调用;
2. 配置(Profile)的 launch 函数被调用;
3. Application 的launch 函数被调用。
当使用配置时,使用配置的launch函数去创建应用的初始化UI是常见的。在很多情况下,这意味着Application的launch函数几乎等于被移除了,因为在不同的配置中初始化的UI通常是不一样的(你依然可以使用Application范围的launch函数去做一些设备工作,例如分析或者配置无法预知的设置工作)。
一个典型的配置的launch函数应该像这样:
Ext.define('Mail.profile.Phone', { extend: 'Ext.app.Profile', config: { name: 'Phone', views: ['Main'] }, isActive: function() { return Ext.os.is.Phone; }, launch: function() { Ext.create('Mail.view.phone.Main'); }});p.s. Profile 和 Application的launch函数都是可选的,如果你没有定义它们,它们就不会被调用。
- Sencha Touch 2 快速入门系列(九) -- 配置(Profile)
- Sencha Touch 2 快速入门系列(一)-- 建立第一个Sencha Touch应用
- Sencha Touch 2 快速入门系列(二)-- 组件(Components)
- sencha touch 入门系列 (九)sencha touch 视图组件简介
- Sencha Touch 2 快速入门系列--索引
- Sencha Touch 2 快速入门系列--索引
- sencha touch 入门系列 (三)sencha touch 项目创建
- sencha touch 入门系列 (一)sencha touch 简介
- sencha touch 入门系列 (二)sencha touch 开发准备
- sencha touch 入门系列 (九) sencha touch 布局layout
- Sencha Touch 2 快速入门系列(五)-- 布局(Layouts)
- Sencha Touch 2 快速入门系列(六)-- 数据(Data)
- Sencha Touch 2 快速入门系列(七) -- 视图(View)
- Sencha Touch 2 快速入门系列(八) -- 控制器(Controller)
- Sencha Touch 2 快速入门系列(八) -- 控制器(Controller)
- Sencha Touch 2 快速入门系列(六)-- 数据(Data)
- Sencha Touch 2 快速入门系列(三)-- 组件之表格(Forms)
- Sencha Touch 2 快速入门系列(四)-- 组件之标签面板(TabPanel)
- Linux C学习之 stat.h
- 音乐(持续更新)
- Windows XP 中提供的键盘快捷键列表
- Arab Collegiate Programming Contest 2012 解题报告(约等于AK)
- 第十章 BIRT图表 .
- Sencha Touch 2 快速入门系列(九) -- 配置(Profile)
- Sencha Touch 2 快速入门系列(八) -- 控制器(Controller)
- Qt学习书籍、文章和链接等收集
- Git详解之四 服务器上的Git
- 第十章 BIRT图表(续) .
- HTML5--1,html5的生前身后
- IOS面试题详解
- Git详解之五 分布式Git
- iOS开发中随机数的用法