如何将html5程序打包成Android应用

Posted 2023-03-22

问题分析：

html5网站主要由html+css+js的形式组成，需要使用浏览器进行展现。

android需要使用Java语言来开发，对于前端工程师来说，无疑是增加了很大的难度。

随后出现了很多打包工具，来协助我们将网页元素打包成手机app，将我们编写的html转化为Java语言。

解决方案：

推荐一款我们常用的打包工具：HBuilder。

该工具不仅提供了Android应用打包，还可以直接连接手机进行调试，配合HTML5+可以实现很多Android原生的功能。比如：扫码二维码，拍照，摇一摇等等。

具体操作步骤：

1、真机调试

进入软件后，第一步点击“运行”，第二步点击“手机运行”，第三步选择已连接的手机，示例中我使用的是安卓模拟机进行连接的。市面上常用的几款安卓模拟机器都可以直接连接上。

按如上几个步骤操作后，会自动执行打包并将应用安装在链接的手机（模拟器）中，可以操作手机（模拟机）进行测试。

2、打包生成Android的安装格式apk文件

① 打开软件，选择发行->发行为原生安装包，随即打开下图窗口。

② 勾选Android复选框，如果使用Dcloud公用证书的话，可以直接进行打包，手机可以安装使用。如果需要上传发行到第三方应用平台的话，需要使用自有证书，自用证书可以使用JRE自带的创建和管理数字证书的工具Keytool来生成自有证书，生成过程是免费的。

勾选Android选项后，在下方表单中填写Android包名，为保证唯一性，可以使用自有网站域名的反写方式加上应用名称。如果使用自有证书的话，还需要填写证书别名，密钥密码，证书文件。

填写完毕后，点击打包，即可生成apk文件。

其他注意事项：

1、在开发过程中，不需要进行打包，应更多的使用真机调试，可以节约很多时间。

2、开发完毕后，尽可能在各种版本的android机器上做一下测试，因为一些网页的样式在不同的android版本中呈现的效果略有不同。

3、重新编辑一下html5网站代码，将一些网页功能转换为手机功能，比如网页元素的<a>标签跳转，就应该使用Webview来完成。可以解决页面切换白屏的问题，还可以提高网站在手机中的运行效率。

参考技术A

将html5程序打包成Android应用的方法是采用在线appcan实现的。

1、图标设置

可以使用AppCan提供的默认图标，也可以通过从本地上传图标设置自己应用的图标。

2、状态栏设置

Android状态栏支持两种设置：显示或不显示。

3、启动页设置

设置应用启动时显示的启动页图片。可分平台上传启动页图片，上传图片时将鼠标放在图片上会出现一个上传按钮，点击上传按钮就可以上传各个分辨率的启动图。在启动页设置操作界面，通过屏幕设置功能可以设置应用启动时启动页是竖屏显示还是横屏显示。

4、插件选择

选择开发应用中所使用到的插件。”公共插件”为AppCan开放出的插件；”我的插件”为开发者自己上传的插件，参考自定义插件上传文档，上传我的自定义插件包

5、证书管理

android平台选择自定义证书打包，需上传android证书，通过上传的证书和口令检验当前证书。安卓证书可以通过其他途径（如Android ADT、ANT等）生成的标准签名证书，也可一键生成安卓证书。

6、云端打包

Android平台选择自定义证书打包，默认不上传证书则为AppCan测试证书不可作为正式发布使用，需上传Android证书，自定义包名：用户可以根据需求来填写自定义包名，请按照规格填写，例如：com.zywx.appcan，注意：不支持中文、数字及特殊字符。

参考技术B

1、图标设置

可以使用AppCan提供的默认图标，也可以通过从本地上传图标设置自己应用的图标。

2、状态栏设置

Android状态栏支持两种设置：显示或不显示。

3、启动页设置

设置应用启动时显示的启动页图片。可分平台上传启动页图片，上传图片时将鼠标放在图片上会出现一个上传按钮，点击上传按钮就可以上传各个分辨率的启动图。在启动页设置操作界面，通过屏幕设置功能可以设置应用启动时启动页是竖屏显示还是横屏显示。

4、插件选择

选择开发应用中所使用到的插件。”公共插件”为AppCan开放出的插件；”我的插件”为开发者自己上传的插件，参考自定义插件上传文档，上传我的自定义插件包

5、证书管理

android平台选择自定义证书打包，需上传android证书，通过上传的证书和口令检验当前证书。安卓证书可以通过其他途径（如Android ADT、ANT等）生成的标准签名证书，也可一键生成安卓证书。

6、云端打包

Android平台选择自定义证书打包，默认不上传证书则为AppCan测试证书不可作为正式发布使用，需上传Android证书，自定义包名：用户可以根据需求来填写自定义包名，请按照规格填写，例如：com.zywx.appcan，注意：不支持中文、数字及特殊字符。

参考技术C 相信在不久的将来HTML5将会对互联网行业产生重要影响，尤其是移动互联网
本文介绍HTML5开发web APP 基本步骤
http://jingyan.baidu.com/article/3d69c5517186e0f0cf02d7ef.html本回答被提问者和网友采纳 参考技术D 　　Dreamweaver cs6可以将html5程序打包成Android应用
　　下载安装Dreamweaver CS6

　　在主界面中点击PhoneGap Build

　　选择Android就可以等着打包完成即可
　　说明：需要有Dreamweaver账号才可以，注册Dreamweaver账号是免费的，可以到官网进行注册就可以了