JS调用Android、Ios原生控件

2024-10-21 09:55:08

在上一篇博客（详解JS与APP原生控件交互）中已经和大家聊了，关于JS与Android、Ios原生控件之间相互通信的详细代码实现，今天我们一起聊一下JS调用Android、Ios通信的相同点和不同点，以便帮助我们在进行混合式开发时，提高代码质量，实现两者在网页端代码的统一。

首先我们先看一下Ios调用JS的方法实现：

//无参调用
function SwiftCallJs1(){}
//有参调用
function SwiftCallJs2(name, message){}

紧接着我们看一下Android调用JS的方法实现：

//无参调用
function AndroidCallJs1(){}
//有参调用
function AndroidCallJs2(data){}

从上面的代码中你是否发现，Android与Ios调用JS时，JS处理函数两者在无参调用时是相通的。有参调用不同点是Ios是一对一直接传递，Android则是字符串传递，当然我们可以通过在Android和Ios端统一传参使用JSON格式，JS支持JSON解析，从而实现两个平台在有参方法调用上的统一。

看完上面的Ios与Android调用JS，下面我们看一下JS调用Android与Ios原生通信的异同点。

首先我们看一下JS调用Android的方法实现：

//无参调用
function callNull(){
 android.CallNull();
}
//有参调用
function callMessage(){
 android.CallMessage("msg");
}
//有参调用--json
function callJson(){
 var json = "[{\"name\":\"满艺网\",\"url\":\"www.manyiaby.com\"}]";
 android.CallJson(json);
}

接下来我们看一下JS调用Ios的方法实现：

//一：无前缀调用
//无参调用
function test1(){
 Test1();
}
//有参调用
function test2(){
 Test2("满艺网","www.manyiaby.com");
}
//二：有前缀调用
//无参调用--带返回操作结果处理
function callSystem(){
 Ios.CallSystem();
}
//操作结果处理函数
function JSCallNullIosResult(){}
//有参调用
function callWithMsg(){
 Ios.CallWithMsg("满艺网","www.manyiaby.com");
}
//有参调用--json
function callWithJson(){
 var json = "{\"name\":\"满艺网\",\"url\":\"www.manyiaby.com\"}";
 Ios.CallWithJson(json);
}
//有参调用--带返回结果处理
function callWithJsonResult(){
 var json = "{\"name\":\"满艺网\",\"url\":\"www.manyiaby.com\"}";
 Ios.CallWithJsonResult(json);
}
function JSCallJsonIosResult(data){
 alert("name:"+data["name"]);
}

看到这里你一定发现了不同点，1、Android没有不带前缀的方法调用，2、Android没有方法调用后的操作结果返回处理逻辑。对于第一点，就目前我所认识到的是原生没有通过具体的实现逻辑，不过这个点不影响我们的开发，因为Ios是支持前缀方法调用的。对于第二点，我的理解是对于返回处理函数，我们可以在开发的添加上去，从而提高Ios用户的使用体验，并且处理函数不会影响到方法的调用。

好了到这里就和大家聊完了，当然如果所述与您的理解有偏差，还望指点一二。

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持我们！

Android自定义View仿IOS圆盘时间选择器

通过自定义view实现仿iOS实现滑动两端的点选择时间的效果效果图自定义的view代码 public class Ring_Slide2 extends View { private static final double RADIAN = 180 / Math.PI; private int max_progress; // 设置最大进度 private int cur_progress; //设置锚点1当前进度 private int cur_progress2; //设置锚点2进度 p
React-Native Android 与 IOS App使用一份代码实现方法

React-Native Android 与 IOS 共用代码 React-Native 开发的App, 所有组件iOS & Android 共用, 共享一份代码包括一些自定义的组件, 如NavigationBar, TabBar, SegmentedControl, 使用字体图标, 具有一定的参考意义主要专注于布局, 共享组件/代码, 以及一些React自带的组件, 如: ScrollView, TouchableOpacity, View, Text, ListView, Image,
Android开发中实现IOS风格底部选择器（支持时间日期自定义）

本文Github代码链接 https://github.com/AndroidMsky/AndoirdIOSPicker 先上图吧: 这是笔者最近一个项目一直再用的一个选择器库,自己也在其中做了修改,并决定持续维护下去. 先看使用方法: 日期选择: private void showDateDialog(List<Integer> date) { DatePickerDialog.Builder builder = new DatePickerDialog.Builder(this); bui
Android仿IOS底部弹出对话框

在Android开发过程中,常常会因为感觉Android自带的Dialog的样式很丑,项目开发过程中会影响整体效果,会使得开发过程很是忧伤....(话唠时间结束!) 本文我将介绍一款开源的Dialog仿IOS底部弹窗效果IOS_Dialog_Library的使用.我将通过几个简单的示例介绍IOS_Dialog_Library.zip的使用方法. 1.IOS_Dialog_Library是开源的Dialog框架,所以首先你得下载IOS_Dialog_Library.zip包,并作为Library引
Android 实现IOS 滚轮选择控件的实例（源码下载）

Android 实现IOS 滚轮选择控件的实例最近根据项目需要,整理了一个相对比较全面的 WheelView 使用控件,借用之前看到的一句话来说,就是站在巨人肩膀上,进行了一些小调整. 这里先贴上效果图一般常用的时间选择格式,,单项选择,以及城市联动,这里基本都可以满足了. 这里把单项选择,和日期时间选择给提出到 Util 类中,代码如下: public class Util { /** * 时间选择回调 */ public interface TimerPickerCallBack
高仿IOS的Android弹出框

先看一下效果图,不过这是网上的图片. 效果不错,就借此拿来与大伙分享分享. github源码地址:https://github.com/saiwu-bigkoo/Android-AlertView. 1.怎么用:添加依赖. compile 'com.bigkoo:alertview:1.0.3' 2.实例demo(大家可以根据需要来选择自己需要的框框). package com.example.my.androidalertview; import android.app.Activity; i
Android开发仿IOS滑动开关实现代码

Android开发仿IOS滑动开关实现代码 Android与iOS相比,ios好多控件都是自带的,而android需要使用自定义来实现.今天说的是ios的滑动开关,我层看到好多博客都是通过自定义ToggleButton实现的.这里我通过自定义view来实现他的效果. 首先在onsizechange里把2个半圆和一个矩形绘制出来. width = w; height = h; left = top = 0; right = width; bottom = height * 0.8f; cx = (
iOS和Android用同一个二维码实现跳转下载链接的方法

前言最近一个项目需要iOS和安卓使用一个二维码,让扫描的机器自己识别操作系统实现跳转到相应的下载链接.比如iPhone用微信进行扫描就让他跳转appStore的下载页面,安卓机器使用微信扫描就直接跳浏览器下载.但是这二维码还有一个需求就是,用户已经下载了这个app,当用户打开app进入到注册页面时,再次扫描这个二维码时,自动填写邀请码进行注册.那么该如何实现,细节就不说了,直接上代码. 使用js实现,其实代码非常简单. 使用时直接拷贝代码,改掉相应的链接就好. PS:该链接在微信环境打开时还是
JS调用Android、Ios原生控件

在上一篇博客(详解JS与APP原生控件交互)中已经和大家聊了,关于JS与Android.Ios原生控件之间相互通信的详细代码实现,今天我们一起聊一下JS调用Android.Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时,提高代码质量,实现两者在网页端代码的统一. 首先我们先看一下Ios调用JS的方法实现: //无参调用 function SwiftCallJs1(){} //有参调用 function SwiftCallJs2(name, message){} 紧接着我们看一下And
详解JS与APP原生控件交互

"热更新"."热部署"相信对于混合式开发的童鞋一定不陌生,那么APP怎么避免每次升级都要在APP应用商店发布呢?这里就用到了混合式开发的概念,对于电商网站尤其显得重要,不可能每次发布一个活动,都要发布一个现版本,当然这样对于Android还算可以,但是对于Ios呢?苹果应用商店每次审核的时间基本都在1~2周,这对于一个促销活动来说审核时间实在太长.而混合式开发正好可以解决这个问题,基本的原理时,通过原生控件实现APP的主体结构,借助H5开发对应的页面,这样每次发布活
MAUI中实现构建跨平台原生控件

简介 MAUI中使用Handler体系来处理不同平台的原生控件实现, 即对应的, 如果我们想要创建控件, 只需要创建基于不同平台的Handler即可. 那么下面主要教大家如何通过创建Handler(事件处理程序)来构建自己的控件. 开始下面, 将通过创建一个进度条控件案例, 来演示如何在MAUI项目中创建平台控件并且使用它. 假设控件包含基础的三项功能, 进度条颜色(Foreground).进度条当前值(Value).进度条模式(Indeterminate) 1.第一步(声明控件类) 首先,
Android继承现有控件拓展实现自定义控件textView

通常情况下,Android实现自定义控件无非三种方式. Ⅰ.继承现有控件,对其控件的功能进行拓展. Ⅱ.将现有控件进行组合,实现功能更加强大控件. Ⅲ.重写View实现全新的控件本文重点讨论继承现有控件进行拓展实现自定义控件.这是一个非常重要的自定义控件的方法,可以站在原生控件这个巨人肩膀上,拓展自身的功能,一般来说,我们可以在ondraw方法中对原生控件进行绘制. 本文将以拓展textView为例,看我们是如何继承现有控件,来自定义一个强大控件.这个自定义控件就是带有边框文本框,并且边框与背
JS禁用页面上所有控件的实现方法(附demo源码下载)

本文实例讲述了JS禁用页面上所有控件的实现方法.分享给大家供大家参考,具体如下: 利用页面元素的特征,可以捕捉到所有元素. function DisableElements(container,blnHidenButton) { if (!container) return; var aEle; if (navigator.appName =="Microsoft Internet Explorer") //IE { for (var i=0;i<container.all.le
Android ListView 子控件onClick正确获取position的方法

在实际开发中,我们有时候不仅需要响应ListView的onItemClick,还需要响应其子控件的点击事件,这个时候我们就会发现,由于复用等原因,如果直接在子控件的onClick事件中调用getView()中的position,会出现数据或显示错位的问题,原因就是position的值出现了重复或不准确,解决这个问题的方法是,在adapter每次加载数据的时候,为需要点击的控件设置一个tag值,这个tag值就设置为当前这个控件对应的position,然后在点击事件中gettag(),获取这个
Android编程获取控件宽和高的方法总结分析

本文总结分析了Android编程获取控件宽和高的方法.分享给大家供大家参考,具体如下: 我们都知道在onCreate()里面获取控件的高度是0,这是为什么呢?我们来看一下示例: 首先我们自己写一个控件,这个控件非常简单: public class MyImageView extends ImageView { public MyImageView(Context context, AttributeSet attrs) { super(context, attrs); } public MyIm
Android自定义View控件实现刷新效果

三种得到LinearInflater的方法 a. LayoutInflater inflater = getLayoutInflater(); b. LayoutInflater localinflater = (LayoutInflater)context.getSystemService (Context.LAYOUT_INFLATER_SERVICE); c. LayoutInflater inflater = LayoutInflater.from(context); onDraw 方法
Android ListView里控件添加监听方法的实例详解

Android ListView里控件添加监听方法的实例详解关于ListView,算是android中比较常见的控件,在ListView我们通常需要一个模板,这个模板指的不是住模块,而是配置显示在ListView里面的东西,今天做项目的时候发现想要添加一个ImageView监听方法,发现崩了,也许是好久没有动ListView竟然忘了不能直接在主UI的xml文件里面调用其他xml文件的控件,哪怕ListView用的是这个xml文件. [错误示范]: 直接调用ImageView这个控件是ListV
Android 自定义Button控件实现按钮点击变色

效果图如下所示: 一.shape 样式:(在drawable新建-->new-->Drawable resource file 在父级标签selector添加Item ) <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item and

JS调用Android、Ios原生控件

相关推荐

随机推荐