How can I show a custom "webpage not available" page in Android WebView?

Question

I'm out to do something when no connection is available page/alert in WebView (eg load a local html page or alert). I've to play with Prevent WebView from displaying "web page not available" but without any success. Any suggestions would be appreciated.

Answer 1

It all came down to simply showing an AlertDialog from onReceivedError:

 @Override
 public void onReceivedError(WebView webView, int errorCode, String description, String failingUrl) {
                    //Clearing the WebView
                    try {
                        webView.stopLoading();
                    } catch (Exception e) {
                    }
                    try {
                        webView.clearView();
                    } catch (Exception e) {
                    }
                    if (webView.canGoBack()) {
                        webView.goBack();
                    }
                    webView.loadUrl("about:blank");

                    //Showing and creating an alet dialog
                    AlertDialog alertDialog = new AlertDialog.Builder(youractivity.this).create();
                    alertDialog.setTitle("Error");
                    alertDialog.setMessage("No internet connection was found!");
                    alertDialog.setButton("Again", new DialogInterface.OnClickListener() {
                       public void onClick(DialogInterface dialog, int which) {
                           finish();
                           startActivity(getIntent());
                       }
                    });

                    alertDialog.show();

                    //Don't forget to call supper!
                    super.onReceivedError(webView, errorCode, description, failingUrl);
                }

If you're new to WebView, you'll be looking to implement onReceivedError like this:

mWebView.setWebViewClient(new WebViewClient() {
    public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
        //Code here
    }
});

Answer 2

The above code gives me two deprecation warnings, so I would suggest modifying it as follows. This goes in the activity that contains the WebView component:

    myWebView.setWebViewClient(new WebViewClient() {
        public void onReceivedError(WebView webView, int errorCode, String description, String failingUrl) {
            try {
                webView.stopLoading();
            } catch (Exception e) {
            }

            if (webView.canGoBack()) {
                webView.goBack();
            }

            webView.loadUrl("about:blank");
            AlertDialog alertDialog = new AlertDialog.Builder(MainActivity.this).create();
            alertDialog.setTitle("Error");
            alertDialog.setMessage("Cannot connect to the R2R Server. Check your internet connection and try again.");
            alertDialog.setButton(DialogInterface.BUTTON_POSITIVE, "Try Again", new DialogInterface.OnClickListener() {
                public void onClick(DialogInterface dialog, int which) {
                    finish();
                    startActivity(getIntent());
                }
            });

            alertDialog.show();
            super.onReceivedError(webView, errorCode, description, failingUrl);
        }
    });

Answer 3

    @Override 
    public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
        super.onReceivedError(view, errorCode, description, failingUrl);

// declare a text view in your xml
                sample_TextView.setText(R.string.no_internet_connection);

        view.loadUrl("about:blank");
    } 

Answer 4

You can load html file from assets. Put your html like below. assets/html/no_connection.html

@Override
        public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error)
        {
Toast.makeText(getActivity(),String.valueOf(error.getErrorCode())+":"+ error.getDescription(),Toast.LENGTH_LONG).show();
            wv.loadUrl("file:///android_asset/html/no_connection.html");
            super.onReceivedError(view, request, error);
        }

The following one is deprecated in api 23

@Override
        public void onReceivedError(WebView view, int errorCode, String description, String failingUrl)
        {
            // TODO: Implement this method
            super.onReceivedError(view, errorCode, description, failingUrl);
        }

Forgive me if something went wrong. I am not proficient.