2013年3月23日 星期六

MAC OS X Snow Leopard上建立Xcode的PhoneGap專案

由於我本身用的是MAC OS X 10.6.8,沒有繼續升級,Xcode僅支援到4.2版,因此以下僅示範4.2版的Xcode如何建立PhoneGap專案:

1. 首先當然是下載並安裝Xcode,若你的作業系統版本跟我一樣是Snow Leopard,可直接使用以下BT連結:

http://thepiratebay.se/torrent/6721955/




2. 接著下載並安裝PhoneGap。注意,1.9版以上的PhoneGap已不支援4.2版Xcode,因此同為跟不上時代潮流的你請下載1.8.1版的PhoneGap:

http://phonegap.com/download/


3. 安裝好Xcode和PhoneGap後,開啓Xcode,選擇Create a new Xcode project


4. 選擇Cordova-based Application,然後按Next


5. 輸入專案名稱:


 6. 選擇專案儲存位置:


7. 噹啷,專案開出來了,所有圖示都是預設的,之後我們可以手動替換,以滑鼠左鍵按著欲替換的圖檔拖動到圖示框,即可替換:


8. 此時可以嘗試按下右上方的Run,開啓模擬器執行看看


9. 發現會開出Error訊息的空白頁面,這是正常的,因為我們還沒有加入www/index.html到專案:


10. 對著專案名稱按右鍵,選擇Add Files to "你的專案名稱"

11. 至專案儲存位置,加入www資料夾:


12. 加入後,可看到www資料夾已存在於專案中了:


13. 此時再按一次Run,即可看到Cordova成功運行的訊息:


14. 現在,可以將我們的網頁檔逐步加入到專案之中,直接由Finder複製檔案到專案的www資料夾內:

15. 複製後,Xcode專案內的檔案也會隨之更新:

記得若要替換index.html,首先須引入cordova-1.8.1.js:

<script type="text/javascript" charset="utf-8" src="cordova-1.8.1.js"></script>


15. 添加完畢後,可按Run來檢視成果囉:



沒有留言:

張貼留言