Visual Studio 2015 X Cordova跨平台App實戰特訓班(附近120分鐘關鍵影音教學/全書範例程式)

01 跨平台 App 開發的新選擇
Cordova 提供一個將網頁轉換為行動裝置應用程式的平台，如此一來大部分學習者就可以輕易開發行動裝置應用程式。由於網頁可以跨各種平台，Cordova 可以包裝出適合各種行動裝置平台執行的應用程式。

02 開發環境的建置與使用
Visual Studio 2015 將 Cordova 開發功能納入內建功能，使用 Visual Studio 2015 建立Cordova 應用程式將使開發工作事半功倍。建立應用程式專案時，可以使用預先設定的樣本來建立。建立的專案中已有基本結構，設計者可在此基礎上繼續加入網頁內容。Visual Studio 2015 提供各平台三種方式執行應用程式：Apache Ripple、模擬器及實機。

03 jQuery Mobile 使用者介面建置開發
jQuery Mobile 是一個行動裝置網頁界面的開發框架，不同於傳統網頁，提供了許多工具，可以開發出如同行動裝置 App 應用程式的使用畫面。例如頁面的切換、智慧型手機的操作介面、觸控操作的使用... 等。jQuery Mobile 的基底技術是 jQuery， 能讓網頁的 HTML 標籤， 藉由JavaScript、CSS 的幫助呈現出如行動裝置一樣的頁面。

04 jQuery Mobile 常用元件
jQuery Mobile 提供了許多常用元件，包含了按鈕、導覽列、選項清單、版面格點、可摺疊內容區塊、對話方塊及側邊欄面板，讓行動裝置的畫面與一般原生程式的操作介面更接近。

05 jQuery Mobile 表單
表單是HTML中進行資料互動很重要的一環，jQuery Mobile 會自動將表單元件轉換成行動裝置規格。在本章中會詳細說明表單欄位與表單欄位容器的使用，並且深入討論表單中的文字欄位、日期時間欄位、滑桿及切換開關、滑桿、範圍滑桿、切換開關、核選方塊及選項按鈕、核選方塊、選項按鈕及下拉式選單等元件。本章最後會進一步說明如何由表單取得輸入的值，以利程式進行互動。

06 jQuery Mobile 事件及方法
jQuery Mobile 提供了頁面、觸控、捲動、方向切換 及 初始化等事件，並且提供了頁面切換、載入外部頁面等方法，讓使用者與頁面內容進行互動。jQuery Mobile 能很快建置完善的行動裝置使用者介面，只要再加入JavaScript 程式即可讓使用者與網頁進行互動。

07 系統相關元件
Battrey 外掛程式可以顯示行動裝置目前的電量；Device API 提供全域物件，顯示裝置資訊；Globalization API 提供全域物件，取得使用者所在的地區、語系和時區等資訊；Console API 提供 console 物件，可以在 JavaScript 主控台對話方塊上顯示相關資訊；JavaScript 可以利用try⋯catch⋯throw 錯誤處理、Console 物件方法、設定中斷點執行程式偵錯方式進行程式的除錯。

08 操作畫面相關元件
Cordova 提供 StatusBar 外掛程式來客製化狀態列特性，例如顯示或隱藏狀態列、設定狀態列顏色等。大部分 App 會設計啟動顯示畫面， 讓 App 啟動時有時間可以啟動一些功能。Cordova 提供SplashScreen 外掛程式來製作啟動顯示畫面，並且可以控制畫面顯示時間、顯示比例等特性。應用程式在執行過程中經常需要顯示一些訊息告知使用者必要資訊，Cordova 提供 對話框 外掛程式可用彈出式對話框方式來顯示訊息，也可以讓使用者回應訊息，並且對使用者的回應做後續處理。對話框 外掛程式還可以發出簡單音效，提醒使用者注意特定訊息。

