Cordovacordova 点点滴滴cordova/phonegap

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

2016-12-17  本文已影响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

上一篇下一篇

猜你喜欢

热点阅读