使用Sencha Touch创建基于Tizen应用程序

简介

在Sencha Touch2.3.1，添加了对Tizen平台的支持。Tizen是一个基于Web的OS，且允许开发人员使用HTML 5技术来编写应用程序。与Tizen捆绑在一起的Web浏览器是当前最符合标准的移动浏览器之一。在本文，作为入门，将演示如何使用Sencha Touch来创建一个Tizen应用程序。

一个简单的Tizen应用程序——Tizen Tunes

我决定使用iTunes RSS源来创建一个简单的音乐播放应用程序（Tizen Tunes）。开始时，需要使用到Sencha Touch2.3.1框架和一个4.x版本的Sencha Cmd来创建并部署应用程序，还需要任何标准的代码编辑器。我开始根据Lee Boonstra的《Sencha Touch 2入门》这篇分三个部分详细介绍创建一个天气工具应用程序的文章来创建应用程序。

在我的应用程序中，需要3个简单的视图：主视图（包含应用程序标题和导航栏）、列表（显示从iTunes RSS返回的前100条音乐专辑），以及一个详细信息面板（包含歌曲预览图片和用来播放选择歌曲的播放器）。此外，还需要为iTunes RSS源创建模型、为源代理返回的数据创建存储（store）和一个从列表中选择歌曲并在详细信息面板播放他们的控制器。

下一步需要为应用程序设置适用于Tizen平台的主题。Sencha Touch 2.3.1提供了额外的Tizen主题，所要做的是修改app.json文件来设置适当的主题资源并重新生成。

在app.json文件中，默认的Sencha Touch主题定义如下：

"css": [{
        "path": "resources/css/sencha-touch.css",
        "platform": [ "phone", "tablet", "desktop" ],
        "theme": "Default",
        "update": "delta"
}]

需要修改为以下代码：

"css": [{
        "path": "resources/css/tizen.css",
        "platform": [ "tizen" ],
        "theme": "Tizen",
        "update": "delta"
}]

使用新的配置重新生成应用程序后的效果如下：

由于Sencha Touch为Tizen主题提高了暗和亮两种变化（暗是默认），而我想将应用程序切换到亮主题，因而下一步要做的就是这个。要将主题切换到亮渐变的重点是添加/修改app.js文件中的其他配置：

Ext.application({
    views: [
        'MainView', 'DetailPanel', 'SongList'
    ],
    controllers: [
        'Songs'
    ],
    name: 'TizenTunes',
    themeVariation: 'light',
    launch: function() {
        Ext.create('TizenTunes.view.MainView', {fullscreen: true});
    }
});

还可以在launch方法内使用以下代码来切换主题（在某些时候可能需要动态来实现）：

TizenTunes.app.setThemeVariation ('light');

在模拟器上运行Tizen应用程序
为了测试应用程序，我想使用Web模拟器，这个可以在Tizen开发者网站的Tizen SDK中找到。在Mac OSX中使用安装管理器来安装Tizen IDE给我带来了一些挑战。如果希望了解更多信息，我建议使用这个Youtube视频，且在Tizen开发者论坛上的帖子。

一旦解决了Tizen IDE的运行问题，就可以访问Tizen Web模拟器了，且可以开始测试Tizen Tunes应用程序了。

希望本示例对创建你的Tizen应用程序会有所帮助。去尝试一下并在Sencha论坛上与我们分享一下你的感受。

作者: Gautam Agrawal
原文: http://www.sencha.com/blog/building-a-tizen-app-with-sencha-touch/
译者: 黄灯桥
译文: http://blog.csdn.net/tianxiaode/article/details/18354545