看板 Knuckles_note
作者 標題 [AndroidStudio] 加入 WebView 瀏覽網頁
時間 2015-12-15 Tue. 07:36:24
延續上一篇 [AndroidStudio] 點擊列表後進入新的頁面
在新的頁面取得文章網址後
就可以使用 WebView 將網頁顯示出來了
修改 manifests/AndroidManifest.xml
在 <application 這行上面加上
<uses-permission android:name="android.permission.INTERNET"/>
以開啟網路功能，如果之前加過就不用再加了修改 activity_text.xml
刪除原本用來顯示網址文字的 <TextView … />
改成
<WebView android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
修改 TextActivity.java
刪除用來顯示網址文字的成員變數 TextView urlTextView;
改為
WebView mWebView;
新增成員函數 initWebView()
private void initWebView(){
// 取得XML中的WebView
mWebView = (WebView) findViewById(R.id.webview);
// WebView的設定選項
WebSettings webSettings = mWebView.getSettings();
// Enable Javascript
webSettings.setJavaScriptEnabled(true);
// Enable LocalStorage
webSettings.setDomStorageEnabled(true);
// 要加setWebViewClient以避免點連結時跳出APP用瀏覽器開啟
mWebView.setWebViewClient(new WebViewClient());
// 要設定 WebChromeClient 才能支援 JS 的 Alert, Confirm
mWebView.setWebChromeClient(new WebChromeClient());
// API 19 以上可使用硬體加速
if (Build.VERSION.SDK_INT >= 19) {
mWebView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
mWebView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}
// 設定背景為黑色，避免載入網頁前顯示白色
mWebView.setBackgroundColor(Color.BLACK);
}
// 取得XML中的WebView
mWebView = (WebView) findViewById(R.id.webview);
// WebView的設定選項
WebSettings webSettings = mWebView.getSettings();
// Enable Javascript
webSettings.setJavaScriptEnabled(true);
// Enable LocalStorage
webSettings.setDomStorageEnabled(true);
// 要加setWebViewClient以避免點連結時跳出APP用瀏覽器開啟
mWebView.setWebViewClient(new WebViewClient());
// 要設定 WebChromeClient 才能支援 JS 的 Alert, Confirm
mWebView.setWebChromeClient(new WebChromeClient());
// API 19 以上可使用硬體加速
if (Build.VERSION.SDK_INT >= 19) {
mWebView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
mWebView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}
// 設定背景為黑色，避免載入網頁前顯示白色
mWebView.setBackgroundColor(Color.BLACK);
}
刪除 onCreate() 中用來顯示網址文字的這兩行
urlTextView = (TextView) findViewById(R.id.url_textview);
urlTextView.setText(url);
改為
initWebView();
// 載入網頁
mWebView.loadUrl(url);
// 載入網頁
mWebView.loadUrl(url);
執行結果
![[圖]](http://i.imgur.com/UiGDFEt.png)
加上 onBackPressed 事件 (點手機Home鍵旁的回上頁按鈕，不是APP左上角的回上層按鈕)
在 WebView 的網頁中點了超連結換頁後
點手機的上一頁按鈕後，使用 mWebView.goBack()，回到上一個網頁
@Override
public void onBackPressed() {
if(mWebView.canGoBack()) {
mWebView.goBack();
} else {
super.onBackPressed();
}
}
public void onBackPressed() {
if(mWebView.canGoBack()) {
mWebView.goBack();
} else {
super.onBackPressed();
}
}
○ 補充
若網站的API不是產生網址，而是使用JSON回傳HTML字串的話，可以改用 loadDataWithBaseURL
htmlString = response.optString("html",""); //取得HTML字串
mWebView.loadDataWithBaseURL(null, htmlString, "text/html", "utf-8", null);
mWebView.loadDataWithBaseURL(null, htmlString, "text/html", "utf-8", null);
若要加上重整與回上頁的按鈕，參考這篇
[AndroidStudio] WebView 加上導航按鈕 - KnucklesNote板 - Disp BBS
參考
http://developer.android.com/intl/zh-tw/guide/webapps/webview.html
https://developer.chrome.com/multidevice/webview/gettingstarted
□ 錯誤解決記錄
顯示 Javascript 錯誤訊息
若 Javascript 沒有執行，可能是執行過程出現錯誤中止了
可在 mWebView.setWebViewClient(new WebViewClient()); 下一行加上
mWebView.setWebChromeClient(new WebChromeClient());
這樣執行時在logcat就會顯示 E/Web Console: 的錯誤訊息了--
※ 作者: Knuckles 時間: 2015-12-15 07:36:24
※ 編輯: Knuckles 時間: 2017-10-16 02:31:00
※ 看板: KnucklesNote 文章推薦值: 0 目前人氣: 0 累積人氣: 2260
回列表(←)
分享