Android webview加载H5方法详细介绍

更新时间：2022年08月23日 16:29:07 作者：夜跑者

这篇文章主要介绍了Android webview加载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实现图片缓存与异步加载
这篇文章主要为大家详细介绍了Android实现图片缓存与异步加载的相关资料,需要的朋友可以参考下
2016-02-02
Android使用Kotlin实现多节点进度条
这篇文章主要为大家详细介绍了Android使用Kotlin实现多节点进度条，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-03-03
Flutter应用集成极光推送的实现示例
这篇文章主要介绍了Flutter应用集成极光推送的实现示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-02-02
android app在后台运行弹出弹窗
这篇文章主要为大家介绍了android app在后台运行弹出弹窗,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
2023-11-11
Android实现按钮点击事件的三种方法总结
Button是程序用于和用户进行交互的一个重要控件。既然有Button，那肯定有onClick方法，下面就教大家三种实现点击事件的方法，感兴趣的可以了解一下
2022-04-04
android中view手势滑动冲突的解决方法
本篇文章主要介绍了android中view手势滑动冲突的解决方法，主要解决方法有两种，外部和内部拦截。有需要的可以参考下。
2016-11-11
Android View教程之自定义验证码输入框效果
这篇文章主要给大家介绍了关于Android View教程之自定义验证码输入框效果的相关资料，文中通过示例代码介绍的非常详细，对各位Android开发者们具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
2019-05-05
Android编程之数据库Sql编程实例分析
这篇文章主要介绍了Android编程之数据库Sql编程,实例分析了Android操作Sqlite数据库的相关技巧,非常具有实用价值,需要的朋友可以参考下
2015-04-04
Android实现微信支付功能详解
这篇文章主要为大家详细介绍了Android实现微信支付功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-12-12
Android多边形区域扫描线种子填充算法的示例
这篇文章主要介绍了Android多边形区域扫描线种子填充算法的示例,具有很好的参考价值，希望对大家有所帮助，一起跟随小编过来看看吧
2018-05-05