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