Android中WebView載入Html中的圖片新增點選事件
阿新 • • 發佈：2019-01-04
基本的思路：
（1）WebView來載入HTML。
（2）向HTML中注入JavaScript，利用JavaScript來呼叫Android中的方法（執行一些跳轉的操作等等）。
首先你必須有一個HTML或者是一個地址，或者是存到本地的一個檔案。我這裡使用的是存到本地的HTML檔案。
index.html。內容是：
<html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head><body>標題<img src='http://uploadservice.zujuan.com/Upload/2014-11/12/b74bc316-03e0-4727-9824-d189f1690783/paper.files/image005.png' style='vertical-align:middle;' /></body><ml>
他的位置如下：
下面是佈局的程式碼：
接下來是MainActivity.java:<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <WebView android:id="@+id/web_view" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" /> </LinearLayout>
package com.panpass.main; import android.annotation.SuppressLint; import android.app.Activity; import android.os.Bundle; import android.webkit.WebChromeClient; import android.webkit.WebSettings; import android.webkit.WebView; import android.webkit.WebViewClient; import android.widget.Toast; import com.example.day_2014_11_25_htmlimgclick.R; public class MainActivity extends Activity { private WebView mWebView; @SuppressLint("SetJavaScriptEnabled") @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main_activity); mWebView = (WebView) findViewById(R.id.web_view); mWebView.getSettings().setJavaScriptEnabled(true); mWebView.getSettings().setBuiltInZoomControls(false); mWebView.getSettings().setPluginsEnabled(true); mWebView.getSettings().setPluginState(WebSettings.PluginState.ON); // 特別要注意這行程式碼,意思是在js中條用android中的第一個引數的實際名字。這裡第一個引數是this。 //也就是本類的例項。imgelistener是本類的例項在js中的名字。 // 也就是說你要在js中呼叫MainActivity這個類中的方法的話就必須給MainActivity這個類在js中的名字， //這樣你才能在js中呼叫android中的類中的方法。 mWebView.addJavascriptInterface(this, "imagelistner"); mWebView.loadUrl("file:///android_asset/index.html"); mWebView.setWebViewClient(new WebViewClient() { @Override public void onPageFinished(WebView view, String url) { mWebView.loadUrl("javascript:(function(){" + "var objs = document.getElementsByTagName(\"img\"); " + "for(var i=0;i<objs.length;i++) " + "{" + " objs[i].onclick=function() " + " { " + " window.imagelistner.openImage(this.src); " + " } " + "}" + "})()"); } @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { return super.shouldOverrideUrlLoading(view, url); } }); } // 下面的@SuppressLint("JavascriptInterface")最好加上。防止在某些版本中js和java的互動不支援。 @SuppressLint("JavascriptInterface") public void openImage(String img) { Toast.makeText(this, img, Toast.LENGTH_SHORT).show(); } }
OK最後是許可權：
<uses-permission android:name="android.permission.INTERNET"/>
就是如此的簡單。