eapp
Version:
72 lines (63 loc) • 5.21 kB
HTML
<html>
<head>
<meta charset="UTF-8">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport"
content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="doc.css">
<link rel="stylesheet" type="text/css" href="../lib/css/btns.css">
<link rel="stylesheet" href="../lib/js/toast/dialogTip.css?v=20160520">
<title>Eapp文档</title>
</head>
<body>
<div class="root">
<!-- 电池栏-->
<div class="statusBar"></div>
<!-- 头部-->
<div class="titleBar">
<button class="btn btnRed" onclick="history.go(-1)">返回</button>
<span>Eapp官方简易教程</span>
<button class="btn btnRed" onclick="location.reload()">刷新</button>
</div>
<!-- 内容区域，可滚动-->
<div class="content_wrap">
<h1 class="titleTxt">5分钟（20行代码）教你开发App，兼容android和ios平台</h1>
<img src="images/111.png" width="100%">
<div class="step"> <span class="zhu">Eapp（easy app缩写）顾名思义，让你很容易的用前端jsApi方式驱动Android和ios两个平台的硬件能力，如本例拍照获取照片、相册获取照片、扫一扫获取二维码文本能力！</span></div>
<div class="step">第一步：新建eapp.html，并引入eappApi.js</div>
<img src="images/222.png" width="100%" >
<div class="step">第二步：调用EappApi方法</div>
<img src="images/333.png" width="100%" >
<div class="step"> <span class="zhu">至此，仅20行代码，你已经开发了一个拥有调用Android和ios拍照、相册、扫一扫硬件能力的h5页面，赶快部署测试一下吧！</span></div>
<div class="step">第三步：将该html文件放在服务器上，地址如：</div>
<div class="tip">http://wg.skynjchat.com/Eapp/Eapp/eapp_demo/eapp.html</div>
<div class="step">第四步：打开android或ios版本的Eapp开发工具，将地址输入进去，或直接将上面地址生成二维码，通过Eapp右上角“扫码”按钮录入地址，如下图：</div>
<img class="appPage" src="images/444.png" width="80%" >
<div class="step">第五步：点击“开始测试”按钮，即可调用android或ios的相机、相册、扫一扫功能！赶快试试吧！运行截图如下：</div>
<img class="appPage" src="images/555.png" width="80%" >
<div class="step">运行视频如下：</div>
<img class="appPage" src="images/666.gif" width="80%">
<div class="step">Eapp总结：</div>
<div class="noteMsg"> <span class="zhu">使用方便：</span>只需引入EappApi.js，即刻拥有调用原生硬件能力，让您只专注于h5业务页面开发，并且能够<span class="zhu">基于一套前端jsApi驱动Android和ios两个平台的硬件功能，</span>如相机拍照、扫码等功能。</div>
<div class="noteMsg"> <span class="zhu">测试方便：</span>只要将开发好的h5页面部署到线上，将地址写到Eapp首页编辑框中，点击“开始测试”即可全真模拟App运行效果，进入相关的页面即可测试硬件功能！</div>
<div class="noteMsg"> <span class="zhu">打包方便：</span>移动组提供专门人员用于响应各业务系统需要打包App需求，流水线操作，迅速交付！</div>
<div class="noteMsg"> <span class="zhu">更新方便：</span>EappApi.js的使用，使得App只是个壳子，以后您开发的app要更新，只要更新线上h5文件即可，开发人员再也不用重复打包两个平台的app部署升级了！用户再也不用频繁下载安装包更新了！</div>
<div class="noteMsg"> <span class="zhu">安装包小：</span>基于官方Demo中的功能，打包的android安装包只有2M，ios安装包只有1.7M！在无限流量盛行的今天，这点流量可忽略不计！</div>
<div class="noteMsg"> <span class="zhu">高效开发：</span>为减少团队耦合，增加团队应变能力，业务系统开发接口后，基于切图组给的切图，业务系统人员直接开发移动端h5页面，有效避免了因接口频繁调整产生联调对接开发，又基于移动组对业务系统业务不了解，有效减少了需求改动、打包、测试、上线多个环节两组任务耦合，相互影响，减少了时间浪费、提高了开发效率，增加了拥抱变化的能力！</div>
</div>
<!-- 底部-->
<div class="bottom">
擎天移动微应用组合力推出
</div>
</div>
<script type="text/javascript" src="../lib/js/jquery-1.11.2.min.js"></script>
<!--<script type="text/javascript" src="lib/js/vconsole/vconsole.min.js"></script>-->
<!-- toast等弹框-->
<script type="text/javascript" src="../lib/js/toast/promptBox.js"></script>
<!-- eappApi-->
<!--<script type="text/javascript" src="http://wg.skynjchat.com/Eapp/eapp_lib/eappApi.js"></script>-->
<script type="text/javascript" src="doc.js"></script>
</body>
</html>