Android記錄24-WebView實現白天/夜間閱讀模式
阿新 • • 發佈：2017-07-22
sset etc 技術 pan 下載 Language tin view實現 oba
前言
本篇博客給大家分享一個WebView的使用案例。實現Android調用JavaScript代碼來控制白天/夜間模式。
關於WebView怎樣使用，官網有非常好的說明，Building Web Apps in WebView，小巫這裏就不多贅述。
實現思路
跟Native應用不一樣，我們能夠非常easy得實現調用系統API來達到，就是通過樣式設置主題。
假設我們的內容是html裏面的內容。怎樣來達到？首先載入html頁面肯定是要用到WebView的，通過loadUrl的方法能夠把html頁面顯示到webView，我們知道Android能夠與JavaScript進行交互。就是說能夠在JavaScript中調用Android的代碼，也能夠在Android中調用JavaScript代碼。所以就有了一個思路就是，通過Android調用Html頁面中的JavaScript代碼來控制頁面背景和字體樣式來達到切換白天/黑夜模式
怎樣實現
提供一個供測試的html代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd";>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script language=javascript>
function load_night()
{
document.bgColor="#000000"
var fontColor = document.getElementById("font" 載入html頁面
WebSettings settings = webView.getSettings();
// 設置javaScript可用
settings.setJavaScriptEnabled(true);
webView.loadUrl("file:///android_asset/01.html");Android調用javascript代碼
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.btn_nightmode:
webView.loadUrl("javascript:load_night()");
break;
case R.id.btn_lightmode:
webView.loadUrl("javascript:load_day()");
break;
default:
break;
}
}終於效果
完整代碼
package com.infzm.webview;
import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
public class MainActivity extends Activity implements OnClickListener{
private WebView webView;
private Button nightModeBtn;
private Button lightModeBtn;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = (WebView) this.findViewById(R.id.webview);
nightModeBtn = (Button) this.findViewById(R.id.btn_nightmode);
lightModeBtn = (Button) this.findViewById(R.id.btn_lightmode);
nightModeBtn.setOnClickListener(this);
lightModeBtn.setOnClickListener(this);
// webView.loadUrl("http://www.baidu.com");
WebSettings settings = webView.getSettings();
// 設置javaScript可用
settings.setJavaScriptEnabled(true);
// 綁定javaScript接口。能夠實如今javaScript中調用我們的Android代碼
// webView.addJavascriptInterface(new WebAppInterface(this), "Android");
// webView.setWebViewClient(new MyWebViewClient());
// 載入assets文件夾下的html頁面
webView.loadUrl("file:///android_asset/01.html");
}
/**
* 用於控制頁面導航
* @author wwj_748
*
*/
private class MyWebViewClient extends WebViewClient {
/**
* 當用於點擊鏈接，系統調用這種方法
*/
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
if (Uri.parse(url).getHost().equals("www.baidu.com")) {
// 這個是我的網頁。所以不要覆蓋。讓我的WebView來載入頁面
return false;
}
// 否則，這個鏈接不是我的站點頁面。因此啟用瀏覽器來處理urls
Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
startActivity(intent);
return true;
}
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
// 檢查是否為返回事件，假設有網頁歷史記錄
if (keyCode == KeyEvent.KEYCODE_BACK && webView.canGoBack()) {
webView.goBack();
return true;
}
// 假設不是返回鍵或沒有網頁瀏覽歷史，保持默認
// 系統行為（可能會退出該活動）
return super.onKeyDown(keyCode, event);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.btn_nightmode:
webView.loadUrl("javascript:load_night()");
break;
case R.id.btn_lightmode:
webView.loadUrl("javascript:load_day()");
break;
default:
break;
}
}
}
下載地址
http://download.csdn.net/detail/wwj_748/8554833
轉載請註明：IT_xiao小巫
博客地址：http://blog.csdn.net/wwj_748
移動開發狂熱者群：299402133
Android記錄24-WebView實現白天/夜間閱讀模式