前言:

  为什么会写这么一个教程,因为很久之前做过一个对接银行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. Centos7 升级 sqlite3

    下载地址:https://www.sqlite.org/download.html [root@djangoServer ~]# wget https://www.sqlite.org/2019/sq ...

  2. Mybatis初步认识

    分三层 第一章 1.三层架构 界面层:和用户打交道,接收用户的请求参数明显是处理结果的(jsp,html,servlet) 业务逻辑层:接收了界面层传递的数据,计算逻辑,调用数据库,获取数据 数据访问 ...

  3. CF1491C Pekora and Trampoline 题解

    题目链接 ​ 比赛时只想到了 \(\mathcal O(n^3)\) 的暴力做法,官方题解是 \(\mathcal O(n^2)\) ,并且是可以优化为 \(\mathcal O(n)\) 的(贪心+ ...

  4. matplotlib工具栏源码探析三(添加、删除自定义工具项)

    转: matplotlib工具栏源码探析三(添加.删除自定义工具项) matplotlib工具栏源码探析二(添加.删除内置工具项)探讨了工具栏内置工具项的管理,除了内置工具项,很多场景中需要自定义工具 ...

  5. TestLink测试用例管理工具使用说明

    TestLink使用说明 打开网页,登录账号:(这里的账号是已经注册过的,并且拥有admin权限,可以创建用户.当然也可以通过点击登录页面的"新用户注册"按钮进行注册,但是权限是g ...

  6. SQL注入绕过waf的一万种姿势

      绕过waf分类: 白盒绕过: 针对代码审计,有的waf采用代码的方式,编写过滤函数,如下blacklist()函数所示: 1 ........ 2 3 $id=$_GET['id']; 4 5 $ ...

  7. Python爬虫学习一------HTTP的基本原理

    昨天刚买的崔大大的<Python3网络爬虫开发实战>,今天就到了,开心的读完了爬虫基础这一章,现记录下自己的浅薄理解,如有见解不到位之处,望指出. 1.HTTP的基本原理 ①我们经常会在浏 ...

  8. TIOBE 编程语言排行榜

    https://www.tiobe.com/tiobe-index/ TIOBE 编程语言排行榜是编程语言流行趋势的一个指标

  9. Codeforces Round #548 C. Edgy Trees

    题面: 传送门 题目描述: 给出有n个节点的树,整数k.题目要求找长度为k,符合规则(good序列)的"点序列"(由节点构成的序列)个数有多少?规则如下: 1.走一条出发点为a1, ...

  10. 一个操作 cookie 的原生方法 cookieStore

    我们平时对 cookie 的增删改查等操作,都是在操作 document.cookie,这里我们介绍一个新方法cookieStore. 1. 平时如何操作 cookie document.cookie ...