一 概述
Webview是android中一个特殊的View视图,一般用它来显示网页,用intent也能用来显示加载一个网页,那么他们到底有什么区别呢。用intent显示加载网页不在app内使用,一般是调用系统浏览器或者手机上的其他浏览器;而使用webview可以实现在app内显示加载网页,除此之外,webview还能用来加载本地资源,同时它还支持javascript和缓存等技术,其实WebView内部实现是采用渲染引擎来展示view的内容,提供网页前进后退,网页放大,缩小,搜索的。WebView中主要有如下几个常用的方法:
- loadUrl(String url)该方法可以用来加载网页和本地资源文件
- setWebClient:主要处理解析,渲染网页等浏览器做的事情
- setWebChromeClient:辅助WebView处理Javascript的对话框,网站图标,网站title,加载进度等
- setJavaScriptEnabled:设置对javascript的支持
- getSettings:返回一个WebSettings对象用于相关的设置,其中缓存就在其中设置
- goBack:返回操作
- canGoBack:判断webview是否能返回
二 使用WebView加载本地文件
<LinearLayout 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:orientation="vertical"
tools:context="com.example.webviewdemo.MainActivity" >
<WebView android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/webView"/>
</LinearLayout>
3.MainActivity.java
package com.example.webviewdemo;
import android.app.Activity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
public class MainActivity extends Activity {
private WebView webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
init();
}
//初始化和webview的相关的操作
private void init(){
webView = (WebView)findViewById(R.id.webView);
//加载本地资源
webView.loadUrl("file:///android_asset/test.html");
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
}
}
三 使用WebView加载网络资源
在这个例子里,用WebView来加载一个网页(http://xw.qq.com/),同时为什么用户体验在网页顶部加一个进度条来显示网页的加载速度和状态。需要注意的是在加载网络资源的时候要配置权限android.permission.INTERNET,否则无法加载网络资源。
1.布局文件
定义一个WebView标签和一个Progress标签用来显示网页加载速度和状态。
<LinearLayout 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:orientation="vertical"
tools:context="com.example.webviewdemo.MainActivity" >
<ProgressBar android:layout_width="match_parent"
android:layout_height="2dp"
android:id="@+id/progress"
android:max="100"
style="@android:style/Widget.ProgressBar.Horizontal"
android:progress="0"/>
<WebView android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/webView"/>
</LinearLayout>
2.配置权限
android.permission.INTERNET,在AndroidManifes.xml中加入如下代码即可:
<uses-permission android:name="android.permission.INTERNET"/>
3.MainActivity.java
package com.example.webviewdemo;
import android.app.Activity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
public class MainActivity extends Activity {
private ProgressBar progressBar;
private WebView webView;
private String Url = "http://xw.qq.com/";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
init();
}
//初始化和webview的相关的操作
private void init(){
//初始化组件
progressBar = (ProgressBar)findViewById(R.id.progress);
webView = (WebView)findViewById(R.id.webView);
//webview加载网页
webView.loadUrl(Url);
webView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// TODO Auto-generated method stub
webView.loadUrl(url);
return true;
}
});
WebSettings webSettings = webView.getSettings();
//设置javascript的支持
webSettings.setJavaScriptEnabled(true);
//WebView加载页面优先使用缓存加载
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
webView.setWebChromeClient(new WebChromeClient(){
@Override
public void onProgressChanged(WebView view, int newProgress) {
if (newProgress == 100) {
//加载完成
progressBar.setVisibility(View.INVISIBLE);
}else {
progressBar.setVisibility(View.VISIBLE);
if (progressBar == null) {
progressBar = (ProgressBar)findViewById(R.id.progress);
}
progressBar.setProgress(newProgress);
}
}
});
}
}
说明:
init方法:初始化和webview相关的操作
setWebViewClient:让网页在app内加载显示,返回true为在app内显示
setWebChromeClient:WebViewClient帮助WebView去处理一些页面控制和请求通知,这里的话,在这里为progress设置状态,当newProgress为100的时候说明网页加载完毕,为progress设置为不可见;不为100是说明网页还在加载中,为progress设置为可见,同时设置进度条刻度。
webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);优先使用缓存
webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);不使用缓存
4.结果
从动态图中可以看出,当我点击了NBA栏目后,顶部的进度条随着网页的加载在增加,这是当我点击返回按钮的时候,按常规来说应该返回之前的一个页面,但是现在点击后直接突出app。这是因为在这个例子中没有重写onKeyDown方法,所以为默认的退出app操作,那么下面重写onKeyDown方法,只需要在MainActivity中加入如下代码即可:
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_BACK) {
if (webView.canGoBack()) {
webView.goBack();
return true;
}else {
System.exit(0);
}
}
return super.onKeyDown(keyCode, event);
}
说明:
在该方法中对webView的状态做判断,当webView可以返回的时候,让webView执行返回操作,否则推出应用程序。
重写后的结果:
修改后的按返回按钮也能返回上次的浏览页面,同时进度条也能正确显示加载进度,图中的效果即使我们所需要的。