Cordova是什么
Apache Cordova是一個開源的移動開發框架。允許你用標准的web技術-HTML5,CSS3和JavaScript做跨平台開發。
以移動平台為例,安卓、IOS平台設備的常用功能,被Apache封裝成一個個插件,如攝像頭、傳感器、網絡、數據等。H5端通過調用插件,即可使用設備的這些功能。而項目具體的業務功能,也可封裝成自定義的插件,供H5端調用,如:App端分享功能、支付功能、掃碼、定位、自定義鍵盤等。
Cordova提供了完整的機制,使得H5、安卓、IOS等平台混合開發不再復雜。
Cordova的項目可包含多個平台,各平台操作自己的代碼即可,與H5端通過插件通信:
www:H5的工作目錄
/platforms/android/:安卓項目的工作目錄
/platforms/ios/:IOS項目的工作目錄
....
更多信息,請參考官網:
https://cordova.apache.org/docs/en/latest/
Cordova環境
1.平台環境
用Cordova構建和運行App,需要安裝每個你需要平台的SDK,以安卓為例:
1.1 Java開發工具包(JDK)
安裝[Java Development Kit (JDK) 7]或者最新的版本
1.2 Android SDK
安裝[Android Stand-alone SDK]或者[Android Studio]
1.3 設置環境變量 JAVA_HOME 和 ANDROID_HOME
為了使功能正常使用Cordova的CLI工具,需要設置一些環境變量。
以Mac平台為例:
1.3.1 打開終端Terminal
1.3.2 輸入創建命令(如果不存在):touch .bash_profile
1.3.3 打開文件命令:open .bash_profile
打開.bash_profile,配置環境變量(根據自己的目錄,修改即可),如下圖:
2.Cordova環境
安裝cordova命令行工具:
2.1 下載和安裝Node.js (地址:https://nodejs.org/en/download/)。
安裝完成后你可以在命令行中使用node
和 npm
。
node.js是javascript的一種運行環境,是一個服務器端的javascript的解釋器。
npm其實是Node.js的包管理工具(package manager)。
nodejs中包含npm,安裝完成nodejs,npm也就安裝好了。
通過命令node --version 可查看nodejs版本;
通過命令npm --version 可查看npm版本;
2.2 安裝cordova 模塊使用Nodejs的npm工具。
cordova模塊會被npm工具自動下載。
2.2.1 打開終端
2.2.2 執行命令安裝cordova:
sudo npm install -g cordova
2.2.3 執行命令安裝插件管理器:
sudo npm install -g plugman
注釋:
sudo OS X和Linux上的命令,可以被安裝在權限受限的目錄中(windows平台上去掉sudo即可)
-g 標志是告訴 npm 我們全局安裝 cordova;
為避免安裝時出現權限相關問題,也可先啟用超級用戶,命令:sudo -s ,這樣就可直接通過 npm install -g cordova進行安裝。
2.3 cordova環境驗證
打開終端,輸入以下命令,檢查cordova環境版本,如下圖:
更多環境配置信息,請參考官網:
https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html
https://cordova.apache.org/docs/en/latest/guide/cli/index.html
plugman工具用於管理插件,如查看插件列表、新增插件、刪除插件、添加到指定平台等。
plugman create --name ....
cordova plugin remove....
cordova plugin list
plugman platform add --platform_name android
創建Cordova項目
接下來,我們使用Cordova開始搭建一個Cordova項目
- 新建准備存放Cordova項目的目錄,我的本地目錄名:TestCordova
- 打開終端,進入TestCordova目錄
- 輸入創建項目的命令:
cordova create myapp com.qxc.app MyApp
-- myapp 目錄名稱
-- com.qxc.app 包名/工程id
-- MyApp 項目名稱
項目創建成功,如下圖:
4. 添加Android平台
通過上圖,我們可以看到平台目錄中(plantforms)是空的,因為我們還沒有添加任何平台。
輸入進入項目目錄命令:
cd myapp
輸入添加android平台命令:
cordova platform add android --save
-- ios平台類似:cordova platform add ios --save
添加Android平台成功后,項目目錄如下圖:
至此,項目創建完成。
安卓端開發,使用/platforms/android目錄;
IOS端開發,使用/plantforms/ios目錄;(當前示例demo沒有添加)
H5端開發,使用www目錄;
具體安卓與H5端如何通信,我們后續再介紹。
測試Android項目
- 啟動AndroidStudio,打開項目/platforms/android。
- 根據本地Gradle版本(我的是3.3和3.5),修改項目的Gradle。
打開項目的/gradle/wrapper/gradle-wrapper.properties文件,修改gradle版本:
- 編譯項目(如果編譯有問題,一般是Gradle版本的問題,請根據本地gradle進行調整)
- 運行到手機
Android H5混合開發(1):構建Cordova 項目
https://www.cnblogs.com/qixingchao/p/11654454.html
Android H5混合開發(2):自定義Cordova插件
https://www.cnblogs.com/qixingchao/p/11652418.html
Android H5混合開發(3):原生Android項目里嵌入Cordova
https://www.cnblogs.com/qixingchao/p/11652424.html
Android H5混合開發(4):構建Cordova Jar包
https://www.cnblogs.com/qixingchao/p/11652431.html
Android H5混合開發(5):封裝Cordova View, 讓Fragment、彈框、Activity自由使用Cordova
https://www.cnblogs.com/qixingchao/p/11652438.html