1. cordova的笔记

1. cordova概述
  1.1 什么是 cordova
        1. 一个移动应用开发框架
        2. 本质是在html, css, js 外面包装个原生的壳
        3. 出自于 Adobe 11年收购的 PhoneGap，是驱动PhoneGap的核心引擎
        4. 是 apache 的顶级开源项目
    
    Cordova 提供了一系列设备相关的API，通过这组API，移动应用能够以JavaScript访问原生的设备功能，如摄像头，麦克风等；
   
  1.2 常见的移动端开发的三大分类
      1. 原生App
        2. web App
        3. 混合 App(Hybrid App)
    
    1.3 cordova的优缺点
      优点：跨平台，便于移植，开发快速，成本低
        缺点：执行速度相对原生会慢一些，一次编写，要处处调试

    1.4 cordova的架构
    

2. cordova环境安装
  1. git的安装
      git 下载地址：https://git-scm.com/downloads
      Cordova安装要使用git命令完成一些后台进程
        查看版本：git --version

     2. nodejs的安装
       nodejs官网：http://nodejs.cn/
       查看版本：node -v
    
     3. 安装 Cordova cli, 下载并安装cordova全局模块
       安装：npm install -g cordova
         查看版本：cordova -v
    
      4. 安装Java JDK
           下载地址： https://www.oracle.com/technetwork/java/javase/downloads/index.html
        版本：8；只能是8，不能是其他版本
                查看版本：java -version
                有关JDK的安装，请参考：http://www.yiibai.com/java/java_environment_setup.html
        
        5. 安装 android stuido, 安装 Andorid SDK
          官网地址：http://www.android-studio.org/
            有关android studio 安装，请参考：https://www.yiibai.com/android/android_environment_setup.html

       6. 更新 Cordova cli

     npm update -g cordova

        7.  下载特定版本

       npm install -g cordova@3.1.0-0.2.0
   8. 更新平台

     cordova platform update android --save
     cordova platform update ios --save

        
3. cordova的第一个应用
  使用cordova创建hello world项目
    执行命令：
        1. cordova create hello com.example.hello helloWorld 创建项目
           cordova create 路径  ID                名字

　　

        　　

 

        2. cd hello 切换项目

       3. cordova的第一个应用
  使用cordova创建hello world项目
    执行命令：
        1. cordova create hello com.example.hello helloWorld 创建项目
           cordova create 路径  ID                名字
        2. cd hello 切换项目
        4. cordova platform add android 添加 andorid 平台，加入android运行时
           cordova platform  查看platform文件支持的平台

        5. cordova build 编译运行
        6. cordova run android 在设备上运行
       教程： android studio 模拟器使用入门：https://blog.csdn.net/qq_41916089/article/details/81044989

        7. cordova emulate android  移动平台的SDK通常会绑定模拟器，它是一个可执行的设备镜像，这样你就可以在主屏幕启动你的App（个人觉得就是Android Studio，需要安装虚拟机才行）

 
    目录文件介绍
      1. config.xml配置页，配置起始页项目名称等基础内容
        2. hooks存放一些自定义扩展功能
        3. platforms存放添加的platform运行时
        4. plugins存放引入的插件
        4. www开发的html5目录
    
     3.1 cordova插件和事件说明
       cordova对于设备功能的封装，都是以事件或者插件体现的；
         插件即plugin，他封装了设备能够提供的功能，如：摄像头，
         通讯录，gps等，他们时自定义的js根对象或者覆盖标准对象的方式提供的，插件需要单独安装才能使用；

4. cordova 事件
  4.1 cordova事件概览
      事件名称              说明
        deviceready            当Cordova加载完成后该事件被触发
        pause                  当应用程序被置于后台，则触发此事件
        resume                 当应用程序从后台返回，则触发此事件；
        backbutton             当按下后退按钮时，则触发此事件
        ......
    
    4.2 cordova事件的使用
        https://cordova.apache.org/docs/en/11.x/cordova/events/events.html
      所有的事件调用方式类似，通过js进行事件监听即可(addEventListener)
     
         前端调试谷歌浏览器：chrome://inspect/
        document.addEventListener('deviceready', onDeviceReady)
        function onDeviceReady() {
            console.log("设备api准备就绪，可以进行其他方法的调用或者事件的监听”)
            document.addEventListener('pause', () => {
                console.log('应用程序被挂起')
            })
        }
    
    4.3 cordova应用启动流程
      html页面加载流程
         1. 原生代码启动
         2. splashscreen
         3. load html
         4. 顺序执行 javascript => cordova.js 也执行
         5. $(document).ready()执行，cordova中的事件不一定可用
         6. 注册 deviceready事件

5. cordova手机电池状态
  https://cordova.apache.org/docs/en/11.x/reference/cordova-plugin-battery-status/index.html
  这个cordova插件用于监听设备的电池状态
    1. 安装电池插件
      cordova plugin add cordova-plugin-battery-status
    
    2. 添加事件监听
      该插件全局提供了三个事件  
      batterystatus  表示电池状态发生改变(至少1%电量变化)或者充电状态变化触发
      batterycritical 表示电池电量进入临界值，快关机了触发
      batterylow  表示电池电量比较低触发

      事件监听必须在deviceready调用完成后调用，其必须通过window添加监听
        window.addEventListener('batterystatus', onBatteryStatus)
    
    3. 回调函数
      function onBatteryStatus(status) {
          console.log('电池状态: level: ' + status.level + ' isPlugged: ' + status.isPlugged)
        }
    
     每个事件都会返回一个status对象，有两个属性
       level: 当前电量的百分比值，范围(0-100)number数值类型
       isPlugged: 标记当前手机是否在充电boolean类型