WebView簡介（基本顯示篇）

本文編輯整理自：http://developer.51cto.com/art/201008/216488.htm
51CTO曾經獨家推薦過Android開發應用詳解的專題，本文希望通過本次對WebView組件的使用講解，可以讓各位瞭解到WebView組件的詳細使用：
一、網路內容
1、LoadUrl直接顯示網頁內容(單獨顯示網狀圖片)
比如： webView.loadUrl("http://www.google.com"); 
2、LoadData顯示中文網頁內容(含空格的處理)

webView.loadData(URLEncoder.encode(data, encoding),"text/html", "utf-8");
 
二、本地檔案內容
比如：webView.loadUrl("file:///android_asset/test.html");  
三、APK包內檔案
1、LoadUrl顯示APK中Html和圖片檔案 webView.loadUrl("file:///android_asset/test.html");    webView.loadUrl("file:///android_asset/icon.png");   對於APK本地檔案應該存放在其Android工程的assets 檔案中,url為file:///android_asset/開頭的形式，
比如webView.loadUrl("file:///android_asset/XX.html")， 四、使用loadDataWithBaseURL進行本機資料與網路檔案的混合顯示。我可以在本機資料中引用一些網路檔案，這就可以讓本機資料與網路檔案的混合顯示 。在引用檔案時，可以採用覺得URL，也可以使用相對URL。使用相對URL時，請採用loadDataWithBaseURL，以引用檔案的指明起始地址。
樣本1：                String baseURL="http://img6.ph.126.net";                String data="Here is a gorgeous girl <img src='hBiG96B8egigBULxUWcOpA==/109212290980771276.jpg'>";                webView.loadDataWithBaseURL(baseURL, data,"text/html",
 "utf-8", ""); 

運行結果見圖二。
注意：需要在AndroidManifest.xml檔案中添加許可權，否則會出現Web page not available錯誤。
  <uses-permission android:name="android.permission.INTERNET" />
res/layout/main.xml

Xml代碼

    < ?xml version="1.0" encoding="utf-8"?> 
     
    < LINEARLAYOUT android:layout_height="fill_parent" android:layout_width="fill_parent" android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android"> 
     
    < WEBVIEW android:layout_height="fill_parent" android:layout_width="fill_parent" android:id="@+id/webview" /> 
     
    < /LINEARLAYOUT> 
     
    < ?xml version="1.0" encoding="utf-8"?> 
     
    < LINEARLAYOUT android:layout_height="fill_parent" android:layout_width="fill_parent" android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android"> 
     
    < WEBVIEW android:layout_height="fill_parent" android:layout_width="fill_parent" android:id="@+id/webview" /> 
     
    < /LINEARLAYOUT> 
     
    Example_webview.java 

Java代碼

    package cn.coolworks;  
     
    import java.net.URLEncoder;  
     
    import android.app.Activity;  
     
    import android.os.Bundle;  
     
    import android.webkit.WebView;  
     
    public class Example_webview extends Activity {  
     
    WebView webView;  
     
    final String mimeType = "text/html";  
     
    final String encoding = "utf-8";  
     
    /** Called when the activity is first created. */  
     
    @Override  
     
    public void onCreate(Bundle savedInstanceState) {  
     
    super.onCreate(savedInstanceState);  
     
    setContentView(R.layout.main);  
     
    webView = (WebView) findViewById(R.id.webview);  
     
    webView.getSettings().setJavaScriptEnabled(true);  
     
    //webHtml();  
      
     
    //webImage(); 
     
    //localHtmlZh(); 
     
    //localHtmlBlankSpace(); 
     
    //localHtml(); 
     
    // localImage();  
     
    localHtmlImage();  
     
    }  
     
    /**  
     
    * 直接網頁顯示  
     
    */  
     
    private void webHtml() {  
     
    try {  
     
    webView.loadUrl("http://www.google.com");  
     
    } catch (Exception ex) {  
     
    ex.printStackTrace();  
     
    }  
     
    }  
     
    /**  
     
    * 直接網狀圖片顯示  
     
    */  
     
    private void webImage() {  
     
    try {  
     
    webView.loadUrl("http://www.gstatic.com/codesite/ph/images/code_small.png");  
     
    } catch (Exception ex) {  
     
    ex.printStackTrace();  
     
    }  
     
    }  
     
    /**  
     
    * 中文顯示  
     
    */  
     
    private void localHtmlZh() {  
     
    try {  
     
    String data = "測試含有 中文的Html資料";  
     
    // utf-8編碼處理(在SDK1.5模擬器和真實裝置上都將出現亂碼,SDK1.6上能正常顯示)  
     
    //webView.loadData(data, mimeType, encoding);  
     
    // 對資料進行編碼處理(SDK1.5版本)  
     
    webView.loadData(URLEncoder.encode(data, encoding), mimeType, encoding);  
     
    } catch (Exception ex) {  
     
    ex.printStackTrace();  
     
    }  
     
    }  
     
    /**  
     
    * 中文顯示(空格的處理)  
     
    */  
     
    private void localHtmlBlankSpace() {  
     
    try {  
     
    String data = " 測試含有空格的Html資料 ";  
     
    // 不對空格做處理  
     
    webView.loadData(URLEncoder.encode(data, encoding), mimeType,  encoding);  
     
    //webView.loadData(data, mimeType, encoding);  
     
    // 對空格做處理(在SDK1.5版本中)  
     
    webView.loadData(URLEncoder.encode(data, encoding).replaceAll(   "\+", " "), mimeType, encoding);  
     
    } catch (Exception ex) {  
     
    ex.printStackTrace();  
     
    }  
     
    }  
     
    /**  
     
    * 顯示本地圖片檔案  
     
    */  
     
    private void localImage() {  
     
    try {  
     
    // 本地檔案處理(如果檔案名稱中有空格需要用+來替代)  
     
    webView.loadUrl("file:///android_asset/icon.png");  
     
    } catch (Exception ex) {  
     
    ex.printStackTrace();  
     
    }  
     
    }  
     
    /**  
     
    * 顯示本地網頁檔案  
     
    */  
     
    private void localHtml() {  
     
    try {  
     
    // 本地檔案處理(如果檔案名稱中有空格需要用+來替代)  
     
    webView.loadUrl("file:///android_asset/test.html");  
     
    } catch (Exception ex) {  
     
    ex.printStackTrace();  
     
    }  
     
    }  
     
    /**  
     
    * 顯示本地圖片和文字混合的Html內容  
     
    */  
     
    private void localHtmlImage() {  
     
    try {  
     
    String data = "測試本地圖片和文字混合顯示,這是APK裡的圖片";  
     
    // SDK1.5本地檔案處理(不能顯示圖片)  
     
    // webView.loadData(URLEncoder.encode(data, encoding), mimeType,  
     
    // encoding);  
     
    // SDK1.6及以後版本  
     
    // webView.loadData(data, mimeType, encoding);  
     
    // 本地檔案處理(能顯示圖片)  
     
    webView.loadDataWithBaseURL("about:blank", data, mimeType, encoding, "");  
     
    } catch (Exception ex) {  
     
    ex.printStackTrace();  
     
    }  
     
    }  
     
    } 

這就是WebView組件的使用詳解，如果您對WebView組件及Android開發有什麼新的使用心得可以發Email：zhousn@51cto.com，51CTO將與您一起分享！圖2：