1. 程式人生 > >解決Android的Webview載入頁面空白問題

解決Android的Webview載入頁面空白問題

通過webview載入百度地圖開發的h5頁面時,出現了頁面空白的問題。

出現這問題通過下面兩個設定能解決大部分的問題。

mWebSettings.setJavaScriptEnabled(true);//是否允許JavaScript指令碼執行,預設為false
mWebSettings.setDomStorageEnabled(true);//開啟本地DOM儲存

如果還不能解決的話通過下面的設定,找到所需要的進行設定。不行的話就全部複製過去。

mWebSettings = mWebview.getSettings();
        mWebSettings.setJavaScriptCanOpenWindowsAutomatically(true);//設定js可以直接開啟視窗,如window.open(),預設為false
        mWebSettings.setJavaScriptEnabled(true);//是否允許JavaScript指令碼執行,預設為false。設定true時,會提醒可能造成XSS漏洞
        mWebSettings.setSupportZoom(true);//是否可以縮放,預設true
        mWebSettings.setBuiltInZoomControls(true);//是否顯示縮放按鈕,預設false
        mWebSettings.setUseWideViewPort(true);//設定此屬性,可任意比例縮放。大檢視模式
        mWebSettings.setLoadWithOverviewMode(true);//和setUseWideViewPort(true)一起解決網頁自適應問題
        mWebSettings.setAppCacheEnabled(true);//是否使用快取
        mWebSettings.setDomStorageEnabled(true);//開啟本地DOM儲存
        mWebSettings.setLoadsImagesAutomatically(true); // 載入圖片
        mWebSettings.setMediaPlaybackRequiresUserGesture(false);//播放音訊,多媒體需要使用者手動?設定為false為可自動播放

下面是完整的Android使用webview的程式碼。

public class MainActivity extends AppCompatActivity {
    WebView mWebview;
    WebSettings mWebSettings;
    TextView beginLoading,endLoading,loading,mtitle;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //取消狀態列
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.activity_main);


        mWebview = (WebView) findViewById(R.id.webView1);


        mWebSettings = mWebview.getSettings();
        mWebSettings.setJavaScriptCanOpenWindowsAutomatically(true);//設定js可以直接開啟視窗,如window.open(),預設為false
        mWebSettings.setJavaScriptEnabled(true);//是否允許JavaScript指令碼執行,預設為false。設定true時,會提醒可能造成XSS漏洞
        mWebSettings.setSupportZoom(true);//是否可以縮放,預設true
        mWebSettings.setBuiltInZoomControls(true);//是否顯示縮放按鈕,預設false
        mWebSettings.setUseWideViewPort(true);//設定此屬性,可任意比例縮放。大檢視模式
        mWebSettings.setLoadWithOverviewMode(true);//和setUseWideViewPort(true)一起解決網頁自適應問題
        mWebSettings.setAppCacheEnabled(true);//是否使用快取
        mWebSettings.setDomStorageEnabled(true);//開啟本地DOM儲存
        mWebSettings.setLoadsImagesAutomatically(true); // 載入圖片
        mWebSettings.setMediaPlaybackRequiresUserGesture(false);//播放音訊,多媒體需要使用者手動?設定為false為可自動播放

        mWebview.loadUrl("http://10.11.11.137:8080/smart-airport/car/index.html");
        //設定不用系統瀏覽器開啟,直接顯示在當前Webview
        mWebview.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });

    }

    //點選返回上一頁面而不是退出瀏覽器
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK && mWebview.canGoBack()) {
            mWebview.goBack();
            return true;
        }

        return super.onKeyDown(keyCode, event);
    }

    //銷燬Webview
    @Override
    protected void onDestroy() {
        if (mWebview != null) {
            mWebview.loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
            mWebview.clearHistory();

            ((ViewGroup) mWebview.getParent()).removeView(mWebview);
            mWebview.destroy();
            mWebview = null;
        }
        super.onDestroy();
    }
}
<!--顯示網頁區域-->
    <WebView
        android:id="@+id/webView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginTop="0dp" />

只需要把   mWebview.loadUrl("http://10.11.11.137:8080/smart-airport/car/index.html");

中的網址改成自己的就可以了。