WebView組件本身就是一個瀏覽器實現，Android5.0增強WebView基於Chromium M37，直接支援WebRTC、WebAudio、WebGL。開發人員可以直接在WebView中使用彙總（Polymer）和Material設計。
一.WebView瀏覽網頁（載入線上URL）
WebView提供了很多方法執行瀏覽器操作，常用方法如下：
void goBack()：後退
void goForward()：前進。
void goBackOrForward(int step)：step為正表示前進，step為負表示後退。
void loadUrl(String url)：載入指定URL對應的網頁。
boolean zoomIn()：放大網頁。
boolean zoomOut()：縮小網頁。
執行個體：迷你瀏覽器
該執行個體包含兩個介面，第一個介面包括輸入網址和開啟網址，第二個介面包含一個WebView，用於顯示第一個介面輸入的URL對應的介面。程式碼如下：
第一個介面
public class MainActivity extends AppCompatActivity {private EditText mEditUrl;private Button mBtnOpen;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mEditUrl = (EditText) findViewById(R.id.edit_url);mBtnOpen = (Button) findViewById(R.id.btn_open);mBtnOpen.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {Intent intent = new Intent(MainActivity.this, WebViewActivity.class);String url = mEditUrl.getText().toString();intent.putExtra("url", url);startActivity(intent);}});}}
這個介面很簡單，一個輸入框，一個按鈕，分別用於輸入網址和開啟WebView。
第二個介面
public class WebViewActivity extends AppCompatActivity {private WebView mWebView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_web_view);mWebView = (WebView) findViewById(R.id.web_view);Intent intent = getIntent();String url = intent.getStringExtra("url");mWebView.loadUrl(url);mWebView.getSettings().setJavaScriptEnabled(true);mWebView.setWebViewClient(new WebViewClient(){});}@Overridepublic void onBackPressed() {if (mWebView != null && mWebView.canGoBack()){mWebView.goBack();}else {super.onBackPressed();}}}
這段代碼調用WebView的loadUrl(String url)方法載入、顯示該URL對應的網頁，並設定使其支援JavaScript。如果開啟WebView過程中跳轉到瀏覽器，則通過設定WebViewClient來是其在WebView中顯示。
並重寫了onBackPressed()方法，當WebView不為空白且WebView可以回退時，返回上一個WebView介面，而不是直接回退到上一個Activity。
由於該應用需要訪問互連網，所以需要在AndroidManifest.xml中配置：
<uses-permission android:name="android.permission.INTERNET"/>
該執行個體的效果圖如下：
二.WebView載入HTML代碼
WebView提供了一個loadData(String data, String mimeType, String encoding)方法，該方法可用於載入並顯示HTML代碼，但該方法會發生亂碼。
WebView還提供了一個loadDataWithBaseURL(String baseUrl, String data, String mimeType, String encoding, String historyUrl)方法，該方法是loadData(String data, String mimeType, String encoding)方法的增強版，不會產生亂碼。該方法的幾個參數說明：
data：指定要載入的HTML代碼。
mimeType：指定HTML的MIME類型，對於HTML可指定為text/html。
encoding：指定HTML代碼編碼所用的字元集，比如指定為GBK。
WebView載入HTML代碼：
public class MainActivity extends AppCompatActivity {private WebView mShowWebView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mShowWebView = (WebView) findViewById(R.id.show_web_view);StringBuilder sb = new StringBuilder();//拼接一段HTML代碼sb.append("<html>");sb.append("<head>");sb.append("<title> 歡迎您 </title>");sb.append("</head>");sb.append("<body>");sb.append("<h2> 歡迎您訪問<a href = \"http:www.baicu.com\">" + "百度一下</a></h2>");sb.append("</body>");sb.append("</html");//載入並顯示HTML代碼mShowWebView.loadDataWithBaseURL(null, sb.toString(), "text/html", "utf-8", null);}}
該執行個體運行效果如下：
三.WebView中的JavaScript調用Android方法
在WebView中調用Android方法需要三步：
調用WebView關聯的WebSettings的setJavaScriptEnabled(true)啟用JavaScript調用功能。
調用WebView的addJavaScriptInterface(Object object, String name)方法將object對象暴露給JavaScript對象。
在JavaScript指令碼中通過剛才暴露的name對象調用Android方法。
寫一個在JavaScript中調用Android方法的執行個體，該執行個體介面包含一個WebView組件，用於顯示HTML頁面。Activity代碼如下：
public class MainActivity extends AppCompatActivity {private WebView mWebView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mWebView = (WebView) findViewById(R.id.web_view);//使用file協議載入本地assets目錄下的HTML頁面mWebView.loadUrl("file:///android_asset/test.html");//擷取WebView的設定對象WebSettings webSettings = mWebView.getSettings();//開啟JavaScript調用webSettings.setJavaScriptEnabled(true);//將MyObject對象暴露給JavaScript對象mWebView.addJavascriptInterface(new MyObject(this), "myObj");}}
在上面代碼中開啟了JavaScript調用Android方法的功能，並將Android應用中的MyObject對象暴露給JavaScript指令碼，暴露成JavaScript指令碼中名為myObj的對象。
MyObject代碼如下：
public class MyObject {private Context context;public MyObject(Context context) {this.context = context;}//該方法將會暴露給JavaScript指令碼調用@JavascriptInterfacepublic void showToast(String name) {Toast.makeText(context, name + "，您好！", Toast.LENGTH_SHORT).show();}//該方法將會暴露給JavaScript指令碼調用@JavascriptInterfacepublic void showList() {//顯示一個普通的列表對話方塊new AlertDialog.Builder(context).setTitle("圖書列表").setIcon(R.mipmap.ic_launcher).setItems(new String[]{"Head First Android", "Head First Java", "Thinking in Java"}, null).setPositiveButton("確定", null).create().show();}}
MyObject中包含了兩個方法，showToast()和showList()方法，且這兩個方法使用了@JavascriptInterface修飾，使得這兩個方法會暴露給JavaScript指令碼，從而允許JavaScript指令碼通過myObj來調用這兩個方法。HTML頁面代碼如下：
<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"/><title> Js調用Android</title></head><body><!-- 注意此處的myObj是Android暴露出來的對象--><input type="button" value="打招呼"onclick="myObj.showToast('Android');"/><input type="button" value="圖書列表"onclick="myObj.showList();"/></body></html>
當使用者點擊頁面上的兩個按鈕時，該頁面的JavaScript指令碼會通過myObj調用Android方法。
運行該執行個體，點擊第一個按鈕，效果圖如下：
點擊第二個按鈕，效果圖如下：
以上所述是小編給大家介紹的Android WebView 應用介面開發教程，希望對大家有所協助，如果大家有任何疑問請給我留言，小編會及時回複大家的。在此也非常感謝大家對雲棲社區網站的支援！
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
