webview的使用和注意事项

本文详细介绍了WebView的使用,包括加载页面、生命周期管理、常用方法以及常见问题。重点讲解了WebViewClient和WebChromeClient的作用,以及如何处理混合内容、内存泄漏、JavaScript交互等问题。同时,文章还提到了WebView的生命周期管理,强调了正确处理音乐播放和标题设置的重要性,以及在不同Android版本中遇到的问题和解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

webview的使用和注意事项

1 webview 使用

https://www.jianshu.com/p/3e0136c9e748

1.加载页面

加载页面一般有以下几种形式:

    //方式一:加载一个网页
    webView.loadUrl("http://www.baidu.com");

    //方式二:加载应用资源文件内的网页
    webView.loadUrl("file:///android_asset/test.html");

    //方式三:加载一段代码
    webView.loadData(String data,String mimeType, String encoding);

其中,方式一和方式二比较好理解,方式三可能有些朋友不明白,我在这里解释一下。

WebView.loadData()和WebView.loadDataWithBaseURL()是表示加载某一段代码,其中, WebView.loadDataWithBaseURL()兼容性更好,适用场景更多,因此,我着重介绍一下这个方法。

WebView.loadDataWithBaseURL(String baseUrl, String data, String mimeType, String encoding, String historyUrl))

的五个参数:
baseUrl表示基础的网页,
data表示要加载的内容,
mimeType表示加载网页的类型,
encoding表示编码格式,
historyUrl表示可用历史记录,可以为null值。
举个例子:

String body = “示例:这里有个img标签,地址是相对路径”;
webView.loadDataWithBaseURL(“http://www.jcodecraeer.com”, body, “text/html”, “utf-8”,null);
加载后的网页:
在这里插入图片描述

loadDataWithBaseURL
加载有Header的网页:

		HashMap<String,String> header = new HashMap<>();
		...
		webView.loadUrl(url,header);

注意:
如果你们直接用上面介绍的这三种方式来加载网页,很有可能会弹出系统浏览器进行网页访问,这样使用体验就会很差!
解决办法是在loadUrl() 之前加上这样一句代码:

webView.setWebViewClient(new WebViewClient());

这样就可以了,有的朋友可能会这样做,重写WebViewClient的shouldOverrideUrlLoading()方法:

webView.setWebViewClient(new WebViewClient(){
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        webView.loadUrl(url);
        return true;
    }
});

这个也是可以的,但是会有一些问题,这个会在后面介绍。

2.WebView的生命周期

WebView的生命周期一般跟随Activity:

@Override
protected void onResume() {
    super.onResume();
    //恢复webview的状态(不靠谱)
    webView.resumeTimers();
    //激活webView的状态,能正常加载网页
    webView.onResume();
}

@Override
protected void onPause() {
    super.onPause();
    //当页面被失去焦点被切换到后台不可见状态,需要执行onPause
    //通过onPause动作通知内核暂停所有的动作,比如DOM的解析、plugin的执行、JavaScript执行。
    webView.onPause();

    //当应用程序(存在webview)被切换到后台时,这个方法不仅仅针对当前的webview而是全局的全应用程序的webview
    //它会暂停所有webview的layout,parsing,javascripttimer。降低CPU功耗。(不靠谱)
    webView.pauseTimers();
}

//在关闭了Activity时,如果Webview的音乐或视频,还在播放。就必须销毁Webview
//但是注意:webview调用destory时,webview仍绑定在Activity上
//这是由于自定义webview构建时传入了该Activity的context对象
//因此需要先从父容器中移除webview,然后再销毁webview:
ViewGroup parent = findViewById(R.id.container);
parent.removeView(webView);
webView.destroy();

3、WebView的一些常用方法

浏览器是否可以前进/后退

  //WebView是否可以后退
  boolean canGoBack = webView.canGoBack();
  //WebView后退
  webView.goBack();
  //WebView是否可以前进
  boolean canGoForward = webView.canGoForward();
  //WebView前进
  webView.goForward();
  //以当前的index为起始点前进或者后退到历史记录中指定的steps
  //如果steps为负数则为后退,正数则为前进
  boolean canGoBackOrForward = webView.canGoBackOrForward(step);

注意,点击系统返回键时,是结束当前的Activity,而非调用WebView的goBack()方法。

重新加载网页和停止加载

webView.reload(); //刷新页面(当前页面的所有资源都会重新加载)
webView.stopLoading(); //停止加载
清除浏览器缓存

//清除网页访问留下的缓存
//由于内核缓存是全局的因此这个方法不仅仅针对webview而是针对整个应用程序.
Webview.clearCache(true);

//清除当前webview访问的历史记录
//只会webview访问历史记录里的所有记录除了当前访问记录
Webview.clearHistory();

//这个api仅仅清除自动完成填充的表单数据,并不会清除WebView存储到本地的数据
Webview.clearFormData();
获取WebView高度、内容HTML高度和滚动距离

//获取当前可见区域的顶端距整个页面顶端的距离,也就是当前内容滚动的距离。
webView.getScrollY();
//获取WebView控件的高度。
webView.getHeight();webView.getBottom();
//获取HTML的高度(原始高度,不包括缩放后的高度)

webView.getContentHeight();
WebView下载文件

  /**
  * 当下载文件时打开系统自带的浏览器进行下载,当然也可以对捕获到的 url 进行处理在应用内下载。
  **/
  webView.setDownloadListener(new DownloadListener() {
      @Override
      public void onDownloadStart(String url, String userAgent, String contentDisposition, String mimetype, long contentLength) {
           Uri uri = Uri.parse(url);
           Intent intent = new Intent(Intent.ACTION_VIEW, uri);
           startActivity(intent);
      } 
  });

4、WebView的常用工具类

4.1 WebSettings:对WebView进行配置和管理。

WebSettings webSettings = webView.getSettings();
//如果访问的页面中要与Javascript交互,则webview必须设置支持Javascript
webSettings.setJavaScriptEnabled(true);

//设置自适应屏幕,两者合用
webSettings.setUseWideViewPort(true); //将图片调整到适合webview的大小
webSettings.setLoadWithOverviewMode(true); // 缩放至屏幕的大小

webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN); //支持内容重新布局

