2014年11月25日 星期二

Cordova + Eclipse for Android 專案建立

Cordova + Eclipse for Android 專案建立

參考資料: 
  Cordova - 關於 config.xml 與 使用 CLI(Command-Line Interface) 安裝 Cordova
  使用 Cordova 打包測試 Android App (Windows 7)
  Phonegap 學習記錄筆記
  同事經驗與熱心教學 

官網 Plugins目錄 : http://plugins.cordova.io/#/

作業環境 : Windows 7 專業版 (32位元作業系統) 

開發環境 : 
    Java JDK1.8
    apache-ant-1.9.4
    cordova 4.0.0
    Android 模擬器 : Genymotion  2.3.0


◎ 建立cordova 專案 命令提示字元(CLI) 建置步驟  [基本]

step1 : 前往欲建立cordova專案的資料夾下
  cordova create cordovaTest com.lynn.cordovaTest cordovaTest   

step2 : 進入 step1 建立的專案資料夾
  cd cordovaTest                                                                                

step3 : 加入android平台項目
  cordova platform add android                                                                                
順利執行 以上三步驟,最基本的cordova android 環境已完成。就可以直接Import到Eclipse了~

- 成功建立cordovaTest 專案 -









step4 : 加入套件
  [20141119] 研究如何將 plugin.google.maps 加入專案中
  ※ Cordova Plugin 〞Map   plugin.google.maps]  地圖
      GitHub  [ wf9a5m75/phonegap-googlemaps-plugin ]

cordova plugin add plugin.google.maps -variable  API_KEY_FOR_ANDROID=XXXXXXXX-XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

  P.S : 此Plugin是以 Google Maps Android API v2 做開發延伸
  在v2版本 還需申請 Google  API 憑證 的 Android 應用程式的金鑰 !!!!
  申請完畢後,還一定要記得到 Google Maps Android API v2 開啟API。
  否則還是沒有地圖作用打開 只有Google 字體然後背景一片空白!!!因為在下我...就是忘了開啊!!>"<

- Google Maps Android API v2 -

◎ 匯入建立的cordova到Eclipse Project 內
    Package Explorer 右鍵 > Import > Android_Existing Android Code Into Workspace
- Import cordovaTest to Eclipse -
P.S :  cordova4.0版本 在建立CordovaLib 命名時,似乎都會預設為 CordovaApp-CordovaLib 的名稱。
以目前自己的做法,在匯入Eclipse後,會將CordovaApp-CordovaLib 的CordovaApp改為該專案名稱(cordovaTest-CordovaLib)。
若無更改,在匯入第二個cordova專案時會互相衝突,產生錯誤訊息。

而 同事的環境是cordova3.5版 無此命名問題~


step5 : build 建置專案apk,不做此步驟的話就沒辦法在模擬器上正確執行已修改過的內容
  cordova build android                                                                      



===============問題紀錄===============

問題1 :
   使用 Cordova Plugin 〞Map 套件,初始畫面會出現世界地圖樣貌,但在Build專案後,Genymotion 模擬器 畫面呈現白底且畫面下方有出現google字樣,查看Eclipse LogCat 出現此Error ↓↓↓

- cordova Plugin 失敗 vs 成功 -

- Failed to load map -
解決 : 
   查看此專案的package 命名 與 Google API 申請的金鑰,是否有一致!!
   範例: 45:B5:E4:6F:36:AD:0A:98:94:B4:02:66:2B:12:17:F2:56:26:A0:E0;com.example
   com.example 是不是 專案的 package !!!!!




卒仔〞筆記 : 把遇到的問題,記錄在這邊~ 會陸陸續續增加... 遇到的問題點 : ]


沒有留言:

張貼留言