Sencha Touch使得你可以便捷地創(chuàng)造一個(gè)基于HTML5的手機(jī)應(yīng)用，支持Android、iOS和黑莓等設(shè)備，并且在瀏覽器中創(chuàng)造原生APP般的體驗(yàn)。

你需要準(zhǔn)備好

首先，你需要下載免費(fèi)的Sencha Touch 2 SDK 和 SDK Tools （或者Sencha Cmd ) 。你還需要：
一個(gè)本地的web server
安裝

首先，把SDK壓縮包解壓到你的項(xiàng)目目錄。最好，這個(gè)目錄可以被你的HTTP服務(wù)器訪問(wèn)。比如，你可以從你瀏覽器訪問(wèn) http://localhost/sencha-touch-* 來(lái)訪問(wèn)Sencha Touch的文檔。
你還需要運(yùn)行SDK Tools( Sencha Cmd，注意SDK Tools 和 Sencha Cmd只需要安裝一個(gè)，在我的機(jī)器上，Sencha Cmd工作更加正常）安裝程序。SDK Tools會(huì)在你的PATH環(huán)境變量中增加sencha命令行工具，你可以用它來(lái)產(chǎn)生一個(gè)全新的模板應(yīng)用。為了檢查你的SDK tools是否安裝好，切到你的Sencha Touch目錄，輸入sencha命令。比如：

注意：你必須在下載好的SDK文件夾或者產(chǎn)生好的Touch app目錄中使用sencha命令

產(chǎn)生你的第一個(gè)應(yīng)用

現(xiàn)在，你有了Sencha Touch和安裝好的SDK tools，于是可以開(kāi)始生成一個(gè)應(yīng)用了。保證你仍然在Sencha Touch SDK目錄下，輸入下列命令：

這將會(huì)產(chǎn)生一個(gè)叫做GS的Sencha Touch應(yīng)用骨架，放在../GS目錄下。骨架應(yīng)用中包含了所有你創(chuàng)建一個(gè)Touch應(yīng)用所需要的東西，包括默認(rèn)的index.html，一份Touch SDK的拷貝，CSS，圖片和打包你的應(yīng)用所需的配置文件。

讓我們檢查一下你的應(yīng)用是否生成成功。假設(shè)你的SDK位于webroot文件夾，你應(yīng)該能從http://localhost/GS看到默認(rèn)app：

瀏覽代碼

使用你最喜歡的IDE或者文本編輯器打開(kāi)GS文件夾。文件夾結(jié)構(gòu)如下：

下面有一個(gè)對(duì)于每個(gè)文件和文件夾的簡(jiǎn)介：

• app - 放著模型(Models)，視圖(Views)，控制器(Controllers)和存儲(chǔ)(Stores)的目錄。
• app.js - 主Javascript入口。
• app.json - 配置文件，用來(lái)創(chuàng)建你的應(yīng)用的縮小(minified)版本。
• index.html - 你的應(yīng)用的HTML文件。
• packager.json - 配置文件，用來(lái)打包成iOS和Android應(yīng)用。
• resources - CSS和圖片。
• sdk(touch) - Sencha Touch SDK的拷貝。你不應(yīng)該修改這個(gè)文件夾中的內(nèi)容。

打開(kāi)app.js，你應(yīng)用的主入口點(diǎn)。

launch函數(shù)是你應(yīng)用的入口點(diǎn)。在默認(rèn)應(yīng)用下，他將會(huì)先隱藏loading畫(huà)面，然后創(chuàng)建一個(gè)Main視圖的實(shí)例，并把它加入Viewport。
Viewport采用的卡片布局，讓你可以添加元件到目錄中。默認(rèn)應(yīng)用添加Main視圖到viewport，然后我們看看Main視圖的代碼吧。

打開(kāi)app/view/Main.js，我們可以修改title屬性：

我們還可以修改頁(yè)面內(nèi)容：

現(xiàn)在，刷新你的瀏覽器，看看你的修改結(jié)果。