【翻译】使用Sencha Touch创建基于Tizen应用程序
原文:Building a Tizen App With Sencha Touch
作者:Gautam Agrawal
Gautam Agrawal is Sencha's Sr. Product Manager for Frameworks (Ext JS, Touch, and GXT). He has held various product and engineering roles at Quantros and Integral, in SaaS and BI space, utilizing Sencha technologies. He holds a PhD and MS from State University of NY (SUNY) at Buffalo and a BE from Pune University.
简介
在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论坛上与我们分享一下你的感受。
【翻译】使用Sencha Touch创建基于Tizen应用程序的更多相关文章
- 用 Sencha Touch 构建移动 web 应用程序
Sencha Touch 是一个使用 HTML5.CSS3 和 JavaScript 语言构建的移动 web 应用程序框架,在本文中,学习如何应用您当前的 web 开发技能进行移动 web 开发.下载 ...
- 【翻译】Sencha Touch 2入门:创建一个实用的天气应用程序之三
原文:Getting Started with Sencha Touch 2: Build a Weather Utility App (Part 3) 作者:Lee BoonstraLee is a ...
- 【翻译】使用Sencha Touch开发Google Glass应用程序
原文:Developing for Google Glass with Sencha Touch 作者:Ross Gerbasi Ross Gerbasi is a Senior Engineer a ...
- 如何使用Sencha touch 构建基于Cordova的安卓项目
项目构建篇 1.生成sencha touch 项目 新建目录,在命令行进入该目录,sencha -sdk sdk-path generate app appName appPath 2.命令行中进入 ...
- 【翻译】探究Ext JS 5和Sencha Touch的布局系统
原文:Exploring the Layout System in Ext JS 5 and Sencha Touch 布局系统是Sencha框架中最强大和最有特色的一个部分. 布局要处理应用程序中每 ...
- Sencha Touch 和 jQuery Mobile 的比较
Sencha Touch 和 jQuery Mobile 的比较 英文原文:Sencha Touch vs jQuery Mobile 标签: Sencha Touch jQuery Mobile 1 ...
- sencha touch 常见问题解答(26-50)
26.sencha touch在华为.红米等部分手机下hide事件失效,msgbox无法关闭怎么办 答:请看http://www.cnblogs.com/cjpx00008/p/3535557.htm ...
- sencha touch 入门系列 (一)sencha touch 简介
参考链接:http://mobile.51cto.com/others-278381.htm Sencha touch 是基于JavaScript编写的Ajax框架ExtJS,将现有的ExtJS整合J ...
- sencha touch打包成安装程序
为了更好地向大家演示如何打包一个sencha touch的项目,我们用sencha cmd创建一个演示项目,如果你的sencha cmd环境还没有配置,请参照 sencha touch 入门系列 (二 ...
随机推荐
- Excel init
Sub Test() Dim r As Range Dim a As Integer a = For Each r In Range("b1:b6") If r.Font.Bold ...
- 【SSH系列】-- Hibernate持久化对象的三种状态
在上一篇博文中,小编主要简单的介绍了[SSH系列]--hibernate基本原理&&入门demo,今天小编来继续介绍hibernate的相关知识, 大家知道,Java对象的生命周期,是 ...
- Android全屏截图的方法,返回Bitmap并且保存在SD卡上
Android全屏截图的方法,返回Bitmap并且保存在SD卡上 今天做分享,需求是截图分享,做了也是一个运动类的产品,那好,我们就直接开始做,考虑了一下,因为是全屏的分享,所有很自然而然的想到了Vi ...
- android拍照获得图片及获得图片后剪切设置到ImageView
ok,这次的项目需要用到设置头像功能,所以做了个总结,直接进入主题吧. 先说说怎么 使用android内置的相机拍照然后获取到这张照片吧 直接上代码: Intent intentFromCapture ...
- memcached实战系列(五)Memcached: List all keys 查询所有的key
memcached可能当时设计的时候就把它定位为内存性的kv结构的缓存系统.所以没有持久化到磁盘的命令,也没有查看所有key的值得命令.可能觉得没必要吧,你要是缓存1个G内存的数据,自己都头大,还敢看 ...
- SQL 数据库语言分析总结(三)
这次介绍通过mysql-WorkBench这个工具来管理操作数据库. 创建和删除数据库 1.点击创建数据库按钮 2.选中后右键,出现drop schema一项,这个用来删除. 设置默认数据库 选中右键 ...
- Dynamics CRM2011 在Visual Studio中开启Javascript的Xrm.Page智能提示
前面一篇博文:http://blog.csdn.net/vic0228/article/details/49512699 讲到了在Visual Studio中开启xml编辑的智能提示,本篇接着来讲下如 ...
- Android Demo---如何敲出圆角的Button+圆角头像
经常玩儿App的小伙伴都知道,APP上面有很多按钮都是圆角的,圆形给人感觉饱满,富有张力,不知道设计圆角按钮的小伙伴是不是和小编有着相同的想法`(*∩_∩*)′,听小编公司开发IOS的小伙伴说,他们里 ...
- eclipse无法连接genymotion+Unable to start the Genymotion virtual device
八月的开头,带着希望和期待,小编继续着实习之路,闭眼呼吸,阳光勾勒微笑,做Android项目,真心想吐槽一下eclipse中的虚拟机,那速度真叫一个慢啊,她肯定是属乌龟的,要不就是蜗牛,这个让小编很是 ...
- kindeditor用法简单介绍
最近做毕业设计用了一个叫做kindeditor的文本编辑工具,相信很多人都用过,这货和fckeditor差不多,个人感觉这个的皮肤更好看,而且对中文的支持更好,没那么容易出现中文乱码问题.下次记录一下 ...