//缩放操作
webSettings.setSupportZoom(true); //支持缩放,默认为true。是下面那个的前提。
webSettings.setBuiltInZoomControls(true); //设置内置的缩放控件。若为false,则该WebView不可缩放
webSettings.setDisplayZoomControls(false); //隐藏原生的缩放控件
webSettings.setTextZoom(2);//设置文本的缩放倍数,默认为 100

webSettings.setRenderPriority(WebSettings.RenderPriority.HIGH);  //提高渲染的优先级

webSettings.setStandardFontFamily("");//设置 WebView 的字体,默认字体为 "sans-serif"
webSettings.setDefaultFontSize(20);//设置 WebView 字体的大小,默认大小为 16
webSettings.setMinimumFontSize(12);//设置 WebView 支持的最小字体大小,默认为 8

// 5.1以上默认禁止了https和http混用,以下方式是开启
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    webSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}

//其他操作
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); //关闭webview中缓存
webSettings.setAllowFileAccess(true); //设置可以访问文件
webSettings.setJavaScriptCanOpenWindowsAutomatically(true); //支持通过JS打开新窗口
webSettings.setLoadsImagesAutomatically(true); //支持自动加载图片
webSettings.setDefaultTextEncodingName("utf-8");//设置编码格式
webSettings.setGeolocationEnabled(true);//允许网页执行定位操作
webSettings.setUserAgentString("Mozilla/5.0 (Windows NT 10.0; WOW64; rv:50.0) Gecko/20100101 Firefox/50.0");//设置User-Agent


//不允许访问本地文件(不影响assets和resources资源的加载)
webSettings.setAllowFileAccess(false);
webSettings.setAllowFileAccessFromFileURLs(false);
webSettings.setAllowUniversalAccessFromFileURLs(false);

其中,WebView设置缓存,当加载 html 页面时,WebView会在/data/data/package/下生成 database 与 cache 两个文件夹
请求的URL记录保存在WebViewCache.db,而URL的内容是保存在WebViewCache文件夹下:

//缓存模式如下:
//LOAD_CACHE_ONLY: 不使用网络,只读取本地缓存数据
//LOAD_DEFAULT: (默认)根据cache-control决定是否从网络上取数据。
//LOAD_NO_CACHE: 不使用缓存,只从网络获取数据.
//LOAD_CACHE_ELSE_NETWORK,只要本地有,无论是否过期,或者no-cache,都使用缓存中的数据。

//优先使用缓存:
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
//不使用缓存:
webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE)

还有如下几种:

 //开启 DOM storage API 功能 较大存储空间,使用简单
 settings.setDomStorageEnabled(true);
 //设置数据库缓存路径 存储管理复杂数据 方便对数据进行增加、删除、修改、查询 不推荐使用
 settings.setDatabaseEnabled(true);
 final String dbPath = context.getApplicationContext().getDir("db", Context.MODE_PRIVATE).getPath();
 settings.setDatabasePath(dbPath);
 //开启 Application Caches 功能 方便构建离线APP 不推荐使用
 settings.setAppCacheEnabled(true);
 final String cachePath = context.getApplicationContext().getDir("cache", Context.MODE_PRIVATE).getPath();
 settings.setAppCachePath(cachePath);
 settings.setAppCacheMaxSize(5 * 1024 * 1024);
WebView缓存

在这里插入图片描述

4.2 WebViewClient:处理各种通知和请求事件。

WebViewClient类常用方法:

shouldOverrideUrlLoading():拦截URL请求,重定向(有2个方法,一个是兼容5.0以下,一个是兼容5.0以上,保险起见两个都重写)。
无论返回true还是false,只要为WebView设置了WebViewClient,系统就不会再将url交给第三方的浏览器去处理了。q其中返回false,代表将url交给当前WebView加载,也就是正常的加载状态;shouldOverrideUrlLoading()返回true,代表开发者已经对url进行了处理,WebView就不会再对这个url进行加载了。
另外,使用post的方式加载页面,此方法不会被调用。

  webView.setWebViewClient(new WebViewClient(){

      //重定向URL请求,返回true表示拦截此url,返回false表示不拦截此url。
      @Override
      public boolean shouldOverrideUrlLoading(WebView view, String url) {
          //作用1:重定向url
          if(url.startsWith("weixin://")){
              url = url.replace("weixin://","http://");
              webView.loadUrl(url);
          }

          //作用2:在本页面的WebView打开,防止外部浏览器打开此链接
          view.loadUrl(url);
          return true;
      }
  });

onPageStarted()onPageFinished():页面加载时和页面加载完毕时调用。

shouldOverrideKeyEvent():重写此方法才能处理浏览器中的按键事件。

shouldInterceptRequest():页面每一次请求资源之前都会调用这个方法(非UI线程调用)。

onLoadResource():页面加载资源时调用,每加载一个资源(比如图片)就调用一次。

onReceivedError():加载页面的服务器出现错误(比如404)时回调。

onReceivedSslError():重写此方法可以让webview处理https请求。

doUpdateVisitedHistory():更新历史记录。

onFormResubmission():应用程序重新请求网页数据。

onReceivedHttpAuthRequest():获取返回信息授权请求。

onScaleChanged():WebView发生缩放改变时调用。

onUnhandledKeyEvent():Key事件未被加载时调用。

补充,关键方法调用流程:
情况一:loadUrl()无重定向时

onPageStarted->onPageFinished

情况二:loadUrl()网页A重定向到B时

onPageStarted->shouldOverrideUrlLoading->onPageStarted->onPageFinished->onPageFinished

情况三:在已加载的页面中点击链接,加载页面A(无重定向)

shouldOverrideUrlLoading->onPageStarted->onPageFinished

情况四:在已加载的页面中点击链接,加载页面A(页面A重定向至页面B)

shouldOverrideUrlLoading->onPageStarted->shouldOverrideUrlLoading->onPageStarted->onPageFinished->onPageFinished

情况五:执行goBack/goForward/reload方法

onPageStarted->onPageFinished

情况六:发生资源加载

shouldInterceptRequest->onLoadResource

4.3 WebChromeClient:辅助 WebView 处理 Javascript 的对话框,网站图标,网站标题等等。

WebChromeClient类常用方法:

onProgressChanged():获得网页的加载进度并显示。

onReceivedTitle():获得网页的标题时回调。

onReceivedIcon():获得网页的图标时回调。

