Android中webView的使用

最新推荐文章于 2024-03-18 18:35:32 发布

MyselfGang

最新推荐文章于 2024-03-18 18:35:32 发布

阅读量450

点赞数

分类专栏： webView的使用文章标签： android

本文链接：https://blog.csdn.net/MyselfGang/article/details/53620018

版权

webView的使用专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1、加载本地的html文件
*在main下创一个assets文件夹，将本地的html文件复制到该文件夹下，在调用本地html文件

mWebview.loadUrl("file:///android_asset/本地html文件.

*html文件内容

html<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>test</title>
<script>
var aa = function(){
window.test.toJs('js向Android打招呼');
}
</script>
<h1>中国</h1>
<button onclick="aa()">点击调用Android中的方法</button>

</head>
<body>
<article>小马哥</article>
</body>
</html>

*获取本地html文件中的所有图片（需要将图片放到你自己的服务器的tomcat\apache-tomcat-7.0.40\webapps\ROOT\img下，这样比较小号资源，可以动态的执行js脚本）

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>test</title>
        <script>

            var bb = function(){
                //所有图片地址的变量
                var imageLists = "";
                //1. 找到标签为img的元素的集合
                var imgs = window.document.getElementById("img");
                //2. 遍历数组,为img元素添加点击事件
                for(var i = 0 ; i < imgs.length ; i++){
                    var img = imgs[i];
                    imageLists = imageLists + img.src + ";";
                    img.onclick = function(){
                        //传递当前的src给java
                        //bindJs:这个是java代码中定义的name
                        //openImg:是桥梁类定义的方法
                        window.test.sendCurImgUrl(this.src);
                        //打印点击img对象的src属性
                        //  alert(this.src);

                    }
                }
                //传输所有的src给java,其中"bindJs"是在java中定义的
                window.test.sendAllImgUrl(imageLists);

            }
        </script>
        <h1>中国</h1>

        <img src="http://127.0.0.1:8080/img/46728356PCLM.jpg" />
        <img src="http://127.0.0.1:8080/img/46728356I1TZ.jpg" />
        <img src="http://127.0.0.1:8080/img/46728356JBUO.jpg" />
        <img src="http://127.0.0.1:8080/img/1452327318UU92.jpg" />
        <img src="http://127.0.0.1:8080/img/1651807854W6KO.jpg" />
        <img src="http://127.0.0.1:8080/img/2075270486S6OP.jpg" />
        <img src="http://127.0.0.1:8080/img/asf-logo-wide.gif" />

    </head>
    <body onload="bb()">
    </body>
</html>

*动态的执行js脚本

/**
     * @desc 让WebView执行脚本
     * @desc WebView加载完成的时候调用
     * @param view
     * @param jsScript
     */
    private void executeJsScript(WebView view, String jsScript) {
        view.loadUrl("javascript:" + jsScript);
    }

    String  jsScript    = "(function() {" + //
            "   var imageList = \"\";   " + //
            "   var imgs = document.getElementsByTagName(\"img\"); " + //
            "   for (var i = 0; i < imgs.length; i++) { " + //
            "       var img = imgs[i];" + //
            "       imageList = imageList + img.src + \";\"; " + //
            "       img.onclick = function() {" + //
            "           window.hm21.passCurImgUrl(this.src);" + //
            "       }" + //
            "   }" + //
            "   window.hm21.passAllImgUrl(imageList);" + //
            "})()";//后面的括号表示执行

2、网络的html文件(如果页面显示不出来，是因为没有打开js的能力，网页中可能有很多JavaScript数据),如果自身client打开需要设置WebViewClient

mWebview.loadUrl("http://www.javaapk.com/");

3、双击页面可以放大和缩小

WebSettings settings = mWebview.getSettings();
settings.setUseWideViewPort(true);

4、显示内建的放大缩小按钮

settings.setBuiltInZoomControls(true);

5、监听加载进度

mWebview.setWebChromeClient(new WebChromeClient() {
      @Override
     public void onProgressChanged(WebView view, int newProgress) {
                mPb.setVisibility(View.VISIBLE);
                mPb.setProgress(newProgress);
                super.onProgressChanged(view, newProgress);
            }
        });

6、监听加载完成,开始===>设置WebViewClient就不会跳到我们的内置浏览器

     mWebview.setWebViewClient(new WebViewClient() {
            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                mPb.setVisibility(View.VISIBLE);
                super.onPageStarted(view, url, favicon);
            }

            @Override
            public void onPageFinished(WebView view, String url) {
                mPb.setVisibility(View.GONE);
                executeJsScript(view , jsScript);
                super.onPageFinished(view, url);
            }
        });

7、拿到webview正在请求的地址

String url = mWebview.getUrl();

9、允许js

settings.setJavaScriptEnabled(true);

10、动态在webview中执行js

    /*String jsScript = "alter('hahaha')";
        mWebview.loadUrl("javascript:" + jsScript);*/

11、在js中调用java本地代码

  /**
      * 参数一：普通类（桥梁类）-->类里面定义一些供给js调用的方法
      * 参数二：别名--> 供给js区别调用的
      */
 mWebview.addJavascriptInterface(new MyObject() , "test");

public class MyObject {
    /**
     * 如果你的targetSdkVersion大于或等于17需要加@JavascriptInterface
     */
    @JavascriptInterface
    public void toJs(String content){
        System.out.println("content"+content);
    }
/**
     * 获取网页中点击的图片的url
     */
    @JavascriptInterface
    public void sendCurImgUrl(String curImgUrl){
        mCurImgUrl = curImgUrl;
    }

    /**
     * 获取网页中所有的图片的url集合
     * @param AllImgUrl
     */
    @JavascriptInterface
    public void sendAllImgUrl(String AllImgUrl){
        mAllImgUrl = AllImgUrl;
    }

}

12、设置webview的字体大小

settings.setTextSize(WebSettings.TextSize.LARGER);

8、webview的回退操作

浏览网页,点击系统“Back”键,整个 Browser 会调用 finish()而结束自身,如果希望浏览的网页回退而不是推出浏览器,需要在当前Activity中处理并消费掉该 Back 事件

 @Override
    public void onBackPressed() {

        if (mWebview.canGoBack()) {
            mWebview.goBack();
            return;
        }
        super.onBackPressed();
    }