引言:
cordova這個工具出現后,可以通過h5編寫代碼,直接打包出ios及android的安裝包.讓不少公司萌發出節省成本利用h5開發原生app的想法.
然而此類app遇到與手機系統層交互的時候,還是很是蛋疼.網上雖有一些通用插件,但不一定適用產品業務.
例如需要給攝像功能加一個蒙版或者要開發自定義原生控件增加交互體驗時,就一臉懵逼樣了.這時候還是需要我們oc來開發一些插件給他們使用.
那么開發cordova插件前,首先我們要學會使用及安裝這個想讓我們OC失業的工具.
本文僅針對ios開發者,初次涉及cordova插件開發
教程目錄如下,請根據自己進度自行選擇閱讀
1.擁有X-Code
2.安裝node.js環境
3.使用終端安裝cordova
4.創建及運行項目
5.在項目中開發支持入參及回調的插件
一.安裝X-Code
!粗滾請的Code-X裝沒
二.安裝Node.js環境
首先進入官網下載Node.js 然后安裝
三.使用終端命令安裝cordova
打開終端輸入安裝命令:
sudo npm install -g cordova
輸入電腦密碼后等待一會就能安裝成功了.如下圖
器大的人已經安裝成功了,如果你器小可以選擇神油或如下解決方案
如果你沒有安裝GIT Client，請自行下載安裝。
去Cordova命令行幫助查找關于你問題的命令
四.創建項目
1.首先請建立一個文件夾,并通過終端cd進去 不然創建的項目在根目錄下 你都很難找到它
2.通過終端命令創建一個項目
cordova create firstCordovaDoc com.aimi.firstCordova firstCordova
參數解釋:
firstCordovaDoc:對應你整個項目的文件夾名稱
com.aimi.firstCordova:對應至之后ios工程的bundleID
firstCordova:對應至之后ios工程名
3.為項目創建ios工程
首先通過終端進入項目文件夾
cd firstCordovaDoc
輸入終端命令創建ios工程
cordova platform add ios
這時候在項目文件夾下的"platforms"文件夾中會多出ios文件夾,進入后就可以看到ios工程了.
最后我們來試用一下Cordova,cordova的開發是使用h5開發
所以我們先找到其入口Index.html文件,如下圖
注意是在Staging文件夾下的index.html文件,而非根目錄一下那個
簡單寫一點html代碼,替換index.html中的代碼,看看混合開發的h5 app應用
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>頁面標題</title>
</head>
<body>
<h1 align="center">
YO!Man!
</h1>
</body>
</html>
自己去看一下運行效果吧,必須和原生效果是不能比的
五.在項目中開發互相調用的插件
創建好項目之后,就可以進行插件開發了
這里我們做一個oc及js互相傷(diao)害(yong)的小Demo
文章不想太長,故進行了分類,插件的開發點上面連接跳轉吧.