onCreateWindow():打开新窗口时回调。

onCloseWindow():关闭窗口时回调。

onJsAlert():网页弹出提示框时触发此方法。

  @Override
  public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
      Toast.makeText(MainActivity.this,"Im alert",Toast.LENGTH_SHORT).show();

  //部分机型只会弹出一次提示框,调用此方法即可解决此问题。
  result.cancel();
  //返回true表示不弹出系统的提示框,返回false表示弹出
  return true;

}
onJsConfirm():网页弹出确认框时触发此方法。

  @Override
  public boolean onJsConfirm(WebView view, String url, String message, JsResult result) {

  //confirm表示确认,cancel表示取消。
  result.confirm();
  //返回true表示不弹出系统的提示框,返回false表示弹出
  return true;

}
onJsPrompt():网页弹出输入框时触发此方法。

  @Override
  public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {
      //confirm表示确认(并返回值),cancel表示取消。
      result.confirm("8848");
      //返回true表示不弹出系统的提示框,返回false表示弹出
      return true;
  }

4.4 Cookie 相关
WebView可以在需要的时候自动同步cookie,只需要获得CookieManager的对象将cookie设置进去就可以了。

从服务器的返回头中取出 cookie 根据Http请求的客户端不同,获取 cookie 的方式也不同,请自行获取。

4.4.1 设置cookie,若两次设置相同,则覆盖上一次的

/**
 * 将cookie设置到 WebView
 * @param url 要加载的 url
 * @param cookie 要同步的 cookie
 */
public static void syncCookie(String url,String cookie) {
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
        CookieSyncManager.createInstance(context);
    }
    CookieManager cookieManager = CookieManager.getInstance();
    cookieManager.setCookie(url, cookie);//如果没有特殊需求,这里只需要将session id以"key=value"形式作为cookie即可
}

注意:

同步 cookie 要在 WebView 加载 url 之前,否则 WebView 无法获得相应的 cookie,也就无法通过验证。
cookie应该被及时更新,否则很可能导致WebView拿的是旧的session id和服务器进行通信。
cookie应该被及时更新,否则很可能导致WebView拿的是旧的session id和服务器进行通信。
CookieManager会将这个Cookie存入该应用程序data/data/package_name/app_WebView/Cookies.db

4.4.2 获取cookie

/**
 * 获取指定 url 的cookie
 */
public static String syncCookie(String url) {
    CookieManager cookieManager = CookieManager.getInstance();
    return cookieManager.getCookie(url);
}

4.4.3 清除cookie

// 这个两个在 API level 21 被抛弃
CookieManager.getInstance().removeSessionCookie();
CookieManager.getInstance().removeAllCookie();

// 推荐使用这两个, level 21 新加的
CookieManager.getInstance().removeSessionCookies();// 移除所有过期 cookie
CookieManager.getInstance().removeAllCookies(); // 移除所有的 cookie

//设置清除cookie后的回调方法
private void removeCookie(Context context) {
    CookieManager.getInstance().removeAllCookies(new ValueCallback<Boolean>() {
        @Override
        public void onReceiveValue(Boolean value) {
            // 清除结果
        }
    });
}

5、其他使用场景介绍

5.1 长按保存图片或者拨打电话

一般浏览器都有长按保存图片或者拨打图片的功能,实现这个功能和WebView.HitTestResult这个类有关,这个类会将你触摸网页的地方的类型和其他信息反馈给你。
WebView.HitTestResult的常用方法:

HitTestResult.getType():获取所选中目标的类型,可以是图片,超链接,邮件,电话等等。
HitTestResult.getExtra():获取额外的信息。
类型和意义:

WebView.HitTestResult.UNKNOWN_TYPE //未知类型

WebView.HitTestResult.PHONE_TYPE //电话类型

WebView.HitTestResult.EMAIL_TYPE //电子邮件类型

WebView.HitTestResult.GEO_TYPE //地图类型

WebView.HitTestResult.SRC_ANCHOR_TYPE //超链接类型

WebView.HitTestResult.SRC_IMAGE_ANCHOR_TYPE //带有链接的图片类型

WebView.HitTestResult.IMAGE_TYPE //单纯的图片类型

WebView.HitTestResult.EDIT_TEXT_TYPE //选中的文字类型
步骤:
1、给WebView设置长按监听事件;
2、获取WebView长按时的WebView.HitTestResult的事件类型,如果是图片,则做处理。

代码:

webView.setOnLongClickListener(new View.OnLongClickListener() {
    @Override
    public boolean onLongClick(View view) {
        WebView.HitTestResult result = ((WebView) view).getHitTestResult();
        if(result != null){
            switch (result.getType()){
                case WebView.HitTestResult.SRC_IMAGE_ANCHOR_TYPE:
                    String imgUrl = result.getExtra();
                    ...
                    return true;
                ...
            }
        }
        return false;
    }
});

5.2 WebView中常见问题

5.2.1Android5.0 WebView中Http和Https混合问题

1.1 在Android 5.0上 Webview 默认不允许加载 Http 与 Https 混合内容,解决办法:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
     webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}

参数说明:

MIXED_CONTENT_ALWAYS_ALLOW:允许从任何来源加载内容,即使起源是不安全的;
MIXED_CONTENT_NEVER_ALLOW:不允许Https加载Http的内容,即不允许从安全的起源去加载一个不安全的资源;
MIXED_CONTENT_COMPATIBILITY_MODE:当涉及到混合式内容时,WebView 会尝试去兼容最新Web浏览器的风格。
1.2 设置WebView接受所有网站的证书

webView.setWebViewClient(new WebViewClient() {
            @Override
            public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
                // handler.cancel();// Android默认的处理方式
                handler.proceed();// 接受所有网站的证书
                // handleMessage(Message msg);// 进行其他处理
            }
});

注意:一定要移除super.onReceivedSslError(view, handler, error)方法,否则不生效。

5.2.2 避免WebView引起的内存泄漏

2.1 WebView所在的Activity新启一个进程

<activity
    android:name=".ui.activity.Html5Activity"
    android:process=":lyl.boon.process.web">
    <intent-filter>
        <action android:name="com.lyl.boon.ui.activity.htmlactivity"/>
        <category android:name="android.intent.category.DEFAULT"/>
    </intent-filter>
</activity>

