<原创声明>本文首发于微信公众号,具有原创标识,秉着知识共享、互帮互助的原则欢迎大家的转载,但转载须有度,还请加出处请尊重别人的劳动成果,谢谢。


HBuilderX是一款不错的前端编辑器,它为使用者提供了云打包和离线打包两种形式,但云打包有着次数限制(可付费解锁),并且服务器繁忙时需要排队等候,不利于开发者的正常调试。从另一方面来看,尽管官方对于隐私保护极为重视,但还是无法让使用者打消代码上传泄露的疑虑,所以离线打包作为第二条打包途径理当重视。

HBuilderX安卓离线打包基于自身的SDK和AndroidStudio软件,AndroidStudio对于初学者来说较难掌握,而官方文档也过于简洁,初期打包可能各种报错,我在社区里看到不少离线打包失败的网友,本着知识共享的原则将HBuilderX安卓离线打包步骤一一演示,希望能帮助到大家。

因为uni-app和5+app打包有着些许的不同,在AndroidStudio的某些操作上还是有要注意的地方,比如build.gradle的同步,不更改某些设置的话,很容易被防火墙拦住,最终导致同步失败。

我在上篇5+app打包教程图文的基础上对文章做出了一定更改,以便符合uni-app打包的需求。废话不多说,我们直接开始往下进行。

第一步,AndroidStudio环境测试

首先要下载AndroidStudio软件,下面是官方网址:

https://developer.android.google.cn/studio/index.html

我们可以看到目前最新的版本是3.63,大家根据自己的电脑配置按照要求下载安装即可,如果想了解更多而自己的英文水平不是那么的好,可以私下使用谷歌浏览器翻译了解。

AndroidStudio下载安装完成后打开,如下图所示选中Empty Activity,点击Next创建。

编辑应用名称、包名和保存位置。包名格式一般为com.***.***,因为是测试AndroidStudio开发环境,所以包名我直接起为com.test.testas。

我们注意到下方Minimum SDK有下拉列表选项,这里简单解释一下,这是用来选择API的,注意到下面的蓝色标记“Your app will run on approximately 92.3% of device”了没,代表安卓用户中有92.3%的用户手机版本大于等于这个数,也就是安卓5.1及以上版本的Android手机可以正常使用这个应用,而低于此版本的手机即使安装成功也会闪退黑屏等无法打开。

这就需要你做一个权衡,怎么才能让应用覆盖更多的用户,太低不利于发展(版本迭代问题,高版本功能样式不能有效利用等),太高用户基数少(安卓9及以上的用户占比还不到40%),官方文档的建议是大于等于19,我这里选的是22,大家自行斟酌。

点击Finish完成创建。

看到下图的红色箭头了没,这个是创建模拟器的选项,在最初没有模拟器时如红色方框内“No Devices”状态,这在官方文档里最后运行描述时一笔带过,至于我为什么详细描述,在后面我会给大家解释。

点击红色箭头选项。

点击Create Virtual Device创建虚拟设备

在Phone栏里随意选择各种配置的模拟设备,如果你的电脑配置并不是多么好,建议挑选简单的比较容易加载,在这里我挑选了一个320×480的。点击Next

系统镜像,自己选择。点击Next

这个默认就行,直接点击Finish

我们可以看到虚拟设备已经创建完成,点击右上角×直接退出此界面。

顺着最左边的箭头,可以看到刚刚创建的虚拟设备标识,点击右边箭头指向的选项,运行虚拟设备(也可直接在上图中直接点击Actions栏中最左边的三角符号运行)。

等待片刻,模拟器成功打开。

此时点击红色框中"Run app"选项。

发现刚刚创建的Empty Activity项目成功跑起,这也就证明了你的AndroidStudio已经配置好了。相对于5+APP或者uni-app来说,AndroidStudio上手难,成效低,不少个人开发者转向移动APP开发时都没有接触过它,在初涉AndroidStudio时,好多人在安装配置方面往往报错,我第一次也是如此。

