WebView 简介



日期: 2013年10月29日

注意: API可能有演进，所以需要看当前时间决定是否有用





继承结构:

  1. public class WebView extends AbsoluteLayout
  2.  implements ViewGroup.OnHierarchyChangeListener ViewTreeObserver.OnGlobalFocusChangeListener

概述

-----

显示web页面的视图界面(View).本类是你实现自己的浏览器,或者在Activity内部显示在线内容的基础(库)。

WebView对象使用WebKit引擎来显示web页面,并提供一些方法,比如可以通过历史记录来前进后退，缩放，执行文本搜索等。

要允许内置的缩放功能,设置 WebSettings.setBuiltInZoomControls(boolean) (在API级别 CUPCAKE[1.6] 中介绍)



注意: 如果要让Activity可以访问互联网,以及Webview加载网页,需要在Android Manifest文件中添加 INTERNET 权限。

  1.  <uses-permission android:name="android.permission.INTERNET" />

这必须是某个元素的子元素(This must be a child of the element. ???This 是指什么 ???)。

想要了解更多信息,请访问 在WebView中创建Web应用





基础用法

-----

默认配置下,WebView对象是一个不像浏览器的组件,不支持JavaScript,忽略网页错误.

如果你只想要显示一些HTML作为UI界面的一部分，那么这很可能是合适的;

在用户浏览的时候,不需要和web页面进行交互,而网页也不需要和用户进行互动。

如果确实想要一个全功能稳定的web浏览器,你可能想要通过一个URL Intent来启动浏览器程序，而不是在自己的WebView里显示。

示例如下：

  1. Uri uri = Uri.parse("http://www.ieternal.com");
  2.  Intent intent = new Intent(Intent.ACTION_VIEW, uri);
  3.  startActivity(intent);

详情参见: Intent



要在Activity中提供WebView，可以在layout中声明,或者在 onCreate() 方法中设置整个Activity的window界面为 WebView:

  1.  WebView webview = new WebView(this);
  2.  setContentView(webview);

然后加载所需的web页面:

  1.  // 最简单的用法: 注意这种情况下,加载页面时如果有错误,并不会有异常(exception)抛出
  2.  webview.loadUrl("http://m.ieternal.com/");
  3.  
  4.  // 或者,你也可以从  HTML 字符串加载内容:
  5.  String summary = "<html><body>您的成绩: <b>192</b> 分.</body></html>";
  6.  webview.loadData(summary, "text/html", null);
  7.  // ... 需要注意此处的HTML能做的事有一些限制.
  8.  // 想要了解更多,请查看JavaDocs, loadData() 和 loadDataWithBaseURL()方法.

可以通过以下几点来配置WebView的行为:

1. 创建并设置 WebChromeClient 的子类对象。当有可能影响浏览器 UI界面的事件发生时,此类将被调用. 例如： 进度条更新,以及 JavaScript 弹出alert警告。

2. 创建并设置 WebViewClient 的子类对象.当有可能影响内容渲染的事件发生时,此类将被调用.比如: 页面错误,表单提交等.通过shouldOverrideUrlLoading() 方法,可以对URL进行过滤和拦截().

3. 修改 WebSettings.比如通过setJavaScriptEnabled()方法启用JavaScript支持.

4. 使用 addJavascriptInterface(Object, String) 方法注入 Java对象 到JS上下文(window.XXX),则在页面中可以通过JavaScript访问或调用.





以下是一个复杂一些的例子,显示错误处理,设置,以及页面加载进度信息.

  1.  // 本示例代码在activity的标题栏中显示页面加载进度信息, 如同浏览器应用一样.
  2.  getWindow().requestFeature(Window.FEATURE_PROGRESS);
  3.  
  4.  webview.getSettings().setJavaScriptEnabled(true);
  5.  
  6.  final Activity activity = this;
  7.  webview.setWebChromeClient(new WebChromeClient() {
  8.    public void onProgressChanged(WebView view, int progress) {
  9.      // Activitiy 以及 WebView 通过不同的比例来显示进度信息.
  10.      // 当进度达到 100%以后将会自动隐藏
  11.      activity.setProgress(progress * 1000);
  12.    }
  13.  });
  14.  webview.setWebViewClient(new WebViewClient() {
  15.    public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
  16.      Toast.makeText(activity, "Oh no! " + description, Toast.LENGTH_SHORT).show();
  17.    }
  18.  });
  19.  
  20.  webview.loadUrl("http://slashdot.org/");

