Search code examples
javaandroidandroid-studiowebviewandroid-webview

How to resolve the white Screen of WebView?

I'm using the below code to populate my WebView with local html files, but it appears fine in some device but recently I noticed in some Device like Colors X114, the WebView appears fine for one Second and then everything disappears and white blank screen appears.

The Code:

package com.nepalpolice.mnemonics;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v7.app.AppCompatActivity;
import android.view.KeyEvent;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.EditText;
import android.widget.LinearLayout;


/**
 * Created by Sagar on 2017/09/23. yo chai menupage ko Fragments ko lagi
 */

public class Homepage extends Fragment {

    WebView myWebView;
    private LinearLayout container;
    private Button nextButton, closeButton;
    private EditText findBox;


    public Homepage() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View rootView = inflater.inflate(R.layout.fragment_homepage, container,  false);


        String url = getArguments().getString("url");


        myWebView=(WebView)rootView.findViewById(R.id.webview);
        myWebView.getSettings().setBuiltInZoomControls(true);

        myWebView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
        myWebView.getSettings().setLoadsImagesAutomatically(true);
        myWebView.getSettings().setJavaScriptEnabled(true);

        myWebView.getSettings().setBuiltInZoomControls(true);

        myWebView.setInitialScale(1);
        myWebView.getSettings().setLoadWithOverviewMode(true);
        myWebView.getSettings().setUseWideViewPort(true);

        WebSettings webSettings = myWebView.getSettings();

        myWebView.loadUrl(url);


        return rootView;


    }

    public static String changedHeaderHtml(String htmlText) {

        String head = "<head><meta name=\"viewport\" content=\"width=device-width, user-scalable=yes\" /></head>";

        String closedTag = "</body></html>";
        String changeFontHtml = head + htmlText + closedTag;
        return changeFontHtml;

    }
}

and this is how it appears or should appears

enter image description here

But how it appears in some Device.

enter image description here

and I'm passing the url as string as below

  args3.putString("url1", "file:///android_asset/b/dbpm.html");
Solution

  • Most likely you've faced the issue with View Layer Type. Try this code:

    if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    webSettings.setMixedContentMode(0);
    webView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
    webView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
    webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

    And try also to set hardware acceleration in Manifest:

    android:hardwareAccelerated="true"

    Please refer this link for more details.