Android深入理解WebView——上

Wesley13
• 阅读 878

摘要

作为Android开发者,我们都知道在手机中内置了一款高性能 webkit 内核浏览器,在 SDK 中封装为一个叫做 WebView 组件。今天就为大家讲讲Android中WebView的详细使用方法        
本文原创,转载请注明地址:http://blog.kymjs.com/

作为Android开发者,我们都知道在手机中内置了一款高性能 webkit 内核浏览器,在 SDK 中封装为一个叫做 WebView 组件。
在开发过程中应该注意几点:
1.这是最基本的 AndroidManifest.xml 中必须添加访问网络权限。
2.如果访问的页面中有 Javascript,则 WebView 必须设置支持 Javascript。

WebView.getSettings().setJavaScriptEnabled(true);

3.如果页面中链接,如果希望点击链接继续在当前browser中响应,而不是新开Android的系统browser中响应该链接,必须覆盖 WebView的WebViewClient对象.

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

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

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

与js互调

既然可以显示网页,那么当然也可以让网页操作本地方法。(由于一行写不下,缩进我调整了一下)

public class WebViewDemo extends Activity { 
    private WebView mWebView;
    private Handler mHandler = new Handler(); 
    
    public void onCreate(Bundle icicle) { 

    setContentView(R.layout.WebViewdemo);
    mWebView = (WebView) findViewById(R.id.WebView); 
    WebSettings webSettings = mWebView.getSettings(); 
    webSettings.setJavaScriptEnabled(true); 
    mWebView.addJavascriptInterface(new Object() {
      public void clickOnAndroid() {
          mHandler.post(new Runnable() {
              public void run() { 
                  mWebView.loadUrl("javascript:wave()");
              }
          });
      }
    }, "demo"); 
    mWebView.loadUrl("file:///android_asset/demo.html"); 
    
    }
}

我们看 addJavascriptInterface(Object obj,String interfaceName)这个方法 ,该方法将一个java对象绑定到一个javascript对象中,javascript对象名就是 interfaceName(demo),作用域是Global.这样初始化 WebView 后,在WebView加载的页面中就可以直接通过javascript:window.demo访问到绑定的java对象了. 来看看在html中是怎样调用的.

<html>
<script language="javascript">
  function wave() {
    document.getElementById("droid").src="android_waving.png";
  }
</script>
<body>
  <a onClick="window.demo.clickOnAndroid()">
  <img id="droid" src="android_normal.png" mce_src="android_normal.png"/><br> Click me! </a>
</body>
</html>

这样在 javascript 中就可以调用 java 对象的 clickOnAndroid()方法了,同样我们可以在此对象中定义很多方法(比如发短信,调用联系人列表等手机系统功能),这里 wave()方法是 java 中调用 javascript 的例子.

需要说明一点:addJavascriptInterface方法中要绑定的Java对象及方法要运行另外的线程中,不能运行在构造他的线程中,这也是使用 Handler 的目的.

深入使用WebView

让js调用Android代码

  1. 首先简述 WebView、WebViewClient、WebChromeClient 之间的区别:
    在 WebView 的设计中,不是什么事都要 WebView类干的,有些杂事是分给其他人的,这样 WebView 专心干好 自己的解析、渲染工作就行了.WebViewClient 就是帮助 WebView 处理各种通知、请求事件等 ,WebChromeClient 是辅助 WebView 处理 Javascript 的对话框,网站图标,网站 title.

  2. 功能实现:
    利用 android 中的 WebView 加载一个 html 网页,在 html 网页中定义一个按钮,点击按钮弹出一 个 toast.

  3. 实现步骤:
    首先定义一个接口类,将上下文对象传进去,在接口类中定义要在 js 中实现的方法。
    接着在assets资源包下定义一个 html 文件,在文件中定义一个 button.button 的点击事件定义为一个 js 函数.
    之后在 xml 中定义一个 WebView 组件,在活动类中获取 WebView 并对 WebView 参数进行设置,此处特别注意要设置 WebView 支持 js 且将定义的 js 接口类添加到 WebView 中去,此后在 js 中就可以利用该接口类中定义的 函数了.即:

    myWebView.getSettings().setJavaScriptEnabled(true);

    myWebView.addJavascriptInterface(new JavaScriptinterface(this),”android”);

最后利用 WebView 加载本地 html 文件的方法是:

myWebView.loadData(htmlText,"text/html", "utf-8");

此处的htmltext 是以字符串的方式读取 assets 报下 html中的内容.
4. 实现利用返回键返回到上一页:
设置 WebView 的按键监听,监听到期返回键并判断网页是否能够返回 ,利用 WebView 的 goBack()返回到上一页.

WebView 缓存