Cookie 和 window 管理

------

因为安全方面的限制,你的应用拥有自己的cache,cookie存储,很明显,并不能共享浏览器app的数据.

默认情况下,在页面内部，不论是通过JavaScript调用还是< a >标签的target属性请求打开新的window,都会被忽略。

你也可以自定义  WebChromeClient 来支持多窗口(标签),并按你想要的方式来展示他们.





当设备的方向或其他配置改变之后,Activity的标准行为是被摧毁(destroyed),然后重新创建(recreated),因此会导致WebView重新加载当前页面.如果你不想要这种结果,你可以让Activity自己处理 orientation 和 keyboardHidden 相关事件,然后不管WebView. WebView会合适地管理自身的改变方向事件。想要了解在运行时如何处理配置信息的改变,请
点击这里.



构建兼容不同屏幕密度的web页面

--------

设备的屏幕密度基于其分辨率。密度越低的屏幕在每英寸上的可用像素越少，当然密度越高的每英寸上就更多(甚至高好几倍).

屏幕的dpi是很重要的，在其他条件都相同的情况下，一个UI元素(如button)的宽和高都被指定了屏幕像素以后，在低密度屏幕上显得更大,在高密度屏幕上显得更小.为了简单起见,Android将各种实际的屏幕密度规整为三种分辨率: high, medium, 以及 low





默认情况下,WebView缩放web页面以匹配中等密度的屏幕。所以在高分屏上放大为1.5倍(因为单个像素所占的地方更小),在低分屏上缩小为0.75倍(单个像素点更大)。

从API级别ECLAIR(2.0)开始,WebView支持 DOM,CSS以及 meta 标签特性 以帮助web开发者适配不同屏幕密度.





以下是用于处理不同屏幕密度的方式:

1. DOM属性 window.devicePixelRatio; 此属性的值指定当前设备的默认缩放因子。举例来说，如果这个值为"1.0",则按照mdpi设备来处理，如果值为"1.5"则当做hdpi设备,如果为"0.75"则当做低分屏并且缩小为0.75倍.

2. CSS媒体查询元素 -webkit-device-pixel-ratio; 此元素可以在兼容的设备指定屏幕密度。相应的值只能是 "0.75","1"和"1.5",用于指定此style样式适用于哪种密度的屏幕. 例如:

  1. <link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio:1.5)" href="hdpi.css" />

此处, hdpi.css 只兼容像素比为1.5(即高密度)的屏幕。



HTML5 视频(Video)支持

为了在app中支持HTML5内置的video支持,需要开启硬件加速。并为WebView设置一个WebChromeClient对象. 要支持全屏播放,必须实现 onShowCustomView(View, WebChromeClient.CustomViewCallback) 和 onHideCustomView() 方法, 可选实现 getVideoLoadingProgressView().

