WebView加載本地Html文件並實現點擊效果

Webview是用來與前端交互的紐，能夠加載本地Html文件，和網頁並實現交互的功能。

WebView經過WebSetting可使用Android原生的JavascriptInterface來進行js和java的通訊。

加載本地文件：webView.loadUrl("file:///android_asset/xxx.html");

加載網頁：webView.loadUrl("http://baidu.com");

案例：（WebView加載本地Html並實現與JS通訊） 效果圖：

       

 

/***
 * 
 * WebView加載本地文件和實現JS點擊效果
 * 
 * @author zq
 *
 */
public class MainActivity extends Activity {

	private WebView webView;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		  setContentView(R.layout.activity_main);
          initView();
	
	}
	private void initView() {
		// TODO Auto-generated method stub
		  // 獲取webview控件
			webView = (WebView) findViewById(R.id.activity_webview);
			// 獲取WebView的設置
			WebSettings webSettings = webView.getSettings();
			// 將JavaScript設置爲可用，這一句話是必須的，否則所作一切都是徒勞的
			webSettings.setJavaScriptEnabled(true);
			// 給webview添加JavaScript接口
			webView.addJavascriptInterface(new JsInterface(), "control");
			// 經過webview加載html頁面
			webView.loadUrl("file:///android_asset/l.html");
	}

	public class JsInterface {
		@JavascriptInterface
		public void showToast(String toast) {
			Toast.makeText(MainActivity.this, toast, Toast.LENGTH_SHORT).show();
		}

		public void log(final String msg) {
			webView.post(new Runnable() {

				@Override
				public void run() {
					webView.loadUrl("javascript log(" + "'" + msg + "'" + ")");

				}
			});
		}
	}

}

JS文件

function showToast(toast) {       
	  javascript:control.showToast(toast);
     }
  function log(msg) {
	  consolse.log(msg);
    }

AndroidManifest.xml 中加權限

<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

代碼未徹底給出，要源碼直接下載便可

 

源碼點擊下載：https://github.com/DickyQie/android-webview