uni-app&H5&Android混合开发一 || 最全面的uni-app离线打包Android平台教程
<h2>前言：</h2><p> 为什么会写这么一个教程，因为很久之前做过一个对接银行POS我们的系统是使用的H5开发的app应用。但是假如对结果银行相关业务的小伙伴应该都清楚，银行的业务相对于其他的对接方而言安全性比较高，而且一般都不会提供定制开发，所以只能我们自己来实现与他们的对接。因此我们把支付这一块做成了Android原生的对接，因为我们需要对接银行提供的Activity组件来来实现POS机扫码、刷卡等相关的支付功能。</p>
<h2 class="postTitle">uni-app跨平台框架介绍和快速入门</h2>
<blockquote>
<p class="postTitle">uni-app跨平台框架介绍和快速入门</p>
</blockquote>
<h2>什么是原生开发？什么是混合开发？两者有什么区别？</h2>
<blockquote>
<p>详情概述：https://zhuanlan.zhihu.com/p/32146560</p>
</blockquote>
<h2>开发环境准备：</h2>
<blockquote>
<p>Android Studio 下载地址：Android Studio官网 OR Android Studio中文社区</p>
<p>(Android Studio 下载安装详细教程：https://blog.csdn.net/wangmx1993328/article/details/81905195<span style="background-color: initial">)</span></p>
<p>uni-app开发环境安装：HBuilderX</p>
<p>App离线SDK下载：最新android平台SDK下载</p>
</blockquote>
<h2>下载uni-app 安卓打包所需要的 SDK：</h2>
<blockquote>
<p>https://nativesupport.dcloud.net.cn/AppDocs/download/android</p>
</blockquote>
<p></p>
<p> <img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503002130073-951731530.png" alt="" loading="lazy"></p>
<h3>下载成功，如下图所示：</h3>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503002355426-1075300695.png" alt="" loading="lazy"></p>
<h2>使用Android Studio 打开Hbuilder-Hello （H5+项目模板），并编译：</h2>
<h3>注意：</h3>
<blockquote>
<p>下文中的Hbuilder-Hello等于HBuilder-HelloUniApp因为之前版本是叫做HBuilder-Hello，所以大家只要知道这两个SDK其实是一样的只是版本不一样而已。</p>
</blockquote>
<p></p>
<h3>注意不要把项目放在带有中文的文件夹目录下面，否则无法编译通过提示一下错误：</h3>
<blockquote>
<div>编译的时候会提示：项目路径包含非ASCII字符。这很可能会导致Windows上的生成失败。请将项目移到其他目录或者更改为英文文件名。</div>
<p></p>
</blockquote>
<p></p>
<p></p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503002617687-1292032710.png" alt="" loading="lazy"></p>
<h3> 打开Hbuilder-Hello Android项目：</h3>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503003122556-913161711.png" alt="" loading="lazy"></p>
<blockquote>
<p> 注意：导入成功以后进行项目编译，注意第一次项目编译可能会出现ERROR: Read timed out的情况，不过不要慌继续点击编译即可解决。</p>
</blockquote>
<p></p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503003204935-2067239834.png" alt="" loading="lazy"></p>
<h2>解决项目编译通过后无法直接在虚拟设备中运行提示Error:moudle not specified：</h2>
<h3>问题查找：</h3>
<p></p>
<h4><strong>1、点击Edit Configurations：</strong></h4>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503003704178-82182320.png" alt="" loading="lazy"></p>
<h4><strong> 2、 在弹出层左侧选择，Android App>app 查看General模块下的Module中是否存在其他模块:</strong></h4>
<p></p>
<p></p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503003802802-1488376628.png" alt="" loading="lazy"></p>
<h3> Android Studio中运行项目时提示Error:moudle not specified，解决方案：</h3>
<p></p>
<blockquote>
<p> 点击搜索按钮，输入【Sync Project With Gradle Files】，直接点击下面搜索到的内容，然后就会自动安装缺少的Gradle Files文件，安装完成之后项目即可运行！</p>
</blockquote>
<p></p>
<p></p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503004055503-1377591329.png" alt="" loading="lazy"></p>
<h2> 使用Android Studio中的虚拟设备运行项目，查看运行效果：</h2>
<h3 id="8590-1572690920488">如何使用Android Studio中的虚拟设备运行项目，如下图所示：</h3>
<p></p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503004149257-2005104072.png" alt="" loading="lazy"></p>
<p> </p>
<h3> 虚拟设备运行成功后的项目界面：</h3>
<p></p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210503004208713-1038128421.png" alt="" loading="lazy"></p>
<h2>HBuilderX生成本地打包App资源：</h2>
<h3>生成本地打包App资源：</h3>
<p>使用HBuilderX写好的项目，点击发行 > 原生app-本地打包 > 生成本地打包资源，打包完成后，HBuilderX控制台会输出打包信息和打包路径：</p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504014136595-1712070452.png" alt="" loading="lazy"></p>
<p> </p>
<p> </p>
<h3>生成的资源文件如下图所示：</h3>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504014211881-1946536733.png" alt="" loading="lazy" style="font-size: 14px"></p>
<h3>Android知识点补充，assets资源目录和res目录介绍：</h3>
<div id="3970-1572694549680"><strong>assets目录下存放的原生资源文件(不会被编译)：</strong></div>
<blockquote>
<div id="4722-1572694155103">Android的体系架构设计中，assets目录下的数据内容（图片、文件等等）将不会被Android系统压缩、二次处理等，assets目录下的文件将保持原汁原味打包进Android的apk文件中，因此，利用Android assets这一点特性，根据项目开发的需要，在某种情况下，可以在assets目录下存放一些不希望被Android系统二次处理的原始文件，就像在PC开发时候直接针对硬盘上存放的文件内容进行读写一样读出原始数据。</div>
</blockquote>
<h3 id="6900-1572694408720">res目录下存放的可编译的资源文件：</h3>
<blockquote>
<div> 这种资源文件系统会在R.java里面自动生成该资源文件的ID，所以访问这种资源文件比较简单，通过R.XXX.ID即可。</div>
</blockquote>
<div>
<h2 id="5898-1572695037992">HBuilder-Hello > app > src > main 文件图解：</h2>
<div>打开android studio 切换项目到project目录，依次打开 HBuilder-Hello > app > src > main > assets，能看到apps.HelloH5.www 和 data 两个文件夹：</div>
<div><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020149704-510468432.png" alt="" loading="lazy">
<p> <img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020203561-1531346423.png" alt="" loading="lazy"></p>
<p> <img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020218247-853585432.png" alt="" loading="lazy"></p>
<h2>将HBuilderX生成本地打包App资源复制到项目App>src>main>assets>apps目录下：</h2>
<blockquote>
<div>将本地App资源文件Copy到App>src>main>assets>apps目录中，并把之前的apps.HelloH5.www 删除（也可以不删除）。</div>
</blockquote>
<p></p>
</div>
</div>
<div><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020308396-380944930.png" alt="" loading="lazy">
<h2>apps目录下存在多个app项目如何指定对应项目运行：</h2>
<div>当我们没有删除apps目录文件夹下的apps.HelloH5.www项目时，在存在两个app项目的情况下如何指定对应的项目运行，下图所示：</div>
<div><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020417354-538245246.png" alt="" loading="lazy">
<h2>替换dcloud_control.xml中的appid：</h2>
<p></p>
</div>
<p></p>
</div>
<div>
<div>复制apps.HelloH5.www>maindest.json 中的id(__UNI__18BEDD3 我项目中的id)，替换data>dcloud_control.xml 中的 appid：</div>
</div>
<div id="3970-1572694549680"><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020506999-1957317376.png" alt="" loading="lazy">
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020516820-114001324.png" alt="" loading="lazy"></p>
<h2>替换项目appid后重新编译项目，查看HBuilderX生成的本地App资源效果：</h2>
<h3 id="1380-1572696142954">替换appid后先点击Build先点击Clean Project（清理项目），然后在Make Project（重新编译项目）：</h3>
<p></p>
<p></p>
</div>
<p></p>
<p></p>
<p> <img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020831125-1807993778.png" alt="" loading="lazy"></p>
<p> </p>
<h3> 虚拟设备运行成功后的项目界面：</h3>
<p></p>
<p><img src="https://img2020.cnblogs.com/blog/1336199/202105/1336199-20210504020859419-79387272.png" alt="" loading="lazy"></p>
<p> </p>
<h2>uni-app&H5&Android混合开发教程汇总</h2>
<h3 class="postTitle">uni-app&H5&Android混合开发一 || 最全面的uni-app离线打包Android平台教程</h3>
<h3 class="postTitle">uni-app&H5&Android混合开发二 || 使用Android Studio打包应用APK</h3>
<h3 class="postTitle">uni-app&H5&Android混合开发三 || uni-app调用Android原生方法的三种方式</h3>
<h3 class="postTitle">【新手指南】Android Studio中应用App的相关配置</h3>
<p> </p>
<p> </p>
<p></p>
<p></p>
</div>
<div id="MySignature" role="contentinfo">
<blockquote >
<p style='font-family:YouYuan;font-size: 16px;margin: 0 auto 0.01em auto;'><span style='font-size: 17px; '>作者名称：</span>追逐时光者</p>
<p style='font-family:YouYuan;font-size: 16px;margin: 0 auto 0.01em auto;'><span style='font-size: 17px; '>作者简介：</span>一个热爱编程、善于分享、喜欢学习、探索、尝试新事物和新技术的全栈软件工程师。</p>
<p style='font-family:YouYuan;font-size: 16px;margin: 0 auto 0.01em auto;'>
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文链接，否则保留追究法律责任的权利。如果该篇文章对您有帮助的话，可以点一下右下角的【♥推荐♥】，希望能够持续的为大家带来好的技术文章，文中可能存在描述不正确的地方，欢迎指正或补充，不胜感激。
</p>
</blockquote><br><br>
来源：https://www.cnblogs.com/Can-daydayup/p/12008873.html
頁:
[1]