010-57213791
Sencha Touch使得你可以便捷地创造一个基于HTML5的手机应用,支持Android、iOS和黑莓等设备,并且在浏览器中创造原生APP般的体验。
你需要准备好
首先,你需要下载免费的Sencha Touch 2 SDK 和 SDK Tools (或者Sencha Cmd ) 。你还需要:
一个本地的web server
安装
首先,把SDK压缩包解压到你的项目目录。最好,这个目录可以被你的HTTP服务器访问。比如,你可以从你浏览器访问 http://localhost/sencha-touch-* 来访问Sencha Touch的文档。
你还需要运行SDK Tools( Sencha Cmd,注意SDK Tools 和 Sencha Cmd只需要安装一个,在我的机器上,Sencha Cmd工作更加正常)安装程序。SDK Tools会在你的PATH环境变量中增加sencha命令行工具,你可以用它来产生一个全新的模板应用。为了检查你的SDK tools是否安装好,切到你的Sencha Touch目录,输入sencha命令。比如:
2.
$ sencha
3.
Sencha Command v2.0.0
for
Sencha Touch 2
4.
Copyright (c) 2012 Sencha Inc.
5.
......
注意:你必须在下载好的SDK文件夹或者产生好的Touch app目录中使用sencha命令
产生你的第一个应用
现在,你有了Sencha Touch和安装好的SDK tools,于是可以开始生成一个应用了。保证你仍然在Sencha Touch SDK目录下,输入下列命令:
2.
[INFO] Created file /Users/nickpoulden/Projects/sencha/GS/.senchasdk
3.
[INFO] Created file /Users/nickpoulden/Projects/sencha/GS/index.html
4.
[INFO] Created file /Users/nickpoulden/Projects/sencha/GS/app.js
5.
...
这将会产生一个叫做GS的Sencha Touch应用骨架,放在../GS目录下。骨架应用中包含了所有你创建一个Touch应用所需要的东西,包括默认的index.html,一份Touch SDK的拷贝,CSS,图片和打包你的应用所需的配置文件。
让我们检查一下你的应用是否生成成功。假设你的SDK位于webroot文件夹,你应该能从http://localhost/GS看到默认app:
浏览代码
使用你最喜欢的IDE或者文本编辑器打开GS文件夹。文件夹结构如下:
下面有一个对于每个文件和文件夹的简介:
打开app.js,你应用的主入口点。
launch函数是你应用的入口点。在默认应用下,他将会先隐藏loading画面,然后创建一个Main视图的实例,并把它加入Viewport。
Viewport采用的卡片布局,让你可以添加元件到目录中。默认应用添加Main视图到viewport,然后我们看看Main视图的代码吧。
打开app/view/Main.js,我们可以修改title属性:
2.
title:
'Woohoo!'
我们还可以修改页面内容:
现在,刷新你的浏览器,看看你的修改结果。
下一篇:北京网站建设公司是怎么做优化的