2015/3/19

開發 iOS Web App 在開發階段不用 xCode 重新編譯的方法

Web App 是一個APP裡面包一個網頁,這個網頁可以是 local file 也可以是一個網址。

如果你沒有一台網頁伺服器,你會選擇使用 local file 的方式。

或者當網頁是 local file 的時候,會有額外的存取能力,有些時候會為了這個能力去使用 local file。

正常流程是把做好的網頁放進 Macbook Pro 裡面的 xCode ,然後編譯成 app 發布到手機上做測試。

如果是這樣,那我不就每次改一點網頁就要重新編譯?

這問題有解嗎?有的。

我想到 iTools 可以修改 App 中的檔案這件事情。

所以可以這樣做:

先講結論:這樣做可行,而且效果十分顯著。


程式碼:https://github.com/etrex/webViewTest

這個程式的行為是當APP打開時,檢查Document 下有沒有 index.html ,如果沒有,就把在 xCode 做好的 index.html 複製到 Document。

然後用 UIWebView 讀取 /Document/index.html。

使用步驟:
1. 找一個 ios app 開發者帳號
2. 找一台 Makbook Pro,
3. 下載程式碼
4. 把這個 App 安裝到手機上,
5. 用 iTools 去改改看 index.html

我在 git 上放了測試用的網站,在 testWebCode 資料夾,裡面有一個 index.html 和一個 js 資料夾。網頁內容是跟這個網址 http://etrex.tw/a/Game/SlidingPuzzle.html 一樣的 。

附上修改index前後畫面
修改前 iTools

修改前 iPhone



修改後 iTools


修改後 iPhone



如果不考慮排版的話,完全可以正常的進行遊戲。這表示我們放進去的 js 檔有正確地被 index.html 載入。

測試大成功!!


最後附上用 iPhone 的 Chrome 來開這款遊戲時的畫面。

剛進入時的畫面

經過適當的縮放後



另外,關於這款遊戲,有興趣玩的可以玩玩看 http://etrex.blogspot.tw/2014/04/blindfold-sliding-puzzle.html

沒有留言: