Android webview加载H5方法详细介绍

 更新时间:2022年08月23日 16:29:07   作者:夜跑者  
这篇文章主要介绍了Android webview加载H5的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

这篇文章主要阐述3个知识点

  • 安卓APP 怎么用webview加载H5
  • H5怎么调用安卓定义的方法
  • 安卓怎么调用H5定义的方法

1,安卓APP 怎么用webview加载H5

安卓端定义个webview xml 页面,代码如下所示:

<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/web_view_id"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
</WebView>

之后再对webview 实例进行设置,用loadUrl 方法加载H5 路径即可。代码如下:

        webView = (WebView) view.findViewById(R.id.web_view_id);
        WebSettings settings = webView.getSettings();
        settings.setJavaScriptEnabled(true);
        WebChromeClient webChromeClient = new WebChromeClient();
        webView.setWebChromeClient(webChromeClient);
        settings.setUseWideViewPort(true);
        settings.setLoadWithOverviewMode(true);
        settings.setBuiltInZoomControls(true);
        settings.setSupportZoom(true);
        settings.setDefaultTextEncodingName("UTF-8");
        settings.setJavaScriptCanOpenWindowsAutomatically(true);
        //String _url = "http://xxx.xxx.xxx/link/index.html#/home/index"; //服务器地址
        String _url = "file:android_asset/dist/index.html#/home/index"; //本地地址
        webView.loadUrl(_url);

不出意外的话会看到加载的H5页面了。

2,H5怎么调用安卓定义的方法

首先定义一个类,写上供H5调用的方法,注意这个方法要用@JavascriptInterface修饰,代码如下所示:

public class Mine {
    private Context context;
    public Mine(Context _context){
        this.context = _context;
    }
    @JavascriptInterface
    public  void loginOut(){
        ((MainActivity) context).loginOut();
    }
}

然后注册这个类,如下所示:

webView.addJavascriptInterface(new Mine(this.getActivity()), "mineInterface");

这样安卓端就写好了。接下来就是H5端调用了。

window.mineInterface.loginOut();

H5端直接这么调用就可以了。

如果js想传递json对象参数给安卓端怎么办,不要直接写json对象,要转换为json字符串,代码如下:

          window.mineInterface.loginOutTest(JSON.stringify({
            title: "iot",
            name: "iot"
          }));

安卓端接收如下:

    @JavascriptInterface
    public  void loginOutTest(String params){
        Log.d(AppYunlanLink.TAG, "test: " + params);
    }

3,安卓怎么调用H5定义的方法

H5 我是用的vue 框架,方法写在了页面内,如下所示:

  created() {    
    window.setUserInfo = this.setUserInfo; //android app 会调用此方法
  },
  methods: {
    setUserInfo(userInfo) {
      const _userInfo = JSON.parse(userInfo);      
      this.userName = _userInfo.username;      
      this.avatar = _userInfo.avatar;
    }
  },

注意方法一定要挂载到window对象上。安卓端怎么调用呢?

    //调用html5 页面中的方法,带JSONObject类型参数
    public void loadWebViewFuncWithJSON(String funcName, JSONObject value) {
        webView.post(new Runnable() {
            @Override
            public void run() {
                String _url = "javascript:" + funcName + "('" + value + "')";
                Log.d(AppYunlanLink.TAG, "value is: " + value);
                webView.loadUrl(_url);
            }
        });
    }
    fg4.loadWebViewFuncWithJSON("setUserInfo", info);

这是带有参数的调用,安卓端是JSONObject类型的,H5端接收的是json字符串。不带参数的调用更简单了,如下:

    //调用html5 页面中的方法
    public void loadWebViewFunc(String funcName) {
        String _url = "javascript:" + funcName + "()";
        webView.loadUrl(_url);
    }

到此这篇关于Android webview加载H5方法详细介绍的文章就介绍到这了,更多相关Android加载H5内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Android Activity的生命周期与启动模式全面解读

    Android Activity的生命周期与启动模式全面解读

    虽然说我们天天都在使用Activity,但是你真的对Activity的生命机制完全了解了吗?Activity的生命周期方法只有七个,但是其实那只是默认的情况。也就是说在其他情况下,Activity的生命周期可能不会是按照我们以前所知道的流程,这就要说到Activity的启动模式
    2021-10-10
  • Android Studio 2020新版本卡在Gradle downloading/sync failed/下载缓慢/下载超时的问题

    Android Studio 2020新版本卡在Gradle downloading/sync failed/下载缓慢/

    Android Studio 2020新版本 卡在Gradle downloading / sync failed / 下载缓慢 / 下载超时 亲测有效解决办法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2020-12-12
  • 谈谈Android的三种网络通信方式

    谈谈Android的三种网络通信方式

    Android平台有三种网络接口可以使用,他们分别是:java.net.*(标准Java接口)、Org.apache接口和Android.net.*(Android网络接口)。本文详细的介绍,有兴趣的可以了解一下。
    2017-01-01
  • Android  Intent传递数据底层分析详细介绍

    Android Intent传递数据底层分析详细介绍

    这篇文章主要介绍了Android Intent传递数据底层分析详细介绍的相关资料,需要的朋友可以参考下
    2017-02-02
  • Android自定义View播放Gif动画的示例

    Android自定义View播放Gif动画的示例

    本篇文章主要介绍了Android自定义View播放Gif动画的示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-10-10
  • Android 改变图标原有颜色和搜索框的实例代码

    Android 改变图标原有颜色和搜索框的实例代码

    让Android也能有iOS那么方便的图片色调转换,就像同一个图标,但是有多个地方使用,并且颜色不一样,就可以用这个方法了。 本文实现TextView图片和文字居中,键盘搜索功能,具体实现代码大家跟随脚本之家小编看看吧
    2017-09-09
  • Android仿QQ在状态栏显示登录状态效果

    Android仿QQ在状态栏显示登录状态效果

    这篇文章主要介绍了Android仿QQ在状态栏显示登录状态效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-12-12
  • Android Fragment滑动组件ViewPager的实例详解

    Android Fragment滑动组件ViewPager的实例详解

    这篇文章主要介绍了Android Fragment滑动组件ViewPager的实例详解的相关资料,需要的朋友可以参考下
    2017-05-05
  • Android源码中final关键字的用法及final,finally,finalize的区别

    Android源码中final关键字的用法及final,finally,finalize的区别

    Android的源码中很多地方对final关键字的用法很是“别出心裁”,之所以这么说是因为我从没看过是这么使用final关键字的,通过本文给大家分享Android源码中final关键字的用法及final,finally,finalize的区别,感兴趣的朋友一起学习吧
    2015-12-12
  • Android 使用PopupWindow实现弹出更多的菜单实例详解

    Android 使用PopupWindow实现弹出更多的菜单实例详解

    最近想要做一个弹出更多的菜单,而原生的弹出菜单却不是我们想要的效果,所以必然要自定义菜单。接下来通过本文给大家介绍android 使用popupwindow实现弹出更多的菜单实例详解,需要的朋友可以参考下
    2017-04-04

最新评论