美文网首页Cordovacordova 点点滴滴cordova/phonegap
hybird -(02:Cordova生命周期,等)

hybird -(02:Cordova生命周期,等)

作者: 廖马儿 | 来源:发表于2016-12-17 00:22 被阅读99次

    1.页面生命周期
    都是在javascript中

    onLoad()  // 页面加载后
    onDeviceReady()  // Cordova加载完成   onDeviceReady 之后所有插件才能使用。
    onPause()  // 进入后台
    onResume()   // 应用回到前台运行
    

    2.console插件

    cordova-plugin-console
    

    终端安装,需要进入项目文件夹:

    $ cordova plugin add cordova-plugin-console
    

    3.注意事项:

    1)页面要加utf-8编码

    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    

    2)修改了代码需要在terminal 编译,在修改了代码发现没有改变之后要注意这一点,加了资源也要corvoda:

    cordova build
    

    3)在 plist 文件里面 Localization native
    development region设置为 China

    4.插件:
    查看插件:

    cordova plugin ls
    

    安装插件:

    cordova plugin add xxx
    

    删除插件:

    cordova plugin rm
    

    更新插件:

    cordova plugin update
    

    常用插件集合:

    cordova-plugin-network-information // 判断网络连接信息,网络类型等。
    cordova-plugin-device   // 获取设备信息
    cordova-plugin-dialogs    // dialog, 有异步的优点
    cordova-plugin-geolocation   // 设备物理位置
    cordova-plugin-camera  // 相机
    cordova-plugin-contacts  // 联系人
    cordova-plugin-splashscreen  // 自定义闪屏
    cordova-plugin-barcodescanner  // 识别,生成二维码或者条形码
    

    5.h5在移动开发中需要遵守的规则:
    hybird开发 大部分技术是:h5+js

    1. 使用单页开发
      切换页面,生命周期重新执行一次。onDeviceReady之后事件和插件才是准备好的效果。
      2)前段UI框架选择要确定长久,考虑好。
      前端的UI框架很多,要选择实用于手机端的。
      3)动画,特效要先试一试在手机上的效果,有的前端很好看的动画在手机端会很卡。
      4)css这些要考虑手机端的性能,采用消耗cpu等较小的属性
      浏览器消耗比较小的css属性:
      位置-transform:translate(x,y,z)
      大小-transform:scale(n)
      旋转-transform:rotate(ndeg)
      透明度-opacity:0..1
      5)度量单位使用rem

    6.页面布局

    1)流式布局
    像word
    2)绝对定位布局
    3)flexbox布局

    7.手机点击事件

    屏幕按下:touchstart
    触碰离开:touchend
    触碰移动:touchmove

    一次完整的点击事件是由:touchstart+touchend

    相关文章

      网友评论

      本文标题:hybird -(02:Cordova生命周期,等)

      本文链接:https://www.haomeiwen.com/subject/actumttx.html