前言:

  为什么会写这么一个教程,因为很久之前做过一个对接银行POS我们的系统是使用的H5开发的app应用。但是假如对结果银行相关业务的小伙伴应该都清楚,银行的业务相对于其他的对接方而言安全性比较高,而且一般都不会提供定制开发,所以只能我们自己来实现与他们的对接。因此我们把支付这一块做成了Android原生的对接,因为我们需要对接银行提供的Activity组件来来实现POS机扫码、刷卡等相关的支付功能。

什么是原生开发?什么是混合开发?两者有什么区别?

详情概述:https://zhuanlan.zhihu.com/p/32146560

开发环境准备:

Android Studio 下载地址:Android Studio官网 OR Android Studio中文社区

(Android Studio 下载安装详细教程:https://blog.csdn.net/wangmx1993328/article/details/81905195)

uni-app开发环境安装:HBuilderX

App离线SDK下载:最新android平台SDK下载

下载uni-app 安卓打包所需要的 SDK:

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

下载成功,如下图所示:

使用Android Studio 打开Hbuilder-Hello (H5+项目模板),并编译:

注意:

下文中的Hbuilder-Hello等于HBuilder-HelloUniApp因为之前版本是叫做HBuilder-Hello,所以大家只要知道这两个SDK其实是一样的只是版本不一样而已。

注意不要把项目放在带有中文的文件夹目录下面,否则无法编译通过提示一下错误:

编译的时候会提示:项目路径包含非ASCII字符。这很可能会导致Windows上的生成失败。请将项目移到其他目录或者更改为英文文件名。

打开Hbuilder-Hello Android项目:

注意:导入成功以后进行项目编译,注意第一次项目编译可能会出现ERROR: Read timed out的情况,不过不要慌继续点击编译即可解决。

解决项目编译通过后无法直接在虚拟设备中运行提示Error:moudle not specified:

问题查找:

1、点击Edit Configurations:

 2、 在弹出层左侧选择,Android App>app 查看General模块下的Module中是否存在其他模块:

Android Studio中运行项目时提示Error:moudle not specified,解决方案:

点击搜索按钮,输入【Sync Project With Gradle Files】,直接点击下面搜索到的内容,然后就会自动安装缺少的Gradle Files文件,安装完成之后项目即可运行!

使用Android Studio中的虚拟设备运行项目,查看运行效果:

如何使用Android Studio中的虚拟设备运行项目,如下图所示:

虚拟设备运行成功后的项目界面:

HBuilderX生成本地打包App资源:

生成本地打包App资源:

使用HBuilderX写好的项目,点击发行 > 原生app-本地打包 > 生成本地打包资源,打包完成后,HBuilderX控制台会输出打包信息和打包路径:

生成的资源文件如下图所示:

Android知识点补充,assets资源目录和res目录介绍:

assets目录下存放的原生资源文件(不会被编译):
Android的体系架构设计中,assets目录下的数据内容(图片、文件等等)将不会被Android系统压缩、二次处理等,assets目录下的文件将保持原汁原味打包进Android的apk文件中,因此,利用Android assets这一点特性,根据项目开发的需要,在某种情况下,可以在assets目录下存放一些不希望被Android系统二次处理的原始文件,就像在PC开发时候直接针对硬盘上存放的文件内容进行读写一样读出原始数据。

res目录下存放的可编译的资源文件:

 这种资源文件系统会在R.java里面自动生成该资源文件的ID,所以访问这种资源文件比较简单,通过R.XXX.ID即可。

HBuilder-Hello > app > src > main 文件图解:

打开android studio 切换项目到project目录,依次打开 HBuilder-Hello > app > src > main > assets,能看到apps.HelloH5.www 和 data 两个文件夹:

将HBuilderX生成本地打包App资源复制到项目App>src>main>assets>apps目录下:

将本地App资源文件Copy到App>src>main>assets>apps目录中,并把之前的apps.HelloH5.www 删除(也可以不删除)。

apps目录下存在多个app项目如何指定对应项目运行:

当我们没有删除apps目录文件夹下的apps.HelloH5.www项目时,在存在两个app项目的情况下如何指定对应的项目运行,下图所示:

替换dcloud_control.xml中的appid:

复制apps.HelloH5.www>maindest.json 中的id(__UNI__18BEDD3 我项目中的id),替换data>dcloud_control.xml 中的 appid:

替换项目appid后重新编译项目,查看HBuilderX生成的本地App资源效果:

替换appid后先点击Build先点击Clean Project(清理项目),然后在Make Project(重新编译项目):

虚拟设备运行成功后的项目界面:

uni-app&H5&Android混合开发一 || 最全面的uni-app离线打包Android平台教程的更多相关文章

  1. uni-app&H5&Android混合开发三 || uni-app调用Android原生方法的三种方式

    前言: 关于H5的调用Android原生方法的方式有很多,在该片文章中我主要简单介绍三种与Android原生方法交互的方式. 一.H5+方法调用android原生方法 H5+ Android开发规范官 ...

  2. uni-app&H5&Android混合开发二 || 使用Android Studio打包应用APK

    前言: 在上一章节我们已经讲了如何uni-app离线打包Android平台教程,这一章就该来讲讲如何使用Android Studio打包应用APK提供给Android手机安装使用了. 第一步.首先打开 ...

  3. Android混合开发,html5自己主动更新爬过的坑

    如今使用混合开发的公司越来越多,尽管出现了一些新技术,比方Facebook的react native.阿里的weex,但依旧阻挡不了一些公司採用h5的决心.当然,这也是从多方面考虑的选择. 在三年前就 ...

  4. 《Android Studio开发实战 从零基础到App上线》资源下载和内容勘误

    转载于:https://blog.csdn.net/aqi00/article/details/73065392 资源下载 下面是<Android Studio开发实战 从零基础到App上线&g ...

  5. [Hybrid App]--Android混合开发,Android、Js的交互

    AndroidJs通信 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !imp ...

  6. 基于H5的混合开发介绍(一)WebView

    转自: https://www.cnblogs.com/sanchang/p/9261461.html 一 WebView到底是什么    1 WebView是一种控件,它基于webkit引擎,因此具 ...

  7. android混合开发,webview的java与js互操作

    android原生应用,用webview加载应用中的网页,并且java代码与js代码可以互相操作. 这是混合开发的基石,最基本也最重要的东西,实验代码在这里. 概括说说—— java调js:调用web ...

  8. Android 混合开发 的一些心得。

    其实所谓这个混合开发,也就是hybird,就是一些简单的,html5和native 代码之间的交互.很多电商之类的app里面都有类似的功能, 这种东西其实还是蛮重要的,主要就是你有什么功能都可以进行热 ...

  9. Flutter与Android混合开发及Platform Channel的使用

    相对于单独开发Flutter应用,混合开发对于线上项目更具有实际意义,可以把风险控制到最低,也可以进行实战上线.所以介绍 集成已有项目 混合开发涉及原生Native和Flutter进行通信传输,还有插 ...

随机推荐

  1. Markdown(3)Typora快捷键

    Typora(3)快捷键 一.快捷键列表 操作内容 快捷键 助记词 1. 标题 Ctrl + 数字 1-6 2. 段落 Ctrl + 数字 0 3. 粗体 Ctrl + B (B) Bold 4. 斜 ...

  2. 后端程序员之路 35、Index搜索引擎实现分析4-最终的正排索引与倒排索引

    # index_box 提供搜索功能的实现- 持有std::vector<ITEM> _buffer; 存储所有文章信息- 持有ForwardIndex _forward_index;  ...

  3. MySQL:安装与配置

    记录一次 MySQL 在Windows系统的安装配置过程 安装MySQL 0.下载社区版安装包 官网下载地址:https://dev.mysql.com/downloads/installer/ 1. ...

  4. 一文讲通.NET Core部署到Windows IIS最全解决方案

    回顾之前的ASP.NET的经典托管 在经典ASP.NET应用程序中,所有一切都托管在IIS工作进程中(w3wp.exe),这也被称为IIS应用程序池.ASP.NET程序被托管在应用程序池中,并且被按照 ...

  5. MongoDB 在Node中的应用

    转: MongoDB 在Node中的应用 文章目录 一 .什么是 MongoDB? 二.小Demo 三.Demo 增删改查 3.1 新增 3.2 查询 3.2.1 查询所有 [{},{}] 找不到返回 ...

  6. 剑指 Offer 37. 序列化二叉树 + 二叉树的层次遍历

    剑指 Offer 37. 序列化二叉树 Offer_37 题目描述 题目解析 本题主要考察的就是二叉树的层次遍历. 层次遍历时可以根据二叉树的特点将空结点也进栈. 反序列化时同样可以根据层次遍历的思路 ...

  7. crudapi零代码开发平台应用场景和成功案例

    应用场景 在前面文章中,已经介绍了crudapi主要功能和使用方式,本文主要介绍crudapi应用场景以及具体的使用方式. 概要 crudapi属于产品级的零代码平台,无需编程,通过配置自动生成cru ...

  8. 翻译:《实用的Python编程》04_04_Defining_exceptions

    目录 | 上一节 (4.3 特殊方法) | 下一节 (5 对象模型) 4.4 定义异常 用户可以通过类实现自定义异常: class NetworkError(Exception): pass **异常 ...

  9. WPF 应用 - 在 web 中启动 exe

    以下 F:/Debug/xx.exe 为客户端路径. 1. Web 调用 1.1 IE 内核的浏览器调用方式 js 函数调用如下: var a=new ActiveXObject("Wscr ...

  10. 2019 GDUT Rating Contest I : Problem G. Back and Forth

    题面: G. Back and Forth Input file: standard input Output file: standard output Time limit: 1 second Mem ...