WebView的基本使用

時間 2019-11-21

標籤 webview 基本使用简体版

原文原文鏈接

1、WebView組件介紹
　一、什麼是WebView
　　1. WebView是一個瀏覽器組件，在Android 4.3系統及其如下，內部採用Webkit渲染引擎，在Android 4.4開始，採用chromium 渲染引擎來渲染View的內容。
　　2. Google對WebKit進行了封裝，提供了豐富的Java接口，其中最重要的即是android.webkit.WebView控件。
　　3. WebKit 是一個開源的瀏覽器引擎
二、WebView能作什麼？
　　1.WebView能加載顯示網頁、圖片等，能夠將其視爲一個瀏覽器
　　2.採用HTML設計軟件界面佈局，放入assets文件夾，用Html建立UI
　　三、權限
　　<uses-permission android:name="android.permission.INTERNET"/>
2、WebView加載網頁的兩種方式
一、loadUrl(String url)
　　loadUrl("http://www.163.com")　 loadUrl("file:///sdcard/test.html") loadUrl("file:///sdcard/test1.jpg")javascript

　　//加載本地的html頁面　　切忌：：：file後面是///html

　　loadUrl("file:///android_asset/test.htm");
　　loadUrl("http://192.168.1.109:2080/webview/abc.html");
　　loadUrl("javascript:show('"+ json +"')");java

二、loadData(String data,String mimeType,String encoding) /android

loadDataWithBaseURL(String baseUrl, String data, String mimeType, String encoding, String historyUrl);
　　data:HTML代碼
　　mimeType:Mime類型 text/html;
　　encoding:HTML代碼的編碼charset=utf-8
三、簡述WebView加載網頁的兩種方式?
　　1. 一種是加載Url的方式，包括網址、SD卡、assets目錄下的文件，以及調用JS等
　　2. 另外一種是加載Html代碼，可指定Mime類型、編碼方式等
3、WebView另一些經常使用方法
一、前進，判斷是否能夠前進一步
　　goForward()
　　canGoForward()
二、回退一步，判斷是否能夠回退一步
　　goBack() canGoBack()
三、判斷是否能夠前進或後退指定的次數(負數表示回退N次，正數表示前行N次) goBackOrForward(int steps)
　　canGoBackOrForward(steps)
4、WebView輔助類
一、WebSettings類概述：web

　　WebSettings和WebView都在同一個生命週期中存在，當WebView被銷燬後，若是再使用WebSettings則會拋出IllegalStateException異常數據庫

　　這個類主要負責WebView的狀態配置管理。當一個WebView第一次建立的時候，它會伴隨着有一個默認的設置，這個默認的設置就是WebSettings調用一次全部的getter方法。能夠經過WebView.getSettings獲取一個WebSettings對象，這個對象會跟WebView的生命週期一塊兒綁定，若是這個對象綁定的WebView銷燬了，再去WebSettings的方法時，就會爆出異常IllegalStateException。json

　　//設置支持JS
　　setting.setJavaScriptEnabled(true);
　　//打開頁面時，自適應屏幕
　　setting.setUseWideViewPort(true);
　　//設置視圖是否加載概覽模式的網頁
　　setting.setLoadWithOverviewMode(true);
　　//設置顯示縮放按鈕
　　setting.setBuiltInZoomControls(true);
　　//使頁面支持縮放
　　setting.setSupportZoom(true);
　　//不使用緩存
　　setting.setCacheMode(WebSettings.LOAD_NO_CACHE);
二、WebViewClient
　　1.主要幫助WebView處理各類通知、請求事件
　　2.shouldOverrideUrlLoading
例：彈出系統瀏覽器解決辦法例:重寫shouldOverrideUrlLoading方法在點擊連接時調用，返回false則使用當前的WebView加載連接，返回true則方法中代碼決定如何展現。
3.onPageStarted
　　例:能夠作攔截操做
　　例:這個事件就是開始載入頁面調用的，一般咱們能夠在這設定一個loading的頁面，告訴用戶程序在等待網絡響應（ProgressDialog）
4.onPageFinished
　　例:一個頁面載入完成，能夠關閉loading條（ProgressDialog）瀏覽器

經過WebView加載百度頁面，經過一個簡單的小Demo來實現緩存

　　第一步：配置清單文件　網絡

<uses-permission android:name="android.permission.INTERNET"/>
<!--6.0動態受權的問題-->
<uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS"/>

　　第二步:準備一個簡單的佈局

<WebView
    android:id="@+id/webView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"></WebView>

　　private WebView webView; 
　　private WebSettings webSettings;
　　private ProgressDialog pd;
　　private final int SDK_PERMISSION_REQUEST = 11;

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
　　　　//加載網頁，而且設置一些屬性
        initWebView();
        //對於6.0手機，獲取動態受權
        getPermissions();
    }

    private void initWebView() {
        webView = (WebView) findViewById(R.id.webView); //初始化控件
        String url = "http://www.baidu.com"; //初始化網頁
        
        webView.setWebViewClient(new WebViewClient(){
            @Override //返回false則使用當前的WebView加載連接
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                return false;
            }

            @Override //頁面打開時執行操做,顯示一個進度條
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
                if(pd==null){
                    pd = new ProgressDialog(MainActivity.this); //建立進度條
                }
                pd.setMessage("正在載入，請稍後..."); //提示信息
                pd.show(); //顯示進度條
            
                super.onPageStarted(view, url, favicon);
            }

            @Override //頁面關閉時執行操做
            public void onPageFinished(WebView view, String url) {
                if(pd!=null){
                    pd.cancel();//進度條取消顯示
                }
                super.onPageFinished(view, url);
            }
        });

        webSettings = webView.getSettings();
        webSettings.setJavaScriptEnabled(true); //支持js
        webSettings.setUseWideViewPort(true); //自適應屏幕 能夠任意比例縮放
        webSettings.setLoadWithOverviewMode(true);//設置網頁是否支持概覽模式
        webSettings.setBuiltInZoomControls(true); //設置縮放按鈕
        webSettings.setSupportZoom(true); //使頁面支持縮放
        webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE); //不支持緩存
        webView.loadUrl(url);
    }
    private void getPermissions() {
        //若是權限>=5.0,就須要動態受權
        if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.M){
            //準備一個集合
            ArrayList<String> permissions = new ArrayList<>();
            //若是讀取SD卡的權限不存在，就建立一個保存在集合裏面
            if(checkSelfPermission(READ_EXTERNAL_STORAGE)!= PackageManager.PERMISSION_GRANTED){
                permissions.add(READ_EXTERNAL_STORAGE);
            }

            if(permissions.size()>0){
                requestPermissions(permissions.toArray(new String[permissions.size()]),SDK_PERMISSION_REQUEST);
            }else {
                initWebView();
            }
        }else {
            initWebView();
        }
    }

    @Override //6.0動態受權
    public void onRequestPermissionsResult(int requestCode, @NonNull String[] permissions, @NonNull int[] grantResults) {
        super.onRequestPermissionsResult(requestCode, permissions, grantResults);
        switch (requestCode){
            case SDK_PERMISSION_REQUEST:
                if(grantResults.length>0 && grantResults[0] ==  PackageManager.PERMISSION_GRANTED){
                    //容許
                    Toast.makeText(this, "已受權", Toast.LENGTH_SHORT).show();
                }else {
                    //不容許
                    Toast.makeText(this, "拒絕受權", Toast.LENGTH_SHORT).show();
                }
                break;
        }
    }

    @Override //當點擊了返回鍵而且可以返回的時候
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if(keyCode==KeyEvent.KEYCODE_BACK && webView.canGoBack()){ //若是點擊了返回鍵而且webView可以返回
            webView.goBack();
            return true;
        }

//        //若是能返回而且可以一次性返回兩步的操做
//        if(keyCode ==  KeyEvent.KEYCODE_BACK && webView.canGoBackOrForward(-2)){
//            webView.goBackOrForward(-2);
//            return true;
//        }
        return super.onKeyDown(keyCode, event);
    }

WebChromeClient
　　1.論述WebChromeClient的做用
　　主要輔助WebView處理Javascript的對話框、網站圖標、網站title、加載進度，關閉webview等，常見的重寫方法有：onJsAlert、onJsConfirm、onJsPrompt、　　onReceivedIcon、onReceivedTitle、onProgressChanged、onCloseWindow
　　2.onJsAlert 參數只有一個,顯示警告框的信息;無返回值
　　3.onJsConfirm 參數只有一個.顯示提示框的信息.按肯定,返回true; 按取消返回false.
　　4.onJsPrompt on 參數有兩個, 第一個參數,顯示提示輸入框的信息.第二個參數,用於顯示輸入框的默認值.返回用戶輸入的值.
　　5.onReceivedIcon 注意必須先打開圖標數據庫，不然沒法獲取到頁面圖標
　　6.onReceivedTitle 得到網頁的標題，做爲應用程序的標題進行顯示
　　7.onProgressChanged 得到網頁的加載進度，顯示在TextView控件中（思考如何顯示在進度條中）
　　8.onCloseWindow 關閉網頁（WebView）

第一步：配置清單文件

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

第二步：佈局文件

activity_main.xml文件

<WebView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/webView"></WebView>

promptdialog.xml文件

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/tv"/>
<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/et"/>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
    <Button
        android:id="@+id/ok"
        android:text="肯定"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

    <Button
        android:id="@+id/cancel"
        android:text="取消"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>
</LinearLayout>



第三步：代碼實現

private WebView webView;    private WebSettings webSettings;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        webView = (WebView) findViewById(R.id.webView);//        String url = "http://192.168.15.103:8080/webview/alert.html";//        String url = "http://192.168.15.103:8080/webview/confrim.html";        　String url = "http://192.168.15.103:8080/webview/prompt.html";        webView.setWebChromeClient(new WebChromeClient(){            @Override            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {                AlertDialog.Builder builder = new AlertDialog.Builder(view.getContext());                builder.setTitle("Alert警示框")                        .setMessage(message)                        .setPositiveButton("肯定",null)                        .show();                result.confirm(); //點擊肯定，對話框關閉                return true;            }            @Override            public boolean onJsConfirm(WebView view, String url, String message, final JsResult result) {                AlertDialog.Builder builder = new AlertDialog.Builder(view.getContext());                builder.setTitle("confirm確認信息")                        .setMessage(message)                        .setPositiveButton("肯定", new DialogInterface.OnClickListener() {                            @Override                            public void onClick(DialogInterface dialogInterface, int i) {                                result.confirm();                            }                        })                        .setNeutralButton("取消", new DialogInterface.OnClickListener() {                            @Override                            public void onClick(DialogInterface dialogInterface, int i) {                                result.cancel();                            }                        })                        .show();                return true;            }            @Override            public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, final JsPromptResult result) {                final Dialog dialog = new Dialog(MainActivity.this);                dialog.setContentView(R.layout.promptdialog);                dialog.setTitle("prompt輸入信息");                TextView tv = (TextView) findViewById(R.id.tv);                final EditText et = (EditText) findViewById(R.id.et);                Button ok = (Button) dialog.findViewById(R.id.ok);                Button cancel = (Button) dialog.findViewById(R.id.cancel);                tv.setText(message);                et.setText(defaultValue);                ok.setOnClickListener(new View.OnClickListener() {//肯定                    @Override                    public void onClick(View view) {                        result.confirm(et.getText().toString());//將ediText裏的值傳遞過去                        dialog.cancel();                    }                });                cancel.setOnClickListener(new View.OnClickListener() {                    @Override                    public void onClick(View view) {                        result.cancel();                        dialog.cancel();                    }                });                dialog.setOnKeyListener(new DialogInterface.OnKeyListener() {                    @Override                    public boolean onKey(DialogInterface dialogInterface, int keyCode, KeyEvent keyEvent) {                        if(keyCode == KeyEvent.KEYCODE_BACK){                            result.cancel();                            dialog.cancel();                            return true;                        }                        return false;                    }                });                dialog.show();                return true;            }        });        webView.setWebViewClient(new WebViewClient(){                       @Override            public boolean shouldOverrideUrlLoading(WebView view, String url) {                return false;            }        });        webView.loadUrl(url);        webSettings = webView.getSettings();        webSettings.setJavaScriptEnabled(true); //支持js        webSettings.setUseWideViewPort(true); //自適應屏幕 任意比例縮放        webSettings.setUseWideViewPort(true); //設置視圖是否加載概覽模式的網頁 目的是一個屏幕能夠顯示這一頁全部的內容        webSettings.setBuiltInZoomControls(true); //顯示縮放比例按鈕        webSettings.setSupportZoom(true); //使頁面支持縮放        webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE); //不使用緩存 能夠方便修改軟件中錯誤的問題    }

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。