android web view

1，什么是webview控件，webview控件的使用用途是什么？

A View that displays web pages. This class is the basis upon which you can roll your own web browser or simply display some online content within your Activity. It uses the WebKit rendering engine to display web pages and includes methods to navigate forward and backward through a history, zoom in and out, perform text searches and more.

Note that, in order for your Activity to access the Internet and load web pages in a WebView, you must add the INTERNET permissions to your Android Manifest file:

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

This must be a child of the element.

For more information, read Building Web Apps in WebView.

webview是用来显示web网页页面。这个类的基本使用能够让你在你的App应用中滚动你的web浏览器或者简单的展示一些网上内容在你的ui的activity里面。它使用WebKit渲染引擎显示web页面,包括方法通过历史向前或者向后导航,放大和缩小,执行文本搜索和更多。

详见：http://android.xsoftlab.net/reference/android/webkit/WebView.html

详见：http://android.xsoftlab.net/guide/webapps/webview.html

1，webview的简单使用，加载web网页。

在默认的情况下，webview没有提供浏览器样的小部件，不支持javascript和网页页面的错误被忽略了。如果你的目的只是想要展示html文件作为你的ui界面的一部分，这应该是没有问题的，用户不需要和网页进行交互阅读，只是进行浏览阅读，而同时呢，网页页面也不需要和用户进行交互。但是呢，如果你真的想要一个成熟的web浏览器,那么你可能想和一个URL调用浏览器应用程序的意图,而不是显示WebView。

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

好了，言归正传，1.1，那么怎么来创建和使用webview控件呢？ 当然webview作为控件可以直接放在布局文件里面，也可以创建webview控件，但是创建的webview控件需要在activity的oncreate()中，setContentView(webview)来使用。也就是这句话的意思：set the entire Activity window as a WebView duringonCreate():

这里是activity_main.xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">        <WebView        android:layout_width="wrap_content"        android:layout_height="wrap_content">    </WebView></RelativeLayout>

这是java代码

public class MainActivity extends AppCompatActivity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        ////        WebView webview = new WebView(this);//        setContentView(webview);    }}
或者

public class MainActivity extends AppCompatActivity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);       WebView webview = new WebView(this);        setContentView(webview);    }}
1.2，加载web网页。

1.2.1 webview加载网址链接，或者加载html文件

1.2.2 webview的设置类WebChromeClient，WebViewClient，WebSettings来对webview进行设置。

WebChromeClient  创建和设置WebChromeClient子类。这个类时调用可能会影响浏览器用户界面发生的东西,例如,进度更新和JavaScript警报发送在这里(参见调试任务)。

WebViewClient  创建和设置WebViewClient子类。它将被称为当事情发生,影响内容的呈现,例如,错误或表单提交。你也可以在这里拦截URL加载(通过shouldOverrideUrlLoading())。

WebSettings 修改WebSettings,比如启用JavaScript setJavaScriptEnabled()。

向WebView使用addJavascriptInterface注入Java对象(对象、字符串)方法。这个方法允许您将Java对象注入到一个页面的JavaScript上下文,这样他们可以通过JavaScript访问的页面。

1.2.3 web页面控制缩放。

为了支持页面web的缩放，设置Websetting.setBuildInZoomControls(boolean),从cupcake api1.5开始支持这个设置。

注意:使用变焦如果高度或宽度设置为WRAP_CONTENT可能导致未定义行为,应该避免。

1.2.4 cookie 和窗口管理(window manager)

为了安全的原因，你的应用有自己的cache缓存，cookie store等等。而是不共享浏览器应用程序的数据。

在默认的情况下，请求的HTML打开新窗口将被忽略。这是真的是否由JavaScript或打开一个链接的目标属性。你可以定制WebChromeClient为开放多个窗口,提供自己的行为,使他们展现在任何你想要的方式。

当设备的方向或其他任何配置更改而导致activity的销毁重建的标准行为，而这些操作会导致当前web页面内容的重新加载。如果你不想这样，你可以设置activity去处理方向和keyboardHidden的改变，然后就独自离开webview。它会自动调整本身。Read Handling Runtime Changes for more information about how to handle configuration changes during runtime. 

1.2.5 构建web页面去支持不同的屏幕密度。

屏幕密度的设备是根据屏幕分辨率。屏幕与低密度减少可用像素每英寸,屏幕与高密度更多——有时更多像素每英寸。屏幕的密度是很重要的,因为,在其他条件相同的情况下,一个用户界面元素(如按钮)的高度和宽度的定义屏幕像素就会出现更大的屏幕上的低密度和更小的屏幕上更高的密度。为简单起见,Android区分所有实际屏幕密度分为三个广义密度:高,中,低。

在默认情况下,WebView扩大一个web页面,画在一个大小相匹配的默认外观中密度屏幕上。它适用于1.5 x扩展高密度屏幕上(因为它的像素更小)和0.75 x扩展低密度屏幕上(因为它的像素更大)。从API级别android 2.0,WebView支持DOM,CSS和meta标签功能来帮助你(作为web开发人员)目标屏幕屏幕密度不同。

这里是一个总结的功能可以用来处理不同屏幕密度:

window.devicePixeRatio dom属性。该属性的值指定默认比例因子用于当前的设备。比如，如果window.devicePixeRatio的值为1.0，然后设备被认为是中等密度(mdpi)设备和默认缩放不应用于web页面，如果值为1.5，设备被认为是高密度设备(hdpi)和页面内容是按比例缩小的1.5倍，如果值为0.75，设备被认为是一个低密度的设备(ldpi)和内容是按比例缩小的0.75倍。

-webkit-device-pixel-ratio css 媒体查询(media query).使用指定的屏幕密度这个样式表使用。相应的值应该是“0.75”,“1”,“1.5”,表明设备的风格是较低的密度、介质密度,分别或高密度屏幕.

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

这个hdpi.css样式表仅仅被用于1.5比例的屏幕设备，他是高密度分辨率的设备。

http://www.zhangxinxu.com/wordpress/2012/08/window-devicepixelratio/

1.2.6 html5 video的支持

in order to support inline HTML5 video in your application you need to have hardware acceleration turned on.

为了支持内联HTML5视频在你的应用里，你需要打开硬件加速开关。

1.2.7 全屏支持

为了支持全屏－对于视频或者其他html内容，你需要设置setWebChromClient和实现onShowCustomView(view,WebChromClient.CustomViewCallback)和onHideCustomView(),如果这两种方法的实现是失踪那么web内容将不被允许进入全屏.你也可以实现getVideoLoadingProgressView()去定制web页面正在加载的页面的view。

1.2.8 layout size 布局尺寸

建议将WebView布局高度设置为一个固定值或使用WRAP_CONTENT MATCH_PARENT代替。当使用MATCH_PARENT的高度没有WebView的父母（也就是这个webview没有父布局的时候），应该使用WRAP_CONTENT布局高度，因为这可能导致不正确的大小的观点。

WebView的高度设置为WRAP_CONTENT来支持以下行为:

  html的body设置为一个固定的高度值。这意味着元素的高度相对于html的body的高度可能是不正确的。

  对于应用的平台版本kitkat（android 4.4）和更早的版本的sdks，html窗口的meta标签将被忽略，为了保持向后的兼容性。

不支持使用布局WRAP_CONTENT宽度。如果这样的宽度是使用WebView将尝试使用父母的宽度。

下载资源demo