安卓WebView的使用以及原生和h5的交互

導語:

WebView: 就是一個用來展示網(wǎng)頁的視圖。在工作中或多或少的都有使用,最多的就是加載App中的活動頁。目前接手的一個項目中,大量使用了WebView,還有不少Js和安卓原生的交互。這里就在使用中記錄下其基本使用和遇到的問題。

一、使用步驟

  1. 配置訪問網(wǎng)絡的權限

    <uses-permission android:name="android.permission.INTERNET"/>
    
  2. 實例化WebView,設置要訪問的頁面

    webView = (WebView) findViewById(R.id.webView);      //實例化WebView
    webView.loadUrl("https://www.hao123.com/");          //加載網(wǎng)絡頁面
    webView.loadUrl("file:///android_asset/index.html"); //加載本地頁面,頁面放在項目assets目錄下
    
  3. 應用內(nèi)打開頁面

    WebSettings webSettings = mWebView.getSettings();
    /**在App內(nèi)部打開頁面  **/
    mWebView.setWebViewClient(new WebViewClient());
    

    經(jīng)過以上三步,便可以在應用中使用WebView加載網(wǎng)頁了

  4. 常用參數(shù)設置

//網(wǎng)頁適配手機屏幕,以顯示完全
webSettings.setUseWideViewPort(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);

//支持手勢縮放,并且隱藏丑丑的縮放按鈕
webSettings.setSupportZoom(true);
webSettings.setBuiltInZoomControls(true);
webSettings.setDisplayZoomControls(false);

?

二、JavaScript調(diào)用安卓方法

  1. 如果我們訪問的頁面中有JavaScript,在初始化時,設置WebView支持JavaScript

    WebSettings webSettings = mWebView.getSettings();
    webSettings.setJavaScriptEnabled(true);
    
  2. 然后創(chuàng)建一個JavaScript接口,可以讓JavaScript和安卓交互。JavaScript便可以調(diào)用安卓本地的方法,執(zhí)行我們想要的操作

2.1 創(chuàng)建接口:

    private class TestJavaScriptInterface {

           @JavascriptInterface
           public void getUserInfo() {
               Toast.makeText(context, "點擊", Toast.LENGTH_LONG).show();

           }
       }    

? 2.2 為JavaScript注入這個接口

//第一個參數(shù):android和js交互的接口函數(shù)
//第二個參數(shù):android為橋接對象可隨意設置
mWebView.addJavascriptInterface(new TestJavaScriptInterface(), "android");

2.3 JavaScript代碼:

<script>
function onClick(){
    window.android.getUserInfo();
}
</script>

如下圖,點擊網(wǎng)頁上的按鈕后,調(diào)用了我們本地的方法并且彈出了Toast。證明JavaScript調(diào)用本地方法成功了。

微信截圖_20170720114550.png
最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容