hybrid app(混合模式移动应用)是指介于web-app、native-app这两者之间的app，兼具"Native App良好用户交互体验的优势"和"Web App跨平台开发的优势"。hybrid app的作用如下：

　　--- 可以安装到手机，Webapp、m站、touch端项目、手机网站;

　　--- 手机浏览器访问nativeapp android、ios语言开发的app。

　　webview是由原生语言提供的组件(浏览器)，该组件本身需要设定一些属性(设置让其支持javascript，设置链接在本组件WEBVIEW中跳转),让他可以像一个真正的浏览器一样。

　　让其加载一个网页：

　　wv.loadUrl('地址') //本地地址/远程地址

　　android、ios提供一些可供js调用的对象obj和方法fn，js中只需要通过

　　window.obj.fn // 如果需要传递参数 window.obj.fn(params)

　　js可以提供android调用的方法test，供android、ios调用

　　wv.loadUrl('javascript:test()') //如果需要参数wv.loadUrl('javascript:test(params)')

　　一、介绍

　　 https://phonegap.com/

　　混合开发

　　根据需求先写页面，假设你的一个按钮需要调用系统的功能，在你的按钮事件中调用由android工程师提供的相对应的对象和其方法即可，同时前端也会定义一些方法，但是前端自己不调动，android会根据webview的loadUrl方法进行调用，并且传参(根据需求看)

　　如果将这些对象和方法进一步统一封装，再结合一定的技术可以提供给js调用，就好比我们在写页面的时候引入jquery一样，再结合特定的环境(混合开发所必须的环境)就可以无需原生开发者，只要你懂web技术即可开发需要的app

　　phonegap ******

　　DCloud ******

　　ApiCloud

　　ReactNative

　　.....

　　二、如何开发  https://phonegap.com/getstarted/

　　1、安装桌面版应用程序，用来创建项目

　　2、安装移动应用

　　ios，请移驾到appstore进行下载

　　3、创建新的应用程序

　　4、项目预览效果，手机和电脑处于同一个局域网，

　　三、调用系统功能 --- 拍照

　　调用功能： http://www.phonegap100.com/doc/cordova_file_file.md.html

　　拍照API

　　receivedEvent: function(id) {

　　var takePhotoBtn = document.getElementById("takephoto");

　　var getPhotoBtn = document.getElementById("getphoto");

　　takePhotoBtn.>

　　alert("拍照");

　　navigator.camera.getPicture(onSuccess, onFail, { quality: 50,

　　destinationType: Camera.DestinationType.FILE_URI });

　　function onSuccess(imageURI) {

　　var image = document.getElementById('myImage');

　　image.src = imageURI;

　　}

　　function onFail(message) {

　　alert('Failed because: ' + message);

　　}

　　}

　　getPhotoBtn.>

　　alert("相册选取");

　　navigator.camera.getPicture(onSuccess, onFail, {

　　quality: 50,

　　destinationType: Camera.DestinationType.FILE_URI,

　　sourceType:Camera.PictureSourceType.PHOTOLIBRARY

　　});

　　function onSuccess(imageURI) {

　　var image = document.getElementById('myImage');

　　image.src = imageURI;

　　}

　　function onFail(message) {

　　alert('Failed because: ' + message);

　　}

　　}

　　var getUser = document.getElementById("getUser");

　　var list = document.getElementById("list")

　　getUser.>

　　alert("通讯录");

　　var options = new ContactFindOptions();

　　options.filter = "";

　　options.multiple = true; // return multiple results

　　filter = ["name"]; // return contact.displayName field

　　// find contacts

　　navigator.contacts.find(filter, onSuccess, onError, options);

　　function onSuccess(contacts) {

　　// display the address information for all contacts

　　for (var i = 0; i < contacts.length; i++) {

　　var oli = document.createElement("li");

　　oli.innerHTML = i + ":"+JSON.stringify(contacts[i].name)

　　list.appendChild(oli);

　　}

　　};

　　五、打包

　　 https://build.phonegap.com/

　　点击私有的，上传www文件的压缩文件即可

　　点击open-source

　　先写好页面，在你页面需要的部分添加点击事件，事件代码块由phonegap提供，通过事件的回调函数继续操作即可

　　本文来自千锋教育，转载请注明出处。