结束的时候直接System.exit(0)退出当前进程。

2.2 动态创建WebView
在代码中创建WebView,而不是在XML中创建:

LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
        mWebView = new WebView(getApplicationContext());
        mWebView.setLayoutParams(params);
        mLayout.addView(mWebView);

2.3 Activity销毁的时候先移除WebView

@Override
protected void onDestroy() {
    if (mWebView != null) {
        ((ViewGroup) mWebView.getParent()).removeView(mWebView);
        mWebView.destroy();
        mWebView = null;
    }
    super.onDestroy();
}
5.2.3 混淆导致JavaScript不可用
在proguard-rules.pro文件中配置:

-keepattributes *Annotation*  
-keepattributes *JavascriptInterface*
-keep public class org.mq.study.webview.DemoJavaScriptInterface{
    public <methods>;
}
如果是内部类:

-keepattributes *Annotation*  
-keepattributes *JavascriptInterface*
-keep public class org.mq.study.webview.webview.DemoJavaScriptInterface$InnerClass{
    public <methods>;
}
5.2.4 监听WebView网页加载完毕

WebViewClient的onPageFinished()方法不能保证一定是在网页加载完毕后调用,也有可能是一些其他情况下也会调用,因此,最好用WebChromeClient的onProgressChanged()方法来监听:

webView.setWebChromeClient(new WebChromeClient() {

@Override
public void onProgressChanged(WebView view, int position) {
    progressBar.setProgress(position);
    if (position == 100) {
        progressBar.setVisibility(View.GONE);
    }
    super.onProgressChanged(view, position);
}

});

5.2.5 HTML5 video 在 WebView 全屏显示

当网页全屏播放视频时会调用WebChromeClient.onShowCustomView()方法,所以可以通过将 video 播放的视图全屏达到目的。

@Override
public void onShowCustomView(View view, CustomViewCallback callback) {
    if (view instanceof FrameLayout && fullScreenView != null) {
        // A video wants to be shown
        this.videoViewContainer = (FrameLayout) view;
        this.videoViewCallback = callback;
        fullScreenView.addView(videoViewContainer, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
        fullScreenView.setVisibility(View.VISIBLE);
        isVideoFullscreen = true;
    }
}

@Override
public void onHideCustomView() {
    if (isVideoFullscreen && fullScreenView != null) {
        // Hide the video view, remove it, and show the non-video view
        fullScreenView.setVisibility(View.INVISIBLE);
        fullScreenView.removeView(videoViewContainer);

    // Call back (only in API level <19, because in API level 19+ with chromium webview it crashes)
    if (videoViewCallback != null && !videoViewCallback.getClass().getName().contains(".chromium.")) {
        videoViewCallback.onCustomViewHidden();
    }

    isVideoFullscreen = false;
    videoViewContainer = null;
    videoViewCallback = null;
}

}
注意:很多的手机版本在网页视频播放时是不会调用这个方法的,所以这个方法局限性很大。

5.2.6 loadData()加载中文数据出现乱码
使用loadDataWithBaseURL()方法代替loadData()加载数据,不会出现乱码问题。 为loadData()的mimeType参数传入“text/html;charset=UTF-8”,也可以解决乱码问题。
5.2.7 外部JavaScript攻击
由于应用中的WebView没有对file:///类型的url做限制,可能导致外部攻击者利用Javascript代码读取本地隐私数据。

7.1 如果WebView不需要使用file协议,直接禁用所有与file协议相关的功能即可(不影响对assets和resources资源的加载)。

webSettings.setAllowFileAccess(false);
webSettings.setAllowFileAccessFromFileURLs(false);
webSettings.setAllowUniversalAccessFromFileURLs(false);

7.2 如果WebView需要使用file协议,则应该禁用file协议的Javascript功能。具体方法为:在调用loadUrl方法前,以及在shouldOverrideUrlLoading方法中判断url的scheme是否为file。如果是file协议,就禁用Javascript,否则启用Javascript。

//调用loadUrl前
if("file".equals(Uri.parse(url).getScheme())){//判断是否为file协议
    webView.getSettings().setJavaScriptEnabled(false);
}else{
    webView.getSettings().setJavaScriptEnabled(true);
}
webView.loadUrl(url);

//WebViewClient中做的操作
@Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
    if("file".equals(request.getUrl().getScheme())){//判断是否为file协议
        view.getSettings().setJavaScriptEnabled(false);
    }else{
        view.getSettings().setJavaScriptEnabled(true);
    }
    return false;
}
5.2.8 WebView闪烁
WebView关闭硬件加速功能即可。

webView.setLayerType(View.LAYER_TYPE_SOFTWARE,null);
5.2.9 缩放引起的应用崩溃
setDisplayZoomControls(true)方法会允许显示系统缩放按钮,这个缩放按钮会在每次出现后的几秒内逐渐消失。但是在部分系统版本中,如果在缩放按钮消失前退出了Activity,就可能引起应用崩溃。

解决办法:调用setDisplayZoomControls(false)方法不显示系统缩放按钮,反正使用手势捏合动作就可以实现网页的缩放功能了。如果确实需要使用缩放按钮,就需要在Activity的onDestroy()方法中隐藏WebView。
5.2.10 webView控件padding不起作用

在一个布局文件中有一个WebView,想使用padding属性让左右向内留出一些空白,但是padding属性不起左右,内容照样贴边显示,反而移动了右边滚动条的位置。android的bug,用一个外围的layout包含webview,可以有所改进,但不能完全解决。其实正确的做法是在webView的加载的css中增加padding,没必要为了padding而更改xml布局文件。

一个很不错的WebViewActivity分享(来源于网络)

import android.graphics.Bitmap;
import android.os.Bundle;
import android.os.Message;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.KeyEvent;
import android.webkit.GeolocationPermissions;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

import com.lyl.test.R;

public class Html5Activity extends AppCompatActivity {

    private String mUrl;

