android集成html5 sdk,Android独立应用方式集成HTML5+SDK,Widget方式离线打包,空项目讲解...

Widget方式: 按照字面的意思就是,html相当于小部件一样和原生代码放一块,在需要的时候调用;

独立应用方式: 这个就是Widget方式,概念真多

Webview方式: 只能打开一个界面,不能打开新界面,这个没搞懂使用场景~~~~(>_

当你打开官方http://ask.dcloud.net.cn/docs/#http://ask.dcloud.net.cn/article/38 又多了个概念: 离线打包

当你运行官方集成案例的时候,又多了个Runtime集成方式; 小白迟早会疯掉的

总之,按照我的理解:

1.如果你的项目原生代码和html混合着用,那么选择Widget方式集成,也就是独立应用方式;

2.如果你的项目是HBuilder写的纯html,没有原生代码,那么用Runtime集成方式,比较简单;

离线打包的概念是相对于HBuilder在线云打包而言的; 我们选上面各种集成方式用eclipse,Android Studio 或者XCode把html编译成安装包就属于离线打包了;这样避免云打包排队或者服务器挂掉的时候,自己还能编译安装包,照常发布更新版本;

ok,理清了官方的概念,你也基本懂了我写的标题:

Android独立应用方式集成HTML5 SDK,Widget方式离线打包,空项目讲解

一.准备

1.打开HBuilder,新建-->移动APP-->勾选"Hello mui",项目名叫"HelloMui";(我以官方mui项目来举例了,到时自行改为自己的项目);

2.打开eclipse,打开你的Android项目;(我这里是新建了一个Android项目,名字叫Widget; 如果你还没配置Android开发环境,则点这里http://jingyan.baidu.com/article/bea41d437a41b6b4c51be6c1.html );

3. 去官方下载最新的sdk: http://ask.dcloud.net.cn/article/103 解压,里面有个名字叫'SDK'的文件夹

1299870e5395ea63d5c2c51cd1aea4ff.png

二.拷贝

1.把下载的官方SDK文件夹里的res文件夹拷贝到Android项目的res,合并;注意不要替换你项目的资源,不然你配的图标和写的strings.xml就没了

daeb561c7b986ef3ce15380b5464385e.png

说明: res里面有NativeUI用到的图片资源: 进度条,对话框,动画样式,照片选择,底部弹出框,logo,启动页等等;http://www.html5plus.org/doc/zh_cn/nativeui.html

2.把SDK\assets中的data文件夹到eclipse项目中的assets

24f59150ca574a8ce12bf7d973092223.png

3.在eclipse的assets目录中创建apps; 在apps中创建一个文件夹,名字和你HBuilder的项目名相同;我这里就叫HelloMui; 在HelloMui中创建www文件夹; 把HBuilder项目拷贝到www文件夹下;

b097a3a99fbc67848249cb92e21fce91.png

注意: apps和www文件夹名字是固定的,结构也是固定的,不然读取不到html

4.修改manifest.json和control.xml中的id为你的项目名;我这里是HelloMui

9731e87d3ad4f0370133d5425d8774e3.png

5.拷贝SDK\libs里面的jar包到eclipse项目下的libs;如图:

c1958bed932eb142e5fd772224d655b5.png

说明:

pdr.jar, ui.jar, nineoldandroids-2.4.0.jar是Webview基础包,必须导入

因为HelloMui项目中获取设备信息网络状态,需引入device.jar;

设置了浏览器运行环境,需引入navigatorui.jar(设置了状态栏,创建快捷方式,log输出,设置cookie都需引入此包)

使用了plus.storage,需引入nopermission.jar

其实在具体的项目中,这些包远远不够的:

比如ajax联网,需引入xhr.jar

全量更新和差量更新,需引入downloader.jar,invocation.jar

原生对话框和底部弹出或者toast,需引入nativeui.jar

设置用户头像,用到拍照,打开相册,需引入camera.jar,gallery.jar

具体请参照: http://ask.dcloud.net.cn/docs/#http://ask.dcloud.net.cn/article/216

6.打开eclipse项目的AndroidManifest.xml,配置权限,具体请参照官方SDK里的Feature-Android.xls文件

7.把HBuilder-Integrate\src下的io文件夹,拷贝到eclipse项目的src

239db8d134577c0e533b611bebeb411d.png

8.把Android-SDK\HBuilder-Integrate\src\com\HBuilder\integrate\SDK_WebApp.java 拷贝到eclipse项目的src包名下,并修改122行的appBasePath, 为assets的app路径

94cf44c4cf2b881fc98cbd30ca1620ea.png

9.SDK_WebApp.java里面的FrameLayout是用来承载html的,可以放到任何你想放到的位置,比如点击一个按钮,弹窗或者打开新Activity展示; 我这里的话,直接用activity展示,并在AndroidManifest.xml设置启动就打开本界面

21e793ac6840ac6ac272aa1ccbff5da4.png

d46cec79d94fcc8cfd25bf9177a9457e.png

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值