2023年11月28日发(作者：)
H5⽹页应⽤打包安卓App（全⽹最详细教程）
如果你是⼀名 Web开发者，想把⾃⼰开发的页⾯打包编译成 App在⼿机运⾏，但是你对 Java 和 Android ⼀窍不通，
那么本⽂章将指引你如何将Web项⽬⾛向安卓平台，去除任何浮躁，跟着本⽂操作起来吧
1.参考⽂档
2.材料准备
（⽹盘提取码：neqx，最新请访问：
3.打包Web项⽬
项⽬打包
将 Vue 或者 React 使⽤的webpack把代码项⽬进⾏打包
如果没玩过 MVVM框架随便什么hello world的html项⽬也可以，不⼀定⾮要打包只要⽹页能打开就⾏，
这⾥以Vue+Webpack为例：打包之后⽣成 和 dist⽬录
我这⾥的项⽬浏览器打开之后是移动端的html5页⾯，如下图:
注意这⾥只是页⾯，不是APP，移动端页⾯，接下来的任务就是要把这个html开发的页⾯打包成安卓App
HbuilderX打包
打包好之后，打开 HbuilderX, 创建5+App项⽬
创建后，将左侧默认⽂件除了 manifest其他都删掉，然后把刚刚打包好的 （我的是 和 build）放到项⽬⽬录下
st配置
点击 进⾏配置
Appid
Appid需要去Dcloud申请⼀下，注册⼀个账号就⾏，申请地址如下，免费的
应⽤是否全屏
这⾥的全屏是类似玩王者荣耀那样，直接占据整个屏幕，电源时间状态栏都没有的那种，这⾥我不勾选，
接下来配置沉浸式体验，就是顶部时间电源状态栏弄成透明的那种，看起来会⽐较舒服
图标配置
图标配置可以⾃动⽣成，也可以先不⽣成，后⾯我们可以⽤IDE创建⾃定义图标
启动配置
配置如下图
模块配置
我们这⾥简单点，全部模块都不⽤，下来⼤家可以⾃⼰尝试勾选玩⼀下
权限配置
按照默认的选项来即可
App其他设置
按照默认来
源码视图这⾥添加⼀个沉浸式体验全屏
5.在线云打包和离线打包
这⾥我们⾸先体验⼀下云打包App，选择云打包
配置参考如下图，取消⼴告，勾选公测证书
然后代码会上传到云进⾏打包，等待⼀会会跳出下载App地址
下载apk传到⼿机安装App就可以在⼿机上以App的⽅式运⾏我们写的web界⾯了
虽然在线打包已经满⾜了我们将web应⽤搬运到安卓的需求，但是这⾥是需要上传代码，复杂⼀点的功能还要实名认证
另外每次云打包都要等待⼀段时间后，才会返回只能下载5次的链接，⾮常不⽅便我们进⾏开发调试，
所以下⾯演⽰如何使⽤ Android Studio ⾃⾏离线打包。
⾸先我们在 HbuilderX 上把我们的代码打包成 App需要的src源码资源
控制台会输出打包后资源的⽬录，后续的步骤会⽤到，这⾥先放着
6.安装SDK
打开下载好的 Andriod studio，这⾥不⽤另外安装java环境，Android Studio⾃带jdk的
这⾥勾选即可
选择安装路径
安装好后打开，选择不导⼊
这⾥点击 cancel
此处选择⾃定义
选择主题
勾选AVD 以及选择SDK安装位置
后⾯⼀直点next或finish，点击 SDK Manager
选择 22版本，点击 apply 和 ok
回到刚刚的界⾯新建项⽬,选择空项⽬
下图这⾥
1. Package Name包名⾃⼰命名，⼀般都是颠倒域名作为，此处包名可以随便起
2. Language选择Java
3. Minimum API level最⼩⽀持的API我选的是20，下⾯说明94%的⼿机都⽀持这个API，
4. 其他默认点击Finish
7.安装AVD
点击顶部⼯具栏右侧⼿机图标，如下图，创建AVD虚拟⼿机，也就是⼿机模拟器
点击创建AVD
这⾥屏幕尺⼨可以随便选，也可以⾃定义
模拟器安卓系统我选的是pie，可以点击download下载或直接点下⼀步也会下载
下载好后，这⾥是默认
最后点击Finish完成，然后点击下图得位置，可以尝试运⾏⼀下刚创建的空项⽬app
点击⼯具栏⼿机运⾏按钮，顺利的话会弹出 Hello world 的App如下所⽰
我们可以看到上图蓝⾊框框有报错信息，这个应该是声⾳⽅⾯的报错，不影响我们使⽤，直接⽆视
如果这⾥运⾏不起来，可以参考⽂档底下的踩坑问题解决⽅案中是否有你遇到的问题
8.初始化项⽬
1. 将本⽂前⾯准备材料⾥的SDK下载后的⽬录 Android-SDK@3.0.7.80630_20210123SDKlibs 下找到这两
个⽂件
1.
2. android-gif-drawable-release@
2. 然后再 Android-SDK@3.0.7.80630_20210123SDKassetsdata 下复制下⾯三个⽂件，为⽅便操作和上⾯
两个⽂件创建⼀个新的⽬录放在⼀起
1. dcloud_
2. dcloud_
3. dcloud_
3. 将IDE的⽂件⽬录试图默认是 Android视图 切换成 Project试图
4. 然后将刚刚复制的两个sdk⽂件粘贴到 下⾯
app/libs
5. 编辑 app/，引⼊lib⽂件
implementation fileTree(dir: 'libs', include: ['*.aar', '*.jar'], exclude: [])
implementation ':glide:4.9.0' // 基座依赖
implementation 't:support-v4:28.0.0'
implementation 'a:fastjson:d'
添加代码如下图所⽰，第⼀⾏ exclude可改可不改
接着 app/ 顶部，
将 和 值改成28，
compileSdkVersiontargetSdkVersion
将 改成 22
minSdkVersion
applicationId为创建时的包名，compileSdkVersion为编译版本，
minSdkVersion为兼容最⼩的版本号，targetSdkVersion为⽬标版本，
有兴趣的可以百度⼀下三者之间的区别和联系。注意，
官⽅⽂档中标注“App离线SDK minSdkVersion最低⽀持19，⼩于19在部分4.4以下机型上将⽆法正常使⽤。”
versionCode需要设定⼀个数值，⼀般为1，
每次更新版本时versionCode的值都要⽐前⼀个设置的值⼤，
否则⽆法正常安装，versionName⼀般填写主版本号次版本号和修正号，
如图中的“1.0”为最初版本号，其余的可以⾃⾏查阅。
修改后点击右上⾓ 进⾏同步
sync now
顺利的话这⾥应该可以同步成功
6. 在 app/src/main ⽬录下创建 assets/data 两层⽬录，把刚刚准备的xml和html复制到新⽬录下
7. 在 app/src/main/assets ⽬录下创建 apps ⽬录，把第5步打包的离线资源放⼊底下
注意，复制离线打包资源时，如下图中在上上级resources位置中，整个⽬录⼀起复制过去
复制后，如下图所⽰IDE会⾃动折叠⽬录变成⼀个域名
9.编译配置
在 app/src/main/res/values 下打开
这⾥的应⽤名称，与刚刚引⼊本地打包资源的⾥的⽂件进⾏⽐较
我这⾥两图⼤⼩写不⼀致，将 改成⼩写，确保两个⽂件名称⼀致
在 app/src/main/assets/data 下编辑 dcloud_ ，确保xml的appid 与 的appid⼀致
我这⾥对⽐⼀致⽆需更改，如果不⼀样的话，以中的appid为准
在 app/src/main 下编辑 删除代码⽚段
MainActivity
然后添加以下代码到刚刚删除的位置
android:name="aEntry" android:configChanges="orientation|keyboardHidden|keyboard|navigation" android:label="@string/app_name" android:launchMode="singleTask" android:hardwareAccelerated="true" android:theme="@style/TranslucentTheme" android:screenOrientation="user" android:windowSoftInputMode="adjustResize" > android:name="aEntryActivity" android:launchMode="singleTask" android:configChanges="orientation|keyboardHidden|screenSize|mcc|mnc|fontScale|keyboard" android:hardwareAccelerated="true" android:permission="missionsEditor" android:screenOrientation="user" android:theme="@style/DCloudTheme" android:windowSoftInputMode="adjustResize"> 11. 模拟器运⾏App 到这⾥基本完成了，可以尝试模拟器上运⾏app 如果顺利的话，此时弹出⼿机⾃动安装app后，就可以看到我们的web项⽬以app⽅式运⾏了 当然如果不顺利的话，可以参考下⾯的问答，或给博主留⾔ 12. 编译⽣成 apk 在菜单栏中选择Build，点击Generate Signed Bundle /项，进⼊打包页⾯。 选择apk，点击next 打包需要签名认证，点击创建。 如图，第⼀⾏创建⾃定义jks⽂件，并确定路径我把它设置为ips（这种其实是不符合jks格式的， 然后是设置密码 最后⽣成时可能会有警告，点击OK即可，⼀般为--*jks，平时还是要多注意规范）。 跳转到签名界⾯，因为都帮我们填好了，所以点击Next即可。 选择release完成 直接下图编译即可 完成后显⽰apk路径 13.遇到的问题及解决⽅案 Q&A 1. CPU没有开启虚拟化技术导致⽆法运⾏模拟器 在任务管理器中可以查看CPU是否开启虚拟化技术 如果没有开启，需要在BIOS中开启，这个可以百度⼀下，不同电脑启动虚拟化⽅式不⼀样 2. CPU是AMD的，运⾏⼿机模拟器时弹框推荐安装 HAXM ⼀款Intel硬件加速器 点击同意下载⼜⽆法安装，如下图 点击取消直接没反应，运⾏不了模拟器了 解决步骤，每⼀步都是必要步骤： 1. 使⽤ AMD替代的加速器，取消 HAXM ，点击下图⼯具栏这个管理包 2. 确保虚拟化技术有打开 3. 在启⽤或关闭windows功能⾥，取消勾选红框这两项⽬ 4. 进⼊⾃⼰SDK⽬录下的extrasgoogleAndroid_Emulator_Hypervisor_Driver的⽂件夹下，运⾏silent_ 如果执⾏结果返回是：STATE: 4 RUNNING，说明安装成功。就可以正常使⽤AS的模拟器了。 感谢观看，编写不易转载请指明出处： /demonxian3/p/
发布评论