    private LinearLayout mLayout;
    private WebView mWebView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_web);

        Bundle bundle = getIntent().getBundleExtra("bundle");
        mUrl = bundle.getString("url");

        Log.d("Url:", mUrl);

        mLayout = (LinearLayout) findViewById(R.id.web_layout);


        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
        mWebView = new WebView(getApplicationContext());
        mWebView.setLayoutParams(params);
        mLayout.addView(mWebView);

        WebSettings mWebSettings = mWebView.getSettings();
        mWebSettings.setSupportZoom(true);
        mWebSettings.setLoadWithOverviewMode(true);
        mWebSettings.setUseWideViewPort(true);
        mWebSettings.setDefaultTextEncodingName("utf-8");
        mWebSettings.setLoadsImagesAutomatically(true);

        //调用JS方法.安卓版本大于17,加上注解 @JavascriptInterface
        mWebSettings.setJavaScriptEnabled(true);

        saveData(mWebSettings);

        newWin(mWebSettings);

        mWebView.setWebChromeClient(webChromeClient);
        mWebView.setWebViewClient(webViewClient);
        mWebView.loadUrl(mUrl);
    }

    @Override
    public void onPause() {
        super.onPause();
        webView.onPause();
        webView.pauseTimers(); //小心这个!!!暂停整个 WebView 所有布局、解析、JS。
    }

    @Override
    public void onResume() {
        super.onResume();
        webView.onResume();
        webView.resumeTimers();
    }

    /**
     * 多窗口的问题
     */
    private void newWin(WebSettings mWebSettings) {
        //html中的_bank标签就是新建窗口打开,有时会打不开,需要加以下
        //然后 复写 WebChromeClient的onCreateWindow方法
        mWebSettings.setSupportMultipleWindows(false);
        mWebSettings.setJavaScriptCanOpenWindowsAutomatically(true);
    }

    /**
     * HTML5数据存储
     */
    private void saveData(WebSettings mWebSettings) {
        //有时候网页需要自己保存一些关键数据,Android WebView 需要自己设置
        mWebSettings.setDomStorageEnabled(true);
        mWebSettings.setDatabaseEnabled(true);
        mWebSettings.setAppCacheEnabled(true);
        String appCachePath = getApplicationContext().getCacheDir().getAbsolutePath();
        mWebSettings.setAppCachePath(appCachePath);
    }

    WebViewClient webViewClient = new WebViewClient(){

        /**
         * 多页面在同一个WebView中打开,就是不新建activity或者调用系统浏览器打开
         */
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }

    };

    WebChromeClient webChromeClient = new WebChromeClient() {

        //=========HTML5定位==========================================================
        //需要先加入权限
        //<uses-permission android:name="android.permission.INTERNET"/>
        //<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
        //<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
        @Override
        public void onReceivedIcon(WebView view, Bitmap icon) {
            super.onReceivedIcon(view, icon);
        }

        @Override
        public void onGeolocationPermissionsHidePrompt() {
            super.onGeolocationPermissionsHidePrompt();
        }

        @Override
        public void onGeolocationPermissionsShowPrompt(final String origin, final GeolocationPermissions.Callback callback) {
            callback.invoke(origin, true, false);//注意个函数,第二个参数就是是否同意定位权限,第三个是是否希望内核记住
            super.onGeolocationPermissionsShowPrompt(origin, callback);
        }
        //=========HTML5定位==========================================================

        //=========多窗口的问题==========================================================
        @Override
        public boolean onCreateWindow(WebView view, boolean isDialog, boolean isUserGesture, Message resultMsg) {
            WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj;
            transport.setWebView(view);
            resultMsg.sendToTarget();
            return true;
        }
        //=========多窗口的问题==========================================================
    };

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK && mWebView.canGoBack()) {
            mWebView.goBack();
            return true;
        }

        return super.onKeyDown(keyCode, event);
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();

        if (mWebView != null) {
            mWebView.clearHistory();
            ((ViewGroup) mWebView.getParent()).removeView(mWebView);
            mWebView.loadUrl("about:blank");
            mWebView.stopLoading();
            mWebView.setWebChromeClient(null);
            mWebView.setWebViewClient(null);
            mWebView.destroy();
            mWebView = null;
        }
    }

}

来源:WebView全面解析

2.注意事项

1. 为什么Webview打开一个页面,播放一段音乐,退出Activity时音乐还在后台播放?

解决方案 1:
//销毁Webview
@Override
protected void onDestroy() {
    if (mWebview != null) {
        mWebview.loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
        mWebview.clearHistory();
        ((ViewGroup) mWebview.getParent()).removeView(mWebview);
        mWebview.destroy();
        mWebview = null;
    }
    super.onDestroy();
}

还有别问我为什么要移除,等你Error: WebView.destroy() called while still attached!之后你就知道了。

 解决方案 2:
@Override
protected void onPause() {
   h5_webview.onPause();
   h5_webview.pauseTimers();
   super.onPause();
}
@Override
protected void onResume() {
   h5_webview.onResume();
   h5_webview.resumeTimers();
   super.onResume();
}

Webview的onPause()方法官网是这么解释的:

Does a best-effort attempt to pause any processing that can be paused safely, such as animations and geolocation. Note that this call does not pause JavaScript. To pause JavaScript globally, use  pauseTimers(). To resume WebView, call onResume().  

【翻译:】通知内核尝试停止所有处理,如动画和地理位置,但是不能停止Js,如果想全局停止Js,可以调用pauseTimers()全局停止Js,调用onResume()恢复。

2.怎么用网页的标题来设置自己的标题栏?

解决方案:
WebChromeClient mWebChromeClient = new WebChromeClient() {    
    @Override    
    public void onReceivedTitle(WebView view, String title) {    
        super.onReceivedTitle(view, title);    
        txtTitle.setText(title);    
    }    
};  
mWedView.setWebChromeClient(mWebChromeClient());

注意事项:

可能当前页面没有标题,获取到的是null,那么你可以在跳转到该Activity的时候自己带一个标题,或者有一个默认标题。
在一些机型上面,Webview.goBack()后,这个方法不一定会调用,所以标题还是之前页面的标题。那么你就需要用一个ArrayList来保持加载过的url,一个HashMap保存url及对应的title.然后就是用WebView.canGoBack()来做判断处理了。

3. 为什么打包之后JS调用失败(或者WebView与JavaScript相互调用时,如果是debug没有配置混淆时,调用时没问题的,但是当设置混淆后发现无法正常调用了)?

解决方案:

在proguard-rules.pro中添加混淆。
-keepattributes *Annotation*  
-keepattributes *JavascriptInterface*
-keep public class org.mq.study.webview.DemoJavaScriptInterface{
   public <methods>;
}
#假如是内部类,混淆如下:
-keepattributes *JavascriptInterface*
-keep public class org.mq.study.webview.webview.DemoJavaScriptInterface$InnerClass{
    public <methods>;
}
其中org.mq.study.webview.DemoJavaScriptInterface 是不需要混淆的类名

4. 5.0 以后的WebView加载的链接为Https开头,但是链接里面的内容,比如图片为Http链接,这时候,图片就会加载不出来,怎么解决?

原因分析:

原因是Android 5.0上Webview默认不允许加载Http与Https混合内容:


解决方案:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { 
    //两者都可以
    webSetting.setMixedContentMode(webSetting.getMixedContentMode());
    //mWebView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}

参数说明:

MIXED_CONTENT_ALWAYS_ALLOW 允许从任何来源加载内容,即使起源是不安全的;
MIXED_CONTENT_NEVER_ALLOW 不允许Https加载Http的内容,即不允许从安全的起源去加载一个不安全的资源;
MIXED_CONTENT_COMPLTIBILITY_MODE 当涉及到混合式内容时,WebView会尝试去兼容最新Web浏览器的风格;

另外:在认证证书不被Android所接受的情况下,我们可以通过设置重写WebViewClient的onReceivedSslError方法在其中设置接受所有网站的证书来解决,具体代码如下:

webView.setWebViewClient(new WebViewClient() {
        @Override
        public void onReceivedSslError(WebView view,
                SslErrorHandler handler, SslError error) {
            //super.onReceivedSslError(view, handler, error);注意一定要去除这行代码,否则设置无效。
            // handler.cancel();// Android默认的处理方式
            handler.proceed();// 接受所有网站的证书
            // handleMessage(Message msg);// 进行其他处理
        }
});

5. WebView调用手机系统相册来上传图片,开发过程中发现在很多机器上无法正常唤起系统相册来选择图片。怎么解决?

原因分析:

因为Google攻城狮们对setWebChromeClient的回调方法openFileChooser做了多次修改,5.0以下openFileChooser有几种重载方法,在5.0以上将回调方法该为了onShowFileChooser。

解决方案:

为了兼容各个版本,我们需要对openFileChooser()进行重载,同时针对5.0及以上重写onShowFileChooser()方法:

上一段示例代码,给大家看看:

		public class MainActivity extends AppCompatActivity {
		private ValueCallback<Uri> uploadMessage;
		private ValueCallback<Uri[]> uploadMessageAboveL;
		private final static int FILE_CHOOSER_RESULT_CODE = 10000;
		@Override
		protected void onCreate(Bundle savedInstanceState) {
		    super.onCreate(savedInstanceState);
		    setContentView(R.layout.activity_main);
		    WebView webview = (WebView) findViewById(R.id.web_view);
		    assert webview != null;
		    WebSettings settings = webview.getSettings();
		    settings.setUseWideViewPort(true);
		    settings.setLoadWithOverviewMode(true);
		    settings.setJavaScriptEnabled(true);
		    webview.setWebChromeClient(new WebChromeClient() {
		        //  android 3.0以下:用的这个方法
		        public void openFileChooser(ValueCallback<Uri> valueCallback) {
		            uploadMessage = valueCallback;
		            openImageChooserActivity();
		        }
		        // android 3.0以上,android4.0以下:用的这个方法
		        public void openFileChooser(ValueCallback valueCallback, String acceptType) {
		            uploadMessage = valueCallback;
		            openImageChooserActivity();
		        }
		        //android 4.0 - android 4.3  安卓4.4.4也用的这个方法
		        public void openFileChooser(ValueCallback<Uri> valueCallback, String acceptType, 
		                        String capture) {
		            uploadMessage = valueCallback;
		            openImageChooserActivity();
		        }
		        //android4.4 无方法。。。
		        // Android 5.0及以上用的这个方法
		        @Override
		        public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> 
		                 filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) {
		            uploadMessageAboveL = filePathCallback;
		            openImageChooserActivity();
		            return true;
		        }
		    });
		    String targetUrl = "file:///android_asset/up.html";
		    webview.loadUrl(targetUrl);
		}
		private void openImageChooserActivity() {
		    Intent i = new Intent(Intent.ACTION_GET_CONTENT);
		    i.addCategory(Intent.CATEGORY_OPENABLE);
		    i.setType("image/*");
		    startActivityForResult(Intent.createChooser(i, "Image Chooser"),
		                  FILE_CHOOSER_RESULT_CODE);
		}
		@Override
		protected void onActivityResult(int requestCode, int resultCode, Intent data) {
		    super.onActivityResult(requestCode, resultCode, data);
		    if (requestCode == FILE_CHOOSER_RESULT_CODE) {
		        if (null == uploadMessage && null == uploadMessageAboveL) return;
		        Uri result = data == null || resultCode != RESULT_OK ? null : data.getData();
		        if (uploadMessageAboveL != null) {
		            onActivityResultAboveL(requestCode, resultCode, data);
		        } else if (uploadMessage != null) {
		            uploadMessage.onReceiveValue(result);
		            uploadMessage = null;
		        }
		    }
		}
		@TargetApi(Build.VERSION_CODES.LOLLIPOP)
		private void onActivityResultAboveL(int requestCode, int resultCode, Intent intent) {
		    if (requestCode != FILE_CHOOSER_RESULT_CODE || uploadMessageAboveL == null)
		        return;
		    Uri[] results = null;
		    if (resultCode == Activity.RESULT_OK) {
		        if (intent != null) {
		            String dataString = intent.getDataString();
		            ClipData clipData = intent.getClipData();
		            if (clipData != null) {
		                results = new Uri[clipData.getItemCount()];
		                for (int i = 0; i < clipData.getItemCount(); i++) {
		                    ClipData.Item item = clipData.getItemAt(i);
		                    results[i] = item.getUri();
		                }
		            }
		            if (dataString != null)
		                results = new Uri[]{Uri.parse(dataString)};
		        }
		    }
		    uploadMessageAboveL.onReceiveValue(results);
		    uploadMessageAboveL = null;
		}

重点坑:针对Android4.4,系统把openFileChooser方法去掉了,怎么解决?
详情请见博客
http://blog.youkuaiyun.com/xiexie758/article/details/52446937我这里就不多说了。

6. WebView调用手机系统相册来上传图片,处理好第六点说的方法,我们打好release包测试的时候却又发现还是没法选择图片了,怎么解决?

原因分析:

无奈去翻WebChromeClient的源码,发现openFileChooser()是系统API,我们的release包是开启了混淆的,所以在打包的时候混淆了openFileChooser(),这就导致无法回调openFileChooser()了。

解决方案

也很简单,直接不混淆openFileChooser()就好了。
-keepclassmembers class * extends android.webkit.WebChromeClient{
   public void openFileChooser(...);
}

7.怎么在 WebView 中长按保存图片?

1. 给 WebView添加监听
mWebview.setOnLongClickListener(new View.OnLongClickListener() {
    @Override
    public boolean onLongClick(View v) {
    }
});
2. 获取点击的图片地址


先获取类型,根据相应的类型来处理对应的数据。
//首先判断点击的类型
WebView.HitTestResult result = ((WebView) v).getHitTestResult();
int type = result.getType();
//获取具体信息,图片这里就是图片地址
String imgurl = result.getExtra();
type有这几种类型:
WebView.HitTestResult.UNKNOWN_TYPE 未知类型
WebView.HitTestResult.PHONE_TYPE 电话类型
WebView.HitTestResult.EMAIL_TYPE 电子邮件类型
WebView.HitTestResult.GEO_TYPE 地图类型
WebView.HitTestResult.SRC_ANCHOR_TYPE 超链接类型
WebView.HitTestResult.SRC_IMAGE_ANCHOR_TYPE 带有链接的图片类型
WebView.HitTestResult.IMAGE_TYPE 单纯的图片类型
WebView.HitTestResult.EDIT_TEXT_TYPE 选中的文字类型


3. 操作图片


你可以弹出保存图片,或者点击之后跳转到显示图片的页面。


最后整理一下代码:
mWebView.setOnLongClickListener(new View.OnLongClickListener() {
    @Override
    public boolean onLongClick(View v) {
        WebView.HitTestResult result = ((WebView)v).getHitTestResult();
        if (null == result)
            return false;
        int type = result.getType();
        if (type == WebView.HitTestResult.UNKNOWN_TYPE)
            return false;
        // 这里可以拦截很多类型,我们只处理图片类型就可以了
        switch (type) {
            case WebView.HitTestResult.PHONE_TYPE: // 处理拨号
                break;
            case WebView.HitTestResult.EMAIL_TYPE: // 处理Email
                break;
            case WebView.HitTestResult.GEO_TYPE: // 地图类型
                break;
            case WebView.HitTestResult.SRC_ANCHOR_TYPE: // 超链接
                break;
            case WebView.HitTestResult.SRC_IMAGE_ANCHOR_TYPE:
                break;
            case WebView.HitTestResult.IMAGE_TYPE: // 处理长按图片的菜单项
                // 获取图片的路径
                String saveImgUrl = result.getExtra();
                // 跳转到图片详情页,显示图片
                Intent i = new Intent(MainActivity.this, ImageActivity.class);
                i.putExtra("imgUrl", saveImgUrl);
                startActivity(i);
                break;
            default:
                break;
        }
    }
});

8. WebView 开启硬件加速导致的问题?

WebView有很多问题,比如:不能打开pdf,播放视屏也只能打开硬件加速才能支持,在某些机型上会崩溃。

下面看一下硬件加速, 硬件加速分为四个级别:

Application级别
<application android:hardwareAccelerated="true"...>
Activity级别
<activity android:hardwareAccelerated="true"...>
window级别(目前为止,Android还不支持在Window级别关闭硬件加速。)
getWindow().setFlags(
    WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED,         
    WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED);
View级别
view.setLayerType(View.LAYER_TYPE_HARDWARE, null);

WebView开启硬件加速导致屏幕花屏问题的解决:

原因分析:

4.0以上的系统我们开启硬件加速后,WebView渲染页面更加快速,拖动也更加顺滑。但有个副作用就是,当WebView视图被整体遮住一块,然后突然恢复时(比如使用SlideMenu将WebView从侧边滑出来时),这个过渡期会出现白块同时界面闪烁。

解决方案:

在过渡期前将WebView的硬件加速临时关闭,过渡期后再开启,代码如下:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
    webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

Android 4.0+ 版本中的EditText字符重叠问题:

做的软件,在一些机器上,打字的时候,EditText中的内容会出现重叠,而大部分机器没有,所以感觉不是代码的问题,一直没有头绪。

出现原因:JellyBean的硬件加速bug,在此我们关掉硬件加速即可。

解决方案:在EditText中加入一句:
android:layerType=”software”
图片无法显示:

做的程序里有的时候会需要加载大图,但是硬件加速中 OpenGL对于内存是有限制的。如果遇到了这个限制,LogCat只会报一个Warning: Bitmap too large to be uploaded into a texture (587x7696, max=2048x2048)

这时我们就需要把硬件加速关闭了。

但开始我是这样处理的,我关闭了整个应用的硬件加速:

随后我就发现,虽然图片可以显示了,但是ListView和WebView等控件显得特别的卡,这说明硬件加速对于程序的性能提升是很明显的。所以我就改为对于Activity的关闭。

<activity  
    android:name="icyfox.webviewimagezoomertest.MainActivity"  
    android:label="@string/app_name"  
    android:hardwareAccelerated="false"

9. ViewPager里非首屏WebView点击事件不响应是什么原因?

如果你的多个WebView是放在ViewPager里一个个加载出来的,那么就会遇到这样的问题。ViewPager首屏WebView的创建是在前台,点击时没有问题;而其他非首屏的WebView是在后台创建,滑动到它后点击页面会出现如下错误日志:
20955-20968/xx.xxx.xxx E/webcoreglue﹕ Should not happen: no rect-based-test nodes found
解决方案:

这个问题的办法是继承WebView类,在子类覆盖onTouchEvent方法,填入如下代码:

@Override
public boolean onTouchEvent(MotionEvent ev) {
    if (ev.getAction() == MotionEvent.ACTION_DOWN) {
        onScrollChanged(getScrollX(), getScrollY(), getScrollX(), getScrollY());
    }
    return super.onTouchEvent(ev);
}

10.安卓8.0关于WebView的新特性

WebView新增了一些非常有用的API,可以使用和chrome浏览器类似的API来实现对恶意网站的检测来保护web浏览的安全性,为此需要在manifest中添加如下meta-data标签

<manifest>
<meta-data
    android:name="android.webkit.WebView.EnableSafeBrowing"
    android:value="true" />
<!-- ... -->
</manifest>

WebView还增加了关于多进程的API,可以使用多进程来增强安全性和健壮性,如果render进程崩溃了,你还可以使用Termination Handler API来检测到崩溃并做出相应处理。

11.关于WebView的一点小优化

(1)给WebView加一个加载进度条

用Webview加载一个网页时,如果加载时间长,界面会一直空白,体验不太好,所以加个进度条更好看一下,主流APP也都有进度条效果,大概思路我来说一下:

首先自定义一个HorizontalProgressView继承View,然后自定义一个MyWebView继承WebView,然后初始化的时候通过addView方法把前面自定义HorizontalProgressView,然后在MyWebView里面写一个内部类继承WebChromeClient,大致代码如下:

private class MyWebCromeClient extends WebChromeClient {
    @Override
    public void onProgressChanged(WebView view, int newProgress) {
        if (newProgress == 100) {
            //加载完毕进度条消失
            progressView.setVisibility(View.GONE);
        } else {
            //更新进度
            progressView.setProgress(newProgress);
        }
        super.onProgressChanged(view, newProgress);
    }
}

主要是通过MyWebCromeClient 的onProgressChanged方法里面的进度值调用
progressView.setProgress()方法去更新进度条,当加载100%的时候让进度条消失。
具体实现你们自己去处理吧。

(2)加快HTML网页加载完成的速度,等页面finish再加载图片

默认情况html代码下载到WebView后,webkit开始解析网页各个节点,发现有外部样式文件或者外部脚本文件时,会异步发起网络请求下载文件,但如果在这之前也有解析到image节点,那势必也会发起网络请求下载相应的图片。

在网络情况较差的情况下,过多的网络请求就会造成带宽紧张,影响到css或js文件加载完成的时间,造成页面空白loading过久。解决的方法就是告诉WebView先不要自动加载图片,等页面finish后再发起图片加载。

解决办法:

在WebView初始化时设置如下代码:

public void int () {
    if(Build.VERSION.SDK_INT >= 19) {
        webView.getSettings().setLoadsImagesAutomatically(true);
    } else {
        webView.getSettings().setLoadsImagesAutomatically(false);
    }
}

同时在WebView的WebViewClient实例中的onPageFinished()方法添加如下代码:

@Override
public void onPageFinished(WebView view, String url) {
    if(!webView.getSettings().getLoadsImagesAutomatically()) {
        webView.getSettings().setLoadsImagesAutomatically(true);
    }
}

(3)自定义WebView页面加载出错界面

当WebView加载页面出错时(一般为404 NOT FOUND),安卓WebView会默认显示一个卖萌的出错界面。但我们怎么能让用户发现原来我使用的是网页应用呢,我们期望的是用户在网页上得到是如原生般应用的体验,那就先要从干掉这个默认出错页面开始。

当WebView加载出错时,我们会在WebViewClient实例中的onReceivedError()方法接收到错误,我们就在这里做些手脚:

@Override
public void onReceivedError (WebView view, int errorCode, String description, String failingUrl) {
    super.onReceivedError(view, errorCode, description, failingUrl);
    loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
    mErrorFrame.setVisibility(View.VISIBLE);
}

从上面可以看出,我们先使用loadDataWithBaseURL清除掉默认错误页内容,再让我们自定义的View得到显示(mErrorFrame为蒙在WebView之上的一个LinearLayout布局,默认为View.GONE)。

(4) 怎么知道WebView是否已经滚动到页面底端?

解决方案:

方案1,使用原生WebView的api可以获取到:
if (mWebView.getContentHeight() * mWebView.getScale()  
    == (mWebView.getHeight() + mWebView.getScrollY())) {
    //说明已经到底了
}
方案2,继承WebView,重写onScrollChanged方法:

我们在做上拉加载下一页这样的功能时,也需要知道当前页面滚动条所处的状态,如果快到底部,则要发起网络请求数据更新网页。同样继承WebView类,在子类覆盖onScrollChanged方法。

以下代码中mCurrContentHeight用于记录上次触发时的网页高度,用来防止在网页总高度未发生变化而目标区域发生连续滚动时会多次触发TODO,mThreshold是一个阈值,当页面底部距离滚动条底部的高度差<=这个值时会触发TODO里面的代码。

具体如下:
@Override
protected void onScrollChanged(int newX, int newY, int oldX, int oldY) {
    super.onScrollChanged(newX, newY, oldX, oldY);
    if (newY != oldY) {
        float contentHeight = getContentHeight() * getScale();
        // 当前内容高度下从未触发过, 浏览器存在滚动条且滑动到将抵底部位置
        if (mCurrContentHeight != contentHeight && newY > 0 && contentHeight <= newY + getHeight() + mThreshold) {
            // TODO Something...
            mCurrContentHeight = contentHeight;
        }
    }
}

相关API介绍:

getContentHeight() @return the height of the HTML content
getScale() @return the current scale
getHeight() @return The height of your view
getScrollY() @return The top edge of the displayed part of your view, in pixels.

(5) 怎么知道WebView是否存在滚动条?

当我们做类似上拉加载下一页这样的功能的时候,页面初始的时候需要知道当前WebView是否存在纵向滚动条,如果有则不加载下一页,如果没有则加载下一页直到其出现纵向滚动条。

首先继承WebView类,在子类添加下面的代码

public boolean existVerticalScrollbar () {
    return computeVerticalScrollRange() > computeVerticalScrollExtent();
}

computeVerticalScrollRange得到的是可滑动的最大高度,computeVerticalScrollExtent得到的是滚动把手自身的高,当不存在滚动条时,两者的值是相等的。当有滚动条时前者一定是大于后者的。

其实也有一些替代WebView的库,比如腾讯的TBS 腾讯浏览服务https://x5.tencent.com/tbs/index.html, 比如WebViewJavascriptBridge等方式,有兴趣的可以去了解一下。

3.Android与JavaScript交互

Android与JavaScript的交互依赖于WebView,
来自:WebView与JavaScript的交互总结

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值