09 網路通訊相關元件
Network API 提供一個 navigator.connection 全域物件，檢查目前行動裝置網路連線狀態，無論是Wi-Fi 上網或 3G/4G 上網。InAppBrowser API 提供 Web 瀏覽器查看，利用cordova.InAppBrowser.open() 方法可以訪問網頁、開啟圖像或 PDF 文件。Contacts API 提供一個全域的 navigator.contacts物件，可以跨平台存取聯絡人資料。

10 檔案系統相關元件
Cordova 提供 File 外掛程式處理行動裝置檔案系統，但 File 外掛程式僅能提供各式檔案存放資料夾的資訊，並不具備存取、增刪檔案等管理功能由於 Cordova 並未提供檔案存取的外掛程式，若要在 Cordova 應用程式中管理檔案，可使用 HTML5的 FileSystem API。應用程式常會有檔案傳輸的需求，例如照相後將相片檔案上傳到伺服器儲存。Cordova 提供 File Transfer 外掛程式執行檔案傳輸功能，能由伺服器下載檔案，也可以上傳檔案到伺服器，相當方便。

11 多媒體相關元件
Cordova 提供 Camera 外掛程式讓使用者控制照相機，如果手機中有安裝相片裁剪 App，還可以對拍攝的相片進行裁剪，也可選取媒體庫中圖片的功能。Cordova 的 Media 外掛程式讓使用者可以輕鬆製作音樂播放器，同時也提供錄製聲音功能。Cordova 的 Capture 外掛程式能啟動行動裝置內建錄音、拍照及攝影應用程式，當內建應用程式執行完成後，會傳回媒體相關資訊。

12 感測器相關元件
Device Motion API 可存取行動裝置加速器感測器X、Y 和Z 值；Device Orientation API 可偵測目前的方位；Geolocation API 可偵測目前裝置的位置資訊，例如：緯度和經度； Vibration API 依循W3C 震動規範，提供行動裝置震動功能。

13 自訂外掛程式
BarcodeScanner 外掛程式會啟動相機掃描條碼，並將結果傳回，開發者可根據掃描結果進行後續處理；TTS 外掛程式具備語音合成功能，不但可以將文字以多種語言讀出，還可以改變發音速度，可做為學習語言的利器。應用程式在執行過程中常會需要顯示訊息告知使用者一些必要資訊，此訊息在顯示短時間後自動消失，不會干擾使用者操作，這就是Toast 外掛程式的功能。ImagePicker 外掛程式會自動開啟行動裝置的相簿或圖形庫，讓使用者從相簿中選取多張圖片，程式會以陣列傳回圖片檔案路徑。

Appendix A 發佈應用程式到 Google Play 商店
一般在模擬器上測試的專案，會自動產生本機的「debug」金鑰，所以產生的apk 檔可以安裝在實機上執行，但不能上傳到 Google Play 商店。Google Play 商店是一個公開的園地，安全性需有更嚴格的標準，必須使用「release」私人金鑰產生的apk 檔才能上傳到 Google Play 商店。在開發者管理網頁中上傳加入私人金鑰的 apk 檔，再詳細填寫應用程式各項資料後，按發佈應用程式鈕就可將應用程式發佈在 Google Play 商店了！

Appendix B 以 Phonegap Build 建立跨平台 App
PhoneGap 是開放原始碼架構，適用於使用HTML5、JavaScript 和 CSS 的快速建置跨平台行動應用程式。 Adobe PhoneGap Build 為雲端服務，不需 SDK、編譯器和硬體，即可迅速建置且輕鬆編譯行動應用程式。Phonegap Build 預設可以產生安裝在行動裝置的 apk 檔 (debug)， 如果要建立上傳到 GooglePlay 的 apk 檔 (release)，必須上傳私人金鑰檔到Phonegap Build。要將 App 安裝到 iOS 實機時，必須為應用程式加上憑證，相當於在應用程式上簽名，證明此應用程式是自己開發的。接著就要上傳開發憑證授權要求檔 (CSR) 以建立 Provisioning Profiles ，並下載Provisioning Profiles 到本機。