在写这篇教程时我是默认你SDK、API等全配置好了的,如果你在这一步报错,模拟器没能打开或者不能成功显示下图界面,就说明哪里仍存在问题,后续运行和调试自己的项目时很有可能会出错,建议大家配置完毕再往下进行。

第二步,APP离线SDK下载

下载安卓离线SDK包,网址如下:

https://nativesupport.dcloud.net.cn/AppDocs/download/android

这里要吐槽的一点是需要通过百度网盘下载...

下载好后在目录

2.7.5\Android-SDK@2.7.5.80183_20200519\SDK\libs

下找到

lib.5plus.base-release.aar

android-gif-drawable-release@1.2.17.aar

miit_mdid_1.0.10.aar

uniapp-release.aar

四个文件,复制到自定义的新文件夹方便使用

在目录

2.7.5\Android-SDK@2.7.5.80183_20200519\SDK\assets

下找到data文件夹,打开可以发现下图几个文件。

可以发现,较上一版本2.6.16少了dcloud1.dat和dcloud2.dat两个文件

官方文档中给出了说明:dcloud1.dat、dcloud2.dat为uni-app所需资源,2.7.0之后已不再需要,升级时需要删除,可以减少apk大小

返回上一级,复制data文件夹如上一步操作,为了方便与四个文件放到一起。

第三步,HBuilderX生成本地打包资源

在HBuilderX下创建uni-app项目,以登录模板为例

如图,在发行(P)选项原生APP-本地打包(L)中选择生成本地打包App资源(R)

显示导出成功,顺着路径将自己项目id名的文件夹拷贝,放到上一步自定义的文件夹下,方便使用。

这里我的项目id是__UNI__67D307E,就把它放到如图位置。

所需资源整理完毕,我们开始进行下一步操作。

第四步,安卓离线打包环境配置

切换到AndroidStudio,如果你第一步操作像我一样只是测试用,那也可以在里面再创建一个Empty Activity项目或者No Activity。

在第一步创建项目完毕时我们看到首页展示如下两个文件:

而在AndroidManifest.xml文件中application节点有如下标签:

在5+app图文中,我大致说了一下注释它的原因,这里再次强调:

我们看到的"Hello World!"页面来源于activity_main.xml文件

MainActivity.java文件中引入了activity_main.xml布局

AndroidManifest.xml文件里对MainActivity这个活动进行了注册

而中<intent-filter>标签里的内容则是对MainActivity做出了主活动声明。

如此一来,三者的关系就找到了。

如果依照官方文档在application节点中添加内容时不注释或删除掉自带的<activity>标签,那么模拟器运行时就会生成两个外表一样的apk文件,一个打开是"Hello World!"测试项目,一个才是你要打包的项目。

解决办法很简单,最优解是另建一个No Activity项目。

Next

Finsih

我们可以看到之前默认的是“Android”展示形式,而官方文档里是Project,为了契合我们把它换成下拉列表选项中最上面Project样式。

如图。

如下图将

lib.5plus.base-release.aar

android-gif-drawable-release@1.2.17.aar

miit_mdid_1.0.10.aar

uniapp-release.aar

四个文件复制粘贴到libs目录下

点击build.gradle①,下滑到底部资源引用页面

如下图添加引用资源,

implementation fileTree(dir: 'libs', include: ['*.aar', '*.jar'], exclude: [])

implementation "com.android.support:support-v4:28.0.0"

implementation "com.android.support:appcompat-v7:28.0.0"

implementation 'com.android.support:recyclerview-v7:28.0.0'

implementation 'com.facebook.fresco:fresco:1.13.0'

implementation "com.facebook.fresco:animated-gif:1.13.0"

implementation 'com.github.bumptech.glide:glide:4.9.0'

implementation 'com.alibaba:fastjson:1.1.46.android'

如图在android{

...

    }内添加

aaptOptions {

additionalParameters '--auto-add-overlay'  

ignoreAssetsPattern "!.svn:!.git:.*:!CVS:!thumbs.db:!picasa.ini:!*.scc:*~" 

 }

