Sencha Touch - 设备配置文件

---

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

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 函数。
• 配置文件的启动函数将被调用。
• 应用程序的启动函数将被调用。

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

查看以下代码以检查在何处以及如何定义不同的启动和初始化函数。

控制器的初始化函数

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);
   }
});