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

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

前言:

  关于H5的调用Android原生方法的方式有很多,在该片文章中我主要简单介绍三种与Android原生方法交互的方式。

uni-app跨平台框架介绍和快速入门

uni-app跨平台框架介绍和快速入门

一、H5+方法调用android原生方法

H5+ Android开发规范官方文档:

https://www.html5plus.org/doc/zh_cn/android.html

H5端调用Android activity 并获取activity返回过来的数据

//获取当前Activity,使用H5的方式调用android原生方法,从而启动activity
var main = plus.android.runtimeMainActivity();
//invoke: 调用对象(类对象/实例对象)的方法,调用Android原生方法        
plus.android.invoke('com.pingAnBank.payment.PingAnPaymentHelper', 'StartCallPosPayment', paymentMoney,orderNumber, main, paymentType);
//requestCode请求码,即调用startActivityForResult()传递过去的值(一般为int,标志不同的支付类型)
//resultCode  结果码,结果码用于标识返回数据来自哪个新Activity
//data Intent中所携带的数据
main.onActivityResult = function(requestCode, resultCode, data) {
//解析android 的activity回传过来的数据
plus.android.importClass(data);
var bundle = data.getExtras();
plus.android.importClass(bundle);
//获取activity回传过来的参数值
var amount = bundle.getString("amount"); //支付金额
var traceNo = bundle.getString("traceNo"); //支付流水号
}

调用Android方法说明:plus.android.invoke('com.pingAnBank.payment.PingAnPaymentHelper', 'StartCallPosPayment', paymentMoney,orderNumber, main, paymentType);

com.pingAnBank.payment.PingAnPaymentHelper:Android中的内部类名

StartCallPosPayment:Android中的内部类名中的方法名

paymentMoney,orderNumber, paymentType:方法所需的参数

main:当前页面的Activity

1336199-20210724005612122-346465180.png

二、uniapp原生插件调用Android原生方法

Android原生插件开发教程:https://nativesupport.dcloud.net.cn/NativePlugin/course/android

实现功能:通过点击uni-app页面中的按钮传递参数,调用android原生代码,然后Android原生代码处理数据,返回到uniapp页面展示。

uni-app代码:

<template>
    <view class="content">
        <view @click="callAndroidWay">android原生方法调用</view>
    </view>
</template>
<script>
    // 导入自己定义的插件js
    var elitetyc = require('../plugin.js');
    export default {
        data() {
            return {
                 plugins: elitetyc
            }
        },
        onLoad() {
        },
        methods: {
             callAndroidWay(){
              this.plugins.StartCallPosPayment(
                  "这段文字是uniapp传过来的",
                  function(result) {
                      uni.showToast({title:JSON.stringify(result),icon:'none',duration:5000});
                  },
                  function(result) {
                      uni.showToast({title:result,icon:"none",duration:5000});
                  }
              );
             }
        }
    }
</script>

plugin.js插件代码:

! function(root, factory) { 
if (typeof exports == 'object' && typeof module != 'undefined') { 
    module.exports = factory() 
} else if (typeof define == 'function' && define.amd) { 
    define(factory) 
} else { 
    document.addEventListener('plusready', function(){ 
    // 这里是定义插件的名称
    var moduleName = 'elitetyc';  
    root.plus[moduleName] = factory() 
    },false); 
} 
}(this, function() { 
//在此处定义自己的方法 (这里也是插件的名称,可以看到在后面的)
var _BARCODE = 'elitetyc'; 
var plugintest = { 
    // 这里定义了一个名叫StartCallPosPayment的方法,传递三个参数,后面两个是回调函数
    StartCallPosPayment: function(num, successCallback, errorCallback) {
        var success = typeof successCallback !== 'function' ? null : function(args) {
                successCallback(args);
            },
            fail = typeof errorCallback !== 'function' ? null : function(code) {
                errorCallback(code);
            };
      // 回调ID,后面原生代码中会用到,就好像你调用我,我有结果了,我该知道我把数据返回给谁把?这个id就是这个作用
        var callbackID = plus.bridge.callbackId(success, fail);
      // 在上面有讲到过,这里需要注意的是前两个参数,第一个参数是插件类别名,后面再原生代码中的dcloud_properties.xml文件中会用到第二个参数(HelloAndroidWay),是android原生代码中的方法名要一致
        return plus.bridge.exec(_BARCODE, "HelloAndroidWay", [callbackID, num]);
    }
}; 
return plugintest; 
}); 

Android代码:

  我们需要在Android项目中新建一个java文件,在对应的类中什么一个HelloAndroidWay的方法。

/**
   * 定义一个名为HelloAndroidWay的方法
   * @param pWebview
   * @param array
   */
  public void HelloAndroidWay(IWebview pWebview, JSONArray array) {
    //获取回调ID
    String CallBackID = array.optString(0);
    //        获取参数并计算(这里模拟原生处理)
    String newstring = "你好,这个字符串来自android原生代码,您传过来的参数是:" + array.optString(1);
    //        构建回传参数
    JSONArray newArray = new JSONArray();
    newArray.put(newstring);
    //        JSUtil.execCallback(IWebview pWebViewImpl,String pCallbackId,String pMessage,int pStatus,boolean pKeepCallback)
    //        参数:
    //        pWebViewImpl - webview对象
    //        pCallbackId - 回调方法ID
    //        pMessage - 回调信息
    //        pStatus - 回调code值 如:OK、ERROR
    //        pKeepCallback - js层回调function是否要保存
    // 第一个参数是当前函数的入参,直接传入, 第二个是根据入参获取的回调id,第三个是回调的数据,是一个json数组
    JSUtil.execCallback(pWebview, CallBackID, newstring, JSUtil.OK, false);
  }

三、WebView简单实现Android与H5互调

WebView简介:

  要实现Android与H5互调,WebView是一个很重要的控件,WebView可以很好地帮助我们展示html页面,所以有必要先了解一下WebView。

关于使用WebView简单实现Android与H5互调的参考文章参考下面文章:

https://blog.csdn.net/qq_24530405/article/details/52067474

相关文章
|
6月前
|
移动开发 前端开发 Android开发
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
1142 12
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
6月前
|
移动开发 JavaScript 应用服务中间件
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
891 5
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
6月前
|
移动开发 Rust JavaScript
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
1031 4
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
6月前
|
移动开发 Android开发
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
335 0
|
7月前
|
运维 iOS开发 Windows
windows电脑备案ios APP获取公钥和证书指纹Sha-1值的方法
在阿里云进行APP备案、在备案IOS端的环节的时候,发现需要我们将p12证书安装在电脑上,再用xcode或或钥匙串访问来获取这个证书的公钥和sha-1值。 但是大部分开发uniapp应用的同学们,或者进行发布的运维人员的电脑都是windows,无法按照阿里云的教程来获取ios的公钥和sha-1。备案就被卡主了。 这里介绍下另一个方法,就是使用香蕉云编来在线上传证书获取。如下图所示,打开香蕉云编后,找到下图这个功能
1117 0
|
9月前
|
存储 Linux 容器
【Container App】在容器中抓取网络包的方法
本文介绍在Azure Container App中安装tcpdump抓取网络包,并通过Storage Account上传抓包文件的方法。内容包括使用curl和nc测试外部接口连通性、长Ping端口、安装tcpdump、抓取网络包、以及通过crul命令上传文件至Azure Storage。适用于需要分析网络请求和排查网络问题的场景。
277 1
|
存储 Java 开发工具
Android开发的技术与开发流程
Android开发的技术与开发流程
690 1
|
编解码 Android开发 iOS开发
安卓与iOS开发:平台差异下的技术创新之路
在数字时代的浪潮中,移动应用开发如同两股潮流——安卓与iOS,各自携带着独特的技术生态和文化基因。本文将深入探讨这两大平台的开发环境、编程语言和工具的差异,以及它们如何塑造了不同的用户体验和技术趋势。通过比较分析,我们旨在揭示跨平台开发的可能性和挑战,同时探索未来技术创新的方向。让我们一起跟随代码的足迹,穿越安卓的开放草原和iOS的精密园林,发现那些隐藏在平台差异之下的创新机遇。
229 28
|
安全 Android开发 Swift
安卓与iOS开发:平台差异与技术选择
【8月更文挑战第26天】 在移动应用开发的广阔天地中,安卓和iOS两大平台各占一方。本文旨在探索这两个系统在开发过程中的不同之处,并分析开发者如何根据项目需求选择合适的技术栈。通过深入浅出的对比,我们将揭示各自平台的优势与挑战,帮助开发者做出更明智的决策。
321 5
|
移动开发 搜索推荐 Android开发
安卓与iOS开发:一场跨平台的技术角逐
在移动开发的广阔舞台上,两大主角——安卓和iOS,持续上演着激烈的技术角逐。本文将深入浅出地探讨这两个平台的开发环境、工具和未来趋势,旨在为开发者揭示跨平台开发的秘密,同时激发读者对技术进步的思考和对未来的期待。
下一篇
开通oss服务