在项目中如果使用到 WebView 控件,当加载 html 页面时,会在/data/data/包名目录下生成 database 与 cache 两个文件夹(我的手机没有root,就不截图了)。
请求的 url 记录是保存在 WebViewCache.db,而 url 的内容是保存在 WebViewCache 文件夹下. 大家可以自己动手试一下,定义一个html文件,在里面显示一张图片,用WebView加载出来,然后再试着从缓存里把这张图片读取出来并显示 .

WebView 删除缓存

其实已经知道缓存保存的位置了,那么删除就很简单了,获取到这个缓存,然后删掉他就好了。
//删除保存于手机上的缓存

private int clearCacheFolder(File dir,long numDays) { 
  int deletedFiles = 0;
  if (dir!= null && dir.isDirectory()){
    try {
      for (File child:dir.listFiles()){
          if (child.isDirectory()) {
            deletedFiles += clearCacheFolder(child, numDays);
        }
        if (child.lastModified() < numDays) {
          if (child.delete()) {
           deletedFiles++; 
          }
        }
      }
    } catch(Exception e) {
      e.printStackTrace(); 
    }
  }
  return deletedFiles; 
}

是否启用缓存功能也是可以控制的

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

在退出应用的时候加上如下代码,可以完整的清空缓存

File file = CacheManager.getCacheFileBaseDir();
if (file != null && file.exists() && file.isDirectory()) {
    for (File item : file.listFiles()) {
        item.delete();}file.delete();
    }
context.deleteDatabase("WebView.db"); 
context.deleteDatabase("WebViewCache.db");

WebView 处理 404 错误

显示网页还会遇到一个问题,就是网页有可能会找不到,WebView当然也是可以处理的(代码如果全部贴出来实在太多了,这里就只贴重要部分了)

public class WebViewActivity extends Activity {
    private Handler handler = new Handler() {
        public void handleMessage(Message msg) {
              if(msg.what==404) {//主页不存在
                  //载入本地 assets 文件夹下面的错误提示页面 404.html
                  web.loadUrl("file:///android_asset/404.html");      
              }else{        
                  web.loadUrl(HOMEPAGE);      
              }    
          }};
      @Override
      protected void onCreate(Bundle savedInstanceState) {
        web.setWebViewClient(new WebViewClient() {      
            public boolean shouldOverrideUrl(WebView view,String url) { 
        if(url.startsWith("http://") && getRespStatus(url)==404) {      
            view.stopLoading();      
            //载入本地 assets 文件夹下面的错误提示页面 404.html       
            view.loadUrl("file:///android_asset/404.html");    
        }else{      
            view.loadUrl(url);    
        }      
    return true;    
    }  
    });  
    new Thread(new Runnable() {    
        public void run() {  
        Message msg = new Message();  
        //此处判断主页是否存在,因为主页是通过 loadUrl 加载的,  
        //此时不会执行 shouldOverrideUrlLoading 进行页面是否存在的判断 
        //进入主页后,点主页里面的链接,链接到其他页面就一定会执行shouldOverrideUrlLoading 方法了 
            if(getRespStatus(HOMEPAGE)==404) {      
                msg.what = 404;  
            }  
            handler.sendMessage(msg);  
        }).start();  
    }
}

未完

由于WebView的用法实在太多了,这里就分为两部分,下一部分跟大家讲讲WebView滚动状态监听以及获取session与写cookie的方法~~

版权声明:本文为博主原创文章,未经博主允许不得转载。

点赞
收藏
评论区
推荐文章
blmius blmius
2年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Jacquelyn38 Jacquelyn38
2年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
Stella981 Stella981
2年前
Flutter
在Flutter加载网页?也是有WebView的哦,和Android一样1.添加依赖dependencies:flutter\_webview\_plugin:^0.2.122.导入库import'import'package:flutter\_webview\_plugin/flutter\_webview\_plug
Wesley13 Wesley13
2年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Wesley13 Wesley13
2年前
00:Java简单了解
浅谈Java之概述Java是SUN(StanfordUniversityNetwork),斯坦福大学网络公司)1995年推出的一门高级编程语言。Java是一种面向Internet的编程语言。随着Java技术在web方面的不断成熟,已经成为Web应用程序的首选开发语言。Java是简单易学,完全面向对象,安全可靠,与平台无关的编程语言。
Stella981 Stella981
2年前
Android蓝牙连接汽车OBD设备
//设备连接public class BluetoothConnect implements Runnable {    private static final UUID CONNECT_UUID  UUID.fromString("0000110100001000800000805F9B34FB");
Stella981 Stella981
2年前
Django中Admin中的一些参数配置
设置在列表中显示的字段,id为django模型默认的主键list_display('id','name','sex','profession','email','qq','phone','status','create_time')设置在列表可编辑字段list_editable
Wesley13 Wesley13
2年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
Python进阶者 Python进阶者
4个月前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这