Android元件(WebView) ─ 內崁網路瀏覽器、和webView做溝通

前言：

讓網頁上的網路像是你自己的App一樣！

內崁式，很多公司因為懶得寫雙平台，會直接使用Mobile Web的方式直接在雙平台IOS和Android內崁WebView，但因為是內崁的，會造成使用者在使用上不流暢！
會有不太好的使用者體驗。
這邊用臉書網址當作示範

---

重點程式碼：

想看webView有什麼東西可以用可以查原始文件內的Public mothed
https://developer.android.com/reference/android/webkit/WebView.html

可以直接複製貼在OnCreate內

//1、先設定元件findViewById  WebView  mWebView = (WebView) findViewById(R.id.webview); //2、這是設定內崁，沒有這一行系統會直接呼叫出瀏覽器開啟你指定的網址 mWebView.setWebViewClient(mWebViewClient); //3、Setting對WebView做設定，以下是我常用的WebView設定，我就直接複製上來了  WebSettings websettings = mWebView.getSettings();        websettings.setSupportZoom(true); //啟用內置的縮放功能        websettings.setBuiltInZoomControls(true);//啟用內置的縮放功能        websettings.setDisplayZoomControls(false);//讓縮放功能的Button消失        websettings.setJavaScriptEnabled(true);//使用JavaScript        websettings.setAppCacheEnabled(true);//設置啟動緩存        websettings.setSaveFormData(true);//設置儲存        websettings.setAllowFileAccess(true);//啟用webview訪問文件數據        websettings.setDomStorageEnabled(true);//啟用儲存數據 //4、loadUrl讀取網頁String mWebView.loadUrl("http://nikeru8.blogspot.tw/");

很簡單吧！

---

完整程式碼：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.chat.a015865.webview.MainActivity">

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

MainActivity.java

public class MainActivity extends AppCompatActivity {

    private WebView mWebView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mWebView=(WebView)findViewById(R.id.webview_show);
        WebSettings websettings = mWebView.getSettings();
        websettings.setSupportZoom(true);
        websettings.setBuiltInZoomControls(true);
        websettings.setDisplayZoomControls(false);
        websettings.setJavaScriptEnabled(true);
        websettings.setAppCacheEnabled(true);
        websettings.setSaveFormData(true);
        websettings.setAllowFileAccess(true);
        websettings.setDomStorageEnabled(true);
        mWebView.setWebViewClient(new WebViewClient());

        mWebView.loadUrl("http://nikeru8.blogspot.tw/");
    }
}

需要注意的部分：

loadUrl內的網址不可以是：www.google.com   
請給https://www.google.com.tw/

---

 （補充：2017/09/15）兩件事情

一、 網頁沒彈出應該彈出的Dialog?

webView.setWebChromeClient(new WebChromeClient());

如果你的webView裡面有個按鈕點下去應該彈出網頁那種Dialog 。但是消失了！？
這行可以救你。

二、如何和webView做溝通？

 WebViewClient mWebViewClient = new WebViewClient() {

        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            Log.d("CHECK URL", "url= " + url);
            
            return true;
        }

        @Override
        public void onPageFinished(WebView view, String url) {
            // TODO Auto-generated method stub
            super.onPageFinished(view, url);
        }
    };
 

在shouldOverrideUrlLoading內的url是你現在webView的網址
你可以使用string.contains來抓取網址內的關鍵字。
舉個例子在shouldOverrideUrlLoading內，使用url如果url內有Login的字眼，可以直接跳轉到你自己App內的登入頁面
登入完成後，在使用onActivityResult和webview做溝通。

if (url.contains("Login")){
    //TODO  轉到你自己寫的登入頁面}

三、開啟facebook live的方式

http://nikeru8.blogspot.tw/2017/09/androidwebview-webviewufacebook.html

---

Demo:

https://drive.google.com/open?id=0Byk75IYx-dKXVWJkQnlSSUp5VDQ