cordova 入門

weixin_33751566發表於2016-06-21

   現在做專案為了節約成功,適配多平臺 cordova不為是一個很好的選擇。個人覺得以後也許是一個趨勢!像一些知名的APP  比如支付寶  淘寶 好多都大量整合了HTML5 頁面!像我們公司現在的APP 大多都是h5頁面 感覺原生都沒什麼事情做了。可想而知學習cordova的重要性!

簡介

   Cordova提供了一組裝置相關的API,通過這組API,移動應用能夠以JavaScript訪問原生的裝置功能,如攝像頭、麥克風等。Cordova還提供了一組統一的JavaScript類庫,以及為這些類庫所用的裝置相關的原生後臺程式碼。Cordova支援如下移動作業系統:iOS, Android,ubuntu phone os, Blackberry, Windows Phone, Palm WebOS, Bada 和 Symbian。

入門第一步:下載資源庫並整合到專案中來

   去下載cordova 庫的原始碼 可以去github上下載 也可以去官網下載。其實官網上的程式碼也是放到github上的!

https://github.com/apache/cordova-ios   資源下載地址

http://cordova.apache.org/  官方網站

使用 CocoaPods進行第三方庫的管理 我之前用的是cordova3.8.0 前幾天不久更新到了4.0.1 。 4.0.1 只支援8.0以上  以下的你用CocoaPods 更新會提示錯誤!注意一下就可以了!

platform :ios, '8.0'

pod 'Cordova', '~> 4.0.1'

入門第二步:如何在專案中正確的整合 cordova4.0.1 庫

1. 配置 Config.xml   很重要

Config.xml is a global configuration file that controls many aspects of a cordova application's behavior. This platform-agnostic XML file is arranged based on the W3C'sPackaged Web Apps (Widgets)specification, and extended to specify core Cordova API features, plugins, and platform-specific settings.For projects created with the Cordova CLI (described inThe Command-Line Interface), this file can be found in the top-level directory:

大致意思就是: config.xml 是一個全域性配置檔案,控制一個cordova應用行為的許多方面。這種平臺無關的XML檔案是基於w3c'spackaged Web應用程式設定(widgets)規範,並擴充套件到指定核心cordovaAPI功能,外掛和平臺的具體設定。與科爾多瓦CLI建立的專案(描述在命令列介面)


http://cordova.apache.org/docs/en/6.x/config_ref/index.html 官方詳解

2. 顯示html5頁面需要一個容器 在這裡使用CDVViewController類 進行html5的顯示以及控制 當然也可以自定義一個容器繼承CDVViewController類做一些定製功能。

如何使用如下:

self.cordovaManageVC= [[CordovaManageVCalloc]init];

self.cordovaManageVC.startPage=@"http://www.baidu.com";

[self.navigationControllerpushViewController:self.cordovaManageVCanimated:YES];

3. 設定使用者代理

- (instancetype)init {

self= [superinit];

if(self!=nil) {

//設定使用者代理 如不設定無法呼叫與H5定製的JavaScript方法進行互動

NSString* original = [CDVUserAgentUtiloriginalUserAgent];

NSString* userAgent = [originalstringByAppendingString:@"delegateUserName"];

self.baseUserAgent= userAgent;

}

returnself;

}

4. 自定義外掛 需要使用到 cordova的CDVPlugin類 用子類來整合CDVPlugin 

/**

*返回控制元件

*

*@param command

*/

- (void)back:(CDVInvokedUrlCommand*)command;

定製完成之後需要在confing.xml 進行配置 


2048356-e25e0e50078dd436.png

以上就是cordova 最基本的用法了;順便再貼出 自己之前弄的一個簡單的Demo 

https://github.com/TzyTman/cordova_Demo

相關文章