WebView 简介的更多相关文章

  1. Android WebView简介

    Android的网络功能特别强大,WebView(网络视图)组件支持加载网页,可以理解为使用Webkit内核的浏览器,而它的实现方式有两种: 第一种具体实现步骤如下: (1)在布局文件中先生命WebV ...

  2. WebView简介（加速加载篇）

    从Android 3.0开始,Android的2D渲染管线可以更好的支持硬件加速.硬件加速使用GPU进行View上的绘制操作. 硬件加速可以在一下四个级别开启或关闭: Application Acti ...

  3. WebView·开发指南

    WebView·开车指南 作者:凌俊琦链接:https://zhuanlan.zhihu.com/p/22247021来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. T ...

  4. iOS 开发之使用safari对webview进行调试

    转自:http://www.tuicool.com/articles/ZBFnUbz 使用safari对webview进行调试 时间 2016-02-25 14:35:20  陈斌彬的技术博客 原文  ...

  5. 客户端浏览器- UWP兼容版本WebView

    WebView简介 在win10之前,浏览器控件有WPF版本webBrowser.Winform版本WebBrowser,浏览器内核为IE. win10之后,微软不再维护原有的WebBrowser,转 ...

  6. 使用webview查找元素，appium查找web页面元素

    9 webview查找元素 9.1 webview 简介 WebView是android中一个非常重要的控件,它的作用是用来展示一个web页面.它使用的内核是webkit引擎,4.4版本之后,直接使用 ...

  7. Appium自动化（15） - 针对 webview 进行自动化测试

    如果你还想从头学起Appium,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1693896.html webview 简介 WebVie ...

  8. 【Xamarin开发 Android 系列 3】循序渐进的学习顺序

    原文:[Xamarin开发 Android 系列 3]循序渐进的学习顺序 指定合理的学习步骤,将各个技术点进行强化.慢慢 的就从点到线 到面的飞跃,一切仅仅是时间问题,开始前,请记住,学习是最佳的投资 ...

  9. [电子书] 《Android编程兵书》PDF

    Android编程兵书 内容简介: 这是一本Android开发书籍,内容讲解详细,例子丰富,能帮助读者举一反三.在<Android编程兵书>中,每一个知识点的描述都非常详细,并且每一个知识 ...

随机推荐

  1. ubuntu部署mipsel64交叉编译环境

    最近找到个不错的交叉工具链,据传能够编译mipsel64的程序,决定试试. 首先当然是安装环境: apt install -y gcc libncursesada3-dev 下载,解压,进入 三部曲: ...

  2. CSS实现元素居中原理解析

    在 CSS 中要设置元素水平垂直居中是一个非常常见的需求了.但就是这样一个从理论上来看似乎实现起来极其简单的,在实践中,它往往难住了很多人. 让元素水平居中相对比较简单:如果它是一个行内元素,就对它的 ...

  3. 【C#复习总结】匿名类型由来

    1 属性 这得先从属性开始说,为什么外部代码访问对象内部的数据用属性而不是直接访问呢,这样岂不是更方便一些,但是事实证明直接访问是不安全的.那么,Anders Hejlsberg(安德斯·海尔斯伯格) ...

  4. ACM Adding Reversed Numbers（summer2017）

    The Antique Comedians of Malidinesia prefer comedies to tragedies. Unfortunately, most of the ancien ...

  5. Node.js URL

    稳定性: 3 - 稳定 这个模块包含分析和解析 URL 的工具.调用 require('url') 来访问模块. 解析 URL 对象有以下内容,依赖于他们是否在 URL 字符串里存在.任何不在 URL ...

  6. C实战：项目构建Make,Automake,CMake

    C实战:项目构建Make,Automake,CMake 在本系列文章<C实战:强大的程序调试工具GDB>中我们简要学习了流行的调试工具GDB的使用方法.本文继续"C实战" ...

  7. Git 直接推送到生产服务器

    假设路径为/project/path/ 设定git仓库可以直接被远程推送(需要较新的git版本,比如2.7) cd /project/path git config receive.denyCurre ...

  8. Jedis分片Sentinel连接池实验

    Jedis分片Sentinel连接池实验 1.起因 众所周知,Redis官方HA工具Sentinel已经问世很久了,但令人费解的是,Jedis官方却迟迟没有更新它的连接池.到目前Maven库中最新的2 ...

  9. 详解EBS接口开发之库存事务处理采购接收和退货

    (一)接收&退货常用标准表简介 1.1   常用标准表 如下表中列出了与采购接收&退货导入相关的表和说明: 表名 说明 其他信息 RCV_TRANSACTIONS 采购接收事务表 事务 ...

  10. Cocoa中层(layer)坐标系的极简理解

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) Cocoa层的坐标系一直理解的不清晰,现在把它整理总结一下: ...