1. 使用node.js的依赖包管理工具npm进行Cordova的安装
打开终端输入如下命令:
sudo npm install -g cordova
题外话,有安装就有卸载:
sudo npm uninstall cordova -g
1.png
2. 创建Cordova的项目
2.1 1新建一个Cordova的项目
cordova create hello com.example.hello HelloWorld [--template templatePath]
cordova create ccc com.example.ccc CCC
2.png
2.2 添加平台
所有后续命令需要在项目的目录中运行,其范围内或任何子目录:
cd Desktop/ccc
在创建项目之前,您需要指定一组目标平台:
cordova platform add ios
2.3 迭代项目 在ccc目录中运行下面的命令来构建项目:
cordova build
2.4 或指定生成iOS平台的代码项目:
cordova platform add ios
3.png
3 cordova项目
3.1 cordov 项目创建完成
4.png
3.2 Events Cordova声明周期事件
deviceready 当Cordova加载完成会触发
将index.html中的文本替换成如下文本:
Device Ready Example// Wait for device API libraries to load
//
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
// device APIs are available
//
function onDeviceReady() {
// Now safe to use device APIs
alert("onDeviceReady");
}
运行结果:
5.png
pause 当应用程序进入到后台会触发
resumes 应用程序从后台进入到前台会触发
步骤: 替换 html 文本 -> 运行 iOS 程序-> 开发者调试 -> 模拟器进入后台再进入前台>
将index.html中的文本替换成如下文本:
Pause Example// Wait for device API libraries to load
//
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
document.addEventListener("resume", onResume, false);
}
// device APIs are available
//
function onDeviceReady() {
document.addEventListener("pause", onPause, false);
}
// Handle the pause event
//
function onPause() {
console.log("onPause");
}
// Handle the resume event
//
function onResume() {
console.log("onResume");
}
3.3 Plugin APIs
cordova-plugin-console Cordova Console Plugin
1> 安装
cordova plugin add cordova-plugin-console
6.png
2> 实例
将index.html中的文本替换成如下文本:
Hello Worlddocument.addEventListener("deviceready", onDeviceReady, false);
function consoleLog(){
console.log("console.log works well");
}
function consoleError(){
console.error("console.error works well");
}
function consoleException(){
console.exception("console.exception works well");
}
function consoleWarn(){
console.warn("console.warn works well");
}
function consoleInfo(){
console.info("console.info works well");
}
function consoleDebug(){
console.debug("console.debug works well");
}
function consoleAssert(){
console.assert("console.assert works well");
}
function consoleDir(){
console.dir("console.dir works well");
}
function consoleDirxml(){
console.dirxml("console.dirxml works well");
}
function consoleTime(){
console.time("console.time works well");
}
function consoleTimeEnd(){
console.timeEnd("console.timeEnd works well");
}
function consoleTable(){
console.table("console.table works well");
}
button {
width: 200px;height:26px;font-size: 20px;padding: 1px;margin-left: 100px;
}
consoleLog
consoleError
consoleException
consoleWarn
consoleInfo
consoleDebug
consoleAssert
consoleDir
consoleDirxml
consoleTime
consoleTimeEnd
consoleTable