点击红色框中的任一选项进行同步处理。

如果发现同步等待时间很长或者同步失败,解决办法如下

1.在build.gradle②

buildscript {

repositories {

             //这里1

        }

}

里添加:

maven{ url 'http://maven.aliyun.com/nexus/content/groups/public/'}

maven{ url 'http://maven.aliyun.com/nexus/content/repositories/jcenter' }

2.build.gradle②页往下滑动,在

allprojects{

    repositories {

             //这里2

        }

}

里添加:

maven{ url 'http://maven.aliyun.com/nexus/content/groups/public/'}

maven{ url 'http://maven.aliyun.com/nexus/content/repositories/jcenter' }

注意观察build.gradle②的位置build.gradle②非彼build.gradle①,build.gradle①在目录app内,build.gradle②在目录app外

3.在菜单栏File点击Settings

进入选项Http Proxy

选中auto-detect proxy settings选项

选中automatic proxy configuration URL选项,在右侧选项框中输入:mirrors.neusoft.edu.cn:80

点击OK退出菜单

再次点击sync按钮,发现同步成功

同步成功后,回到build.gradle①页面,在页面最上方配置app版本号。

compileSdkVersion为编译版本,buildToolsVersion为构建工具版本,applicationId为创建时的包名,minSdkVersion为兼容最小的版本号,targetSdkVersion为目标版本,有兴趣的可以百度一下三者之间的区别和联系。

注意,官方文档中标注“App离线SDK minSdkVersion最低支持19,小于19在部分4.4以下机型上将无法正常使用。”

versionCode需要设定一个数值,一般初始为1,更新版本时versionCode的值需要做出更改,每次都要比前一个设置的值大,否则无法正常安装。

versionName一般填写主版本号次版本号和修正号,如图中的“1.0”为最初版本号,其余的可以自行查阅。

下面配置资源,你可能会奇怪我为什么跟官方文档顺序不一样,官方文档这一步是开始在strings.xml里修改应用名。因为资源导入的先后会影响使用和观感,之前在HBuilderX中生成本地打包的app资源还没引入怎么跟strings.xml里的应用名比较呢。

我们在main文件夹下创建assets文件夹。

把刚刚转移到自定义文件夹下的data文件夹拷贝到assets文件夹下。

如图

继续在刚刚创建的assets文件夹下创建apps文件夹,把第三步中的文件(我的是__UNI__67D307E)拷贝到apps文件夹下。

自此资源引入完成,进行下一步strings.xml操作。

在app→src→main→res→ values配置strings.xml文件,修改应用名称,与刚刚引入本地打包资源的里的manifest.json文件比较

(注:manifest.json文件在

assets>apps>__UNI__67D307E>www目录下)

发现不一致,遂将string.xml里的“uniApp”改为Test0520。

将manifest.json里的"version"和"code"分别修改至与上文versionName、versionCode里填写相同。

在app→src→main下配置AndroidManifest.xml文件

将其修改为

然后继续下一步,添加内容到application节点。

代码

<activity
      android:name="io.dcloud.PandoraEntry"
      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" >
      <intent-filter>
          <action android:name="android.intent.action.MAIN" />
          <category android:name="android.intent.category.LAUNCHER" />
      </intent-filter>
  </activity>
  <activity
      android:name="io.dcloud.PandoraEntryActivity"
      android:launchMode="singleTask"
      android:configChanges="orientation|keyboardHidden|screenSize|mcc|mnc|fontScale|keyboard"
      android:hardwareAccelerated="true"
      android:permission="com.miui.securitycenter.permission.AppPermissionsEditor"
      android:screenOrientation="user"
      android:theme="@style/DCloudTheme"
      android:windowSoftInputMode="adjustResize">
      <intent-filter>
          <category android:name="android.intent.category.DEFAULT" />
          <category android:name="android.intent.category.BROWSABLE" />
          <action android:name="android.intent.action.VIEW" />
          <data android:scheme="h56131bcf" />
      </intent-filter>
  </activity>

如下图。

下面是应用图标和启动页面的配置

官方文档

icon.png为应用的图标,push.png为推送消息的图标,splash.png为应用启动页的图标,只要将icon.png、push.png、splash.png放置到drawable,drawalbe-ldpi,drawable-mdpi,drawable-hdpi,drawable-xhdpi,drawable-xxhdpi文件夹下,就会自动引用,不同文件夹下对应不同图片尺寸,可参考

https://blog.csdn.net/xuaho0907/article/details/72848520

里面说的比较清楚,我就不多此一举了,我举另外的例子,通过AndroidStudio软件修改应用图标。

在应用目录内部右键调出菜单(New→Image Asset),点击。

出来应用图标设置界面。

修改背景为红色

修改前景为文字Love

点击Finish

这样一个简单的应用图标就完成啦,有需求的可以网上详细了解哦。

下面配置资源环境。

将assets下apps文件夹中的manifest.json文件和data文件夹中的dcloud_control.xml文件打开,确保manifest.json中的id和dcloud_control.xml中的appid一致。

自定义基座暂不考虑。

然后就可以愉快地调试程序啦,

Run~

图标

打开。

效果。

uni-app运行环境版本和编译器版本要尽量一致,不然会出现下列情况

最后一步,离线打包

在菜单栏中选择Build,点击Generate Signed Bundle /APK...项,进入打包页面。

选中APK,点击Next

打包需要签名认证,点击Create new...创建。

如图,第一行创建自定义jks文件,并确定路径,我把它设置为love(这种其实是不符合jks格式的,最后生成时可能会有警告,一般为*-*-*.jks,平时还是要多注意规范)。

填写密钥库密码和确定密钥库密码,因为是演示,我把密码设置为123456。

Alias为密钥名称,在这里把它设置love,Password为密钥密码,仍设置为123456,Validity(years)为密钥有效时间,按年算起,直接默认即可。

下面First and Last Name为名字和姓氏 ,Organizational Unit为组织单位 ,Organization为组织,City or Locality为城市或地区,State or Province为州或者省份,Country Code(XX)为国家 ,至少选填一种,这里我们直接填上国家China。

点击OK

提示jks命名格式不对(不要学我),点击OK。

跳转到签名界面,因为都帮我们填好了,所以点击Next即可。

这里要说一下V1和V2的选择问题,V1属于旧的验证方式,V2是在安卓版本7.0之后新的验证方式,只勾选V1在Android7.0以上不会使用更安全的验证方式,如果只勾选V2那么安卓版本7.0以下的手机将无法正常安装,所以建议V1和V2同时勾选。

debug和release不用多说,一个是测试版一个是正式版,这里我直接选择release,点击Finish,等待打包完成。

完成打包,点击locate或者直接进入到AndroidStudio项目文件夹\uniApp\app\release目录下,

找到app-release.apk包,安装。

打开

教程结束。

总结

本次教程与5+app有稍许不同之处,例如在第四步采用No Activity方式来打包项目,代替了原来的Empty Activity,并简单介绍了MainActivity.javaactivity_main.xmlAndroidManifest.xml三者之间的联系,另外在一些文字错误和细节问题上也予以修正,希望能帮助到大家。

官方文档中附加的内容

基座配置文档:

https://ask.dcloud.net.cn/article/35482

安卓模块及第三方SDK配置:

https://nativesupport.dcloud.net.cn/AppDocs/usemodule/android

Android注意事项:

https://nativesupport.dcloud.net.cn/AppDocs/FAQ/android

最后

HBuilderX安卓离线打包教程uni-app就到这里啦,教程已经足够完善,如果需要演示视频,请转到公众号紫色云间(微信号:ziseyunjian)直接回复uni-app或者uni即可,也可以在菜单栏右侧点击共享菜单自行选择。

更多精彩请关注紫色云间微信公众号~

整理不易,觉得可以的话欢迎关注或收藏,如果还有什么问题直接在下面回复即可,公众号也行,要是我不会的话...还请当做从来没见过我o(╥﹏╥)o

拜拜~

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