Android與WebView(網頁)的使用以及交互

首先,Android上的WebView控件可以實現顯示兩種類型的網頁,第一種是網絡網頁(比如百度、各大網站等…),第二種是鏈接本地的網頁(HTML文件)。本篇文章主要講Android的WebView控件怎麼鏈接上這兩種網頁,以及Android與本地網頁的交互!

效果圖先行,這裏演示了本地HTML 和 網絡網頁的一些交互

在這裏插入圖片描述

首先,讓網頁或者HTML文件顯示在你的APP上

  1. 在你的XML佈局頁面添加一個WebView,如下:

    <?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/wb"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    
    </LinearLayout>
    
  2. 在你的JAVA後臺聲明控件,然後調用WebView的 **.loadUrl();** 方法設置URL

  3. 如果調用的是本地的HTML文件,則需要先在項目中生成assets目錄用於存放HTML文件,具體操作如下:
    在這裏插入圖片描述
    assets目錄創建好了以後,將你的本地HTML文件複製進去就行了!

    1. 如果調用的是網絡網址,只需要將網址整個複製下來即可!(我這裏是CSDN的主頁)

    2. 代碼如下:

      這裏需要注意的是本地HTML的地址file:///android_asset/xxx.html

            //本地HTML文件
            String urlhtml = "file:///android_asset/myhtml.html";
    
            //網站URL地址
            String url="https://so.csdn.net/so/";
    
            mWb.loadUrl(url);
    
    1. 當然,僅此兩行代碼是沒法達到效果圖那樣的效果的!

    2. 下面獻上更多相關代碼:*這裏需要注意的是file:///android_asset/id*這裏的 id 和你在HTML中超鏈接的id一致

              //適配屏幕
              mWb.getSettings().setUseWideViewPort(true);
              //添加JS支持
              mWb.getSettings().setJavaScriptEnabled(true);
              //網頁加載進度監聽
              mWb.setWebChromeClient(new WebChromeClient() {
                  @Override
                  public void onProgressChanged(WebView view, int newProgress) {
                      super.onProgressChanged(view, newProgress);
                     //這裏你可以選擇在佈局文件webview的上面加一個ProgressBar
                     //然後調用setProgress();方法傳入 newProgress
                  }
              });
              //重寫shouldOverrideUrlLoading方法 以實現和按鈕的交互
              mWb.setWebViewClient(new WebViewClient() {
                  @Override
                  public boolean shouldOverrideUrlLoading(WebView view, String url) {
                      //這裏的 button 就是HTML中的 <a href="button">
                      if (url.equals("file:///android_asset/button")) {
                          showToast("點擊了一下Android");
                      }
                      return true;
                  }
              });
      
      1. 當然這裏把我的HTML代碼也獻上,防止有些不懂HTML編寫的朋友犯難!(我自己也不太熟練HTML編寫)

        <html>
        <head>
            <meta charset="UTF-8">
        </head>
        <body>
        這裏是本地HTML網頁<br>
        開啓學習HTML之旅
        </body>
        <a href="button">
            <input value="確定" type="button">
        </a>
        </html>
        

        最後如果有朋友有疑問的,可以評論區留言!我會第一時間盡我所能答覆!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章