本文主要為大家介紹了關於cordova的入門基礎教程以及在使用中遇到的一些問題,文中通過示例代碼一步步介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧。希望能幫助大家。
前言
現在做專案為了節省成功,適配多平台 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上的!
官方網站:http://cordova.apache.org/
github資源下載網址:https://github.com/apache/cordova-ios
#使用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 be小. This plathavior. Thinosz XML 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 inface inface infaces Interfacefile 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 進行設定
#以上就是cordova 最基本的用法了;
使用Cordova 遇到的一些問題
問題一
問題
[Error: Failed to find 'ANDROID_HOME' environment variable. Try setting setting it manually. Failed to find 'android' command in your 'PATH'. Try update your 'PATH' to inclde path to valid SDK directory.] ERROR building one of the platforms: Error: cmd: Command failed with exit code
解決方法
ANDROID_HOME=D:\apps\Android\sdk PATH=%PATH%;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools
問題二
##問題Error: Could not find an installed version of Gradle either in Android Studio, or on your system to install the gradle wrapper. Please include gradle in your path, or install Android Studio
ANDROID_HOME=/home/kongxx/Android/Sdk GRADLE_HOME=/apps/gradle-3.2.1 PATH=$PATH:$ANDROID_HOME/tools/:$ANDROID_HOME/platform-tools:$GRADLE_HOME/bin
$ cordova build android CHCP plugin after prepare hook: config-file set to http://www.tjdr.info/EWT/chcp.json ANDROID_HOME=/home/kongxx/Android/Sdk JAVA_HOME=/opt/jdk8 Error: Could not find gradle wrapper within Android SDK. Might need to update your Android SDK. Looked here: /home/kongxx/Android/Sdk/tools/templates/gradle/wrapper
$ cp -rf android-studio/plugins/android/lib/templates /home/kongxx/Android/Sdk/tools/
$ cordova build android CHCP plugin after prepare hook: config-file set to http://www.tjdr.info/EWT/chcp.json ANDROID_HOME=/home/kongxx/Android/Sdk JAVA_HOME=/opt/jdk8 Subproject Path: CordovaLib Error: spawn EACCES
sudo chmod -Rf 755 ~/Android
cordova run browser
cordova run browser --target=opera cordova run browser --target=firefox
以上是cordova入門基礎教程的詳細內容。更多資訊請關注PHP中文網其他相關文章!