在行動裝置上執行 Chrome 應用程式的工具鍊處於早期開發人員預覽階段。可以 歡迎您使用 GitHub Issue Tracker 和 Chrome 應用程式開發人員論壇提出意見 Stack Overflow 或 G+ 開發人員頁面。
總覽
您可以透過以 Apache 為基礎的工具鍊，在 Android 和 iOS 上執行 Chrome 應用程式。 Cordova：一種開放原始碼行動開發架構，可透過原生應用程式建構行動應用程式 功能，透過 HTML、CSS 和 JavaScript 完成。
Apache Cordova 使用原生應用程式殼層包裝應用程式的網頁程式碼，並可讓您
透過 Google Play 和/或 Apple App Store 發布混合型網頁應用程式。使用 Apache Cordova
現有的 Chrome 應用程式則可以使用 cca (c ordova c hrome a pp) 指令列
如果偏好在終端機視窗中工作
可使用 Google Cloud CLI gcloud 指令列工具
其他資源
- 使用 Cordova 進行開發時，請留意下列特殊注意事項。 請參閱注意事項一節
- 如要查看行動裝置支援哪些 Chrome API，請前往 API 狀態頁面。
- 如要在沒有工具鍊的 Android 裝置上預覽 Chrome 應用程式，請使用 Chrome 應用程式 開發人員工具 (ADT)。
讓我們開始吧！
步驟 1：安裝開發工具
Chrome 行動應用程式行動版工具鍊可指定 iOS 6 以上版本和 Android 4.x 以上版本。
所有平台的開發依附元件
需要搭配
npm的 Node.js 0.10.0 以上版本：- Windows：使用從這裡下載的安裝執行檔安裝 Node.js nodejs.org.
- OS X 或 Linux：安裝執行檔也可從 nodejs.org 取得。如果發生以下情況： 來避免不需要根目錄存取權，建議您透過 nvm 進行安裝。 範例：
curl https://raw.github.com/creationix/nvm/master/install.sh | sh source ~/.bash_profile || source ~/.profile || source ~/.bashrc nvm install 0.10 nvm alias default 0.10
指定 Android
開發 Android 應用程式時，您還必須安裝：
- Java JDK 7 (或更高版本)
- Android SDK 4.4.2 以上版本
- 安裝 Android ADT 套件隨附的 Android SDK 和 Android 開發人員工具。
- 將
sdk/tools和sdk/platform-tools新增至 PATH 環境變數。 - OS X：Android SDK 隨附的 Eclipse 版本需要 JRE 6。開啟時 Eclipse.app 不會提示您安裝 JRE 6，並可透過 Mac App Store 取得。
- Linux：Android SDK 需要 32 位元支援程式庫。在 Ubuntu 上，請透過下列方式取得這些檔案：
apt-get install ia32-libs。
- Apache Ant
指定 iOS
請注意，iOS 開發作業僅適用於 OS X。此外，您需要安裝：
- Xcode 5 以上版本，包含 Xcode 指令列工具
- ios-deploy (必須部署至 iOS 裝置)
npm install -g ios-deploy
- ios-sim (必須部署至 iOS 模擬器)
npm install -g ios-sim
- 選用：註冊為 iOS 開發人員
- 這是在實體裝置上進行測試及提交到應用程式商店的必要條件。
- 如果您只打算使用 iPhone/iPad 模擬器，則可略過註冊程序。
安裝 cca 指令列工具
透過 npm 安裝 cca：
npm install -g cca
稍後如何使用新版本更新工具鍊：npm update -g cca。
透過指令列執行下列指令，確認所有元件都已正確安裝：
cca checkenv
您會看到輸出的 cca 版本號碼，並確認您的 Android 或 iOS SDK
安裝。
步驟 2：建立專案
如要在 YourApp 目錄中建立預設的 Chrome 行動應用程式專案，請執行下列指令：
cca create YourApp
如果您已建立 Chrome 應用程式，現在想將其移植到行動平台，可以使用
--link-to 標記，建立其符號連結：
cca create YourApp --link-to=path/to/manifest.json
如果想複製現有的 Chrome 應用程式檔案，可以使用 --copy-from 標記：
cca create YourApp --copy-from=path/to/manifest.json
還沒有自己的 Chrome 應用程式嗎？試試許多行動版 Chrome 應用程式範例 支援團隊。
步驟 3：開發
您可以透過下列兩種方式建構及執行應用程式：
- 選項 A：透過指令列使用
cca工具，或 - 方法 B：使用 IDE，例如 Eclipse 或 Xcode。您可以選擇是否要使用 IDE (但 ，協助啟動、設定及偵錯混合型行動應用程式。
方法 A：使用指令列進行開發及建構
在 cca 產生的專案資料夾的根目錄中：
Android
- 如要在 Android Emulator 上執行應用程式：
cca emulate android- 注意：您必須先設定模擬器，才能執行這項操作。您可以執行
android avd進行設定。 執行android，下載其他模擬器映像檔。如要加快情報圖像執行速度， 安裝 Intel 的 HAXM。
- 注意：您必須先設定模擬器，才能執行這項操作。您可以執行
- 如要在已連結的 Android 裝置上執行應用程式：
cca run android
iOS
- 如何在 iOS 模擬器上執行應用程式：
cca emulate ios - 如要在已連結的 iOS 裝置上執行應用程式：
cca run ios- 注意：您必須先為裝置設定佈建設定檔，才能進行這項操作。
選項 B：使用 IDE 開發及建構
Android
- 在 Eclipse 中，選取
File->Import。 - 選擇
Android>Existing Android Code Into Workspace。 - 從剛才使用
cca建立的路徑匯入。- 您應該會看到兩個專案匯入，其中一個為
*-CordovaLib。
- 您應該會看到兩個專案匯入，其中一個為
- 按一下「Play」按鈕即可執行應用程式。
- 您必須建立執行設定 (如同所有 Java 應用程式)。您通常會收到 。
- 你首次管理裝置/模擬器時，也需要進行管理。
iOS
在終端機視窗中輸入以下指令，以 Xcode 開啟專案：
cd YourApp open platforms/ios/*.xcodeproj請務必建構合適的目標。
在左上方的「Run」和「Stop」按鈕旁，有可供選取目標專案的下拉式選單 裝置。確認已選取
YourApp，而不是CordovaLib。按一下「播放」按鈕。
變更應用程式原始碼
您的 HTML、CSS 和 JavaScript 檔案位於 cca 專案資料夾的 www 目錄中。
重要事項：變更 www/ 後，您必須執行 cca prepare 才能部署
應用程式。如果您透過指令列執行 cca build、cca run 或 cca emulate，
即可自動完成「準備」步驟如果您使用 Eclipse/XCode 進行開發，則必須執行
手動cca prepare。
偵錯
您可以在行動裝置上對 Chrome 應用程式進行偵錯，方法與對 Cordova 應用程式偵錯相同。
步驟 4：後續步驟
您有了可正常運作的 Chrome 行動版應用程式，可以透過許多方式提升 使用行動裝置
行動版資訊清單
部分 Chrome 應用程式設定僅適用於行動平台。我們建立了
www/manifest.mobile.json 檔案來包含這些值，然後在整個參照中都會參照特定值
外掛程式說明文件和本指南
請根據實際情況調整此處的值。
圖示
行動應用程式的圖示解析度需要比電腦版 Chrome 應用程式更多。
Android 所需的大小如下：
- 36px、48px、78px、96px
iOS 應用程式所需的大小取決於是否支援 iOS 6 與 iOS 7。 規定的圖示數量下限為：
- iOS 6：57 像素、72 像素、114 像素、144 像素
- iOS 7：72px、120px、152px
完整的圖示清單在 manifest.json 檔案中如下所示：
"icons": {
"16": "assets/icons/icon16.png",
"36": "assets/icons/icon36.png",
"48": "assets/icons/icon48.png",
"57": "assets/icons/icon57.png",
"72": "assets/icons/icon72.png",
"78": "assets/icons/icon78.png",
"96": "assets/icons/icon96.png",
"114": "assets/icons/icon114.png",
"120": "assets/icons/icon120.png",
"128": "assets/icons/icon128.png",
"144": "assets/icons/icon144.png",
"152": "assets/icons/icon152.png"
}
每次執行時，圖示都會複製到各平台的適當位置
cca prepare。
啟動畫面
iOS 應用程式在載入過程中會顯示簡短的啟動畫面。一組預設的 Cordova 噴濺
包含在 platforms/ios/[AppName]/Resources/splash 中。
需要的尺寸包括：
- 320 x 480 像素 + 2 倍
- 768 像素 x 1024 像素 + 2x (iPad 直向)
- 1024 像素 x 768 像素 + 2x (iPad 橫向)
- 640 x 1146 像素
cca 目前不會修改啟動畫面圖片。
步驟 5：發布
在專案的 platforms 目錄中，有兩個完整的原生專案：一個用於 Android，另一個
以及 iOS 專用的您可以建立這些專案的發布版本，然後發布至 Google Play，或是
iOS App Store
發布至 Play 商店
如何將 Android 應用程式發布到 Play 商店：
更新兩個 Android 版本 ID，然後執行
cca prepare：- 系統會使用
www/manifest.json中的version鍵設定android:versionName(這會設定 的電腦版封裝應用程式版本)。 - 已使用
www/manifest.mobile.js中的versionCode鍵設定android:versionCode。
- 系統會使用
編輯 (或建立)
platforms/android/ant.properties，並設定key.store和key.alias屬性 (如 Android 開發人員說明文件所述)。建構專案：
./platforms/android/cordova/build --release在
platforms/android/ant-build/內找出已簽署的 .apk。將已簽署的應用程式上傳至 Google Play Developer Console。
發布至 iOS App Store
- 請在
www/manifest.mobile.js中設定CFBundleVersion鍵，更新應用程式版本，然後 執行cca prepare。 開啟
platforms/ios目錄底下的 Xcode 專案檔案：開放式平台/ios/*.xcodeproj
請遵守 Apple 的《應用程式發布指南》。
特殊注意事項
如果您是第一次使用 Chrome 應用程式，最重要的是部分網路功能遭到停用。 不過，其中有幾項功能目前可在 Cordova 使用。
Chrome 應用程式可能無法在行動裝置上正常運作。攜碼轉移至行動裝置的常見問題：
- 小螢幕的版面配置問題 (尤其是在直向模式下)。
- 建議修正方式：使用 CSS 媒體查詢，針對小螢幕最佳化內容。
- 系統會忽略透過 chrome.app.window 設定的 Chrome 應用程式視窗大小，改為使用
設定裝置原生尺寸
- 建議修正方式：移除硬式編碼的視窗尺寸；您能設計應用程式的各種大小 。
- 手指不易點按小型按鈕和連結。
- 建議修正方式：將觸控目標調整為至少 44 x 44 點。
- 仰賴觸控螢幕上沒有的滑鼠遊標懸停時，出現非預期的行為。
- 修正建議：除了懸停操作外，也可以啟用下拉式選單和工具提示等 UI 元素 輕觸。
- 輕觸延遲時間為 300 毫秒。
- 建議修正方式：使用 FT Labs 的 FastClick JavaScript polyfill。
- 詳情請參閱這篇 HTML5Rocks 文章。
支援的 Chrome API
我們已將許多核心 Chrome API 提供給 Chrome 行動應用程式，包括：
- identity - 透過 OAuth2 登入的使用者
- payments - 在行動應用程式中銷售虛擬商品
- pushMessaging：將訊息從伺服器推送至應用程式
- 通訊端 - 使用 TCP 和 UDP 透過網路傳送及接收資料
- notifications (僅限 Android 裝置)：透過行動應用程式傳送複合式通知
- storage - 在本機儲存及擷取鍵/值資料
- syncFileSystem：儲存及擷取 Google 雲端硬碟備份的檔案
- alarms - 定期執行工作
- idle - 偵測機器的閒置狀態變更的時間
- 電源：覆寫系統的電源管理功能
不過，並非所有 Chrome JavaScript API 都會實作。此外，並非所有 Chrome 電腦版功能 適用於行動裝置：
- 沒有
<webview>標記 - 沒有索引資料庫
- 沒有 getUserMedia()
- 無 NaCl
如要追蹤進度，請前往 API 狀態頁面。
Chrome 應用程式開發人員工具
Android 版 Chrome 應用程式開發人員工具 (ADT) 是獨立的 Android 應用程式，可讓你 下載及執行 Chrome 應用程式，而不必設定上述開發工具鍊。使用 在想快速預覽現有的 Chrome 應用程式 (已封裝為 .crx) 時，請啟用 Chrome ADT 在您的 Android 裝置上。
適用於 Android 的 Chrome ADT 目前為 Alpha 版。想試用看看嗎？請參閱 有關安裝和使用說明的 ChromeADT.apk 版本資訊。