How can I replace the unsightly "Web page not available" error in WebView on Android with a more visually pleasing alternative?

In my WebView Activity, I sometimes encounter issues with loading properly when the WIFI/DATA connection is poor or disconnected. This could potentially be a common occurrence once my app is in use. I'm curious to know how I can replace the unattractive error message with a more visually appealing one?

Furthermore, do you have any suggestions on how I can make my WebView Activity look less like a typical browser? For instance, rather than a blank white screen appearing during the loading process, how can I incorporate a loading icon instead?

Thank you for your help.

javascriptandroidhtmlcsswebview

Answer №1

When a website cannot be found, it results in a 404 error, and it is important to address this issue.

One way to handle this situation is by utilizing a WebViewClient and customizing the onReceivedError method.

Here is an example of how this can be implemented:

    WebView webview = (WebView) findViewById(R.id.webView);
 webview.setWebViewClient(new WebViewClient() {
    @Override
    public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
             //handle the 404 error here
            super.onReceivedError(view, errorCode, description, failingUrl);
    }
 });

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The JavaScript code appears to have malfunctioned as it abruptly terminates with an exit code of 1

When running the code, it reports that prompt-sync cannot be found and exits with error code 1 const input = require('prompt-sync')(); var firstName = input("Enter your first name:"); var lastName = input("Enter your last name:"); console.log(" ...

javascriptnode.js

Angular 2 encountered a fatal error: Issues with parsing the template:

Here is the code snippet I am currently working with: <div class="container"> <div [hidden]="loggedIn"> <md-grid-list cols="6" [style.margin-top]="'20px'"> <md-grid-tile [colspan]="1"></md-grid-tile> I have already ...

javascriptangular

Exploring the various possibilities of establishing multiple types of many-to-many relationships between two tables using Sequelize technology

Working with Sequelize in Node, I am dealing with Users and items. A user can interact with an item in various ways, such as voting or commending, which are distinct actions in this scenario. Initially, I considered having two separate many-to-many relati ...

javascriptnode.jsdatabasesequelize.jsmariadb

A guide to fetching a JSON Object from a URL using Node.js and Express

As a newcomer to Node.js and Express, I am venturing into my first real project with these technologies. In this simple Node.js/Express project, my goal is to retrieve a JSON object from a URL. Additionally, I plan to create another URL that shows HTML co ...

javascriptjsonnode.jsexpresspug

Enhance your Material UI Button with Advanced Text Alignment Options for Compact Screens

As a beginner in React and Material-UI, I'm attempting to customize a set of buttons within my app bar with background images for a cleaner look. Drawing inspiration from various online examples, I've managed to style them to my liking on larger ...

cssreactjsmaterial-uinext.js

Align a child element to the top and another child element to the center within a flexbox column

Struggling with flexbox column and can't find a solution online! The problem: I have a full-height flex-column on the right side of my viewport with two elements (headset icon and hangup button). Trying to vertically align them - first element at top ...

cssflexboxbootstrap-4

Decomposing the Retrofit response.body()

I am having difficulties with implementing Retrofit and understanding how to interpret the response body. I believe that there might be an issue with mapping my JSON data to POJO because the output is not what I expected when I print it out in the log. He ...

javaandroidjsonrestretrofit

Guide to presenting JSON data with ajax

I am trying to dynamically display data based on the selected value from a drop-down list using Ajax's GET method. The idea is to modify the URL by appending the selected item in order to retrieve relevant data from the server: Here is an example of ...

javascriptjqueryjsonajax

Filtering an array by a search term

How do you filter an array based on a specific search term? For example, if we have an array [Tom Harry, Tom John, John Glen, Tom Harward] and we search for "Tom H," then only Tom Harry and Tom Harward should be the output. [Tom Harward, Tom Harry]; Usin ...

javascript

Convert the value to JSON format by utilizing the PHP GET method

After retrieving a value using the GET method in my PHP file, I am attempting to access it. Below is how my PHP file appears: <?php include 'Con.php'; header('content-Type: application/json'); $catid = $_GET["CatId"]; //array ...

javascriptphpjsonchart.js

"What could be the reason why the color property is not being applied to this

I have been attempting to change the color of an icon by using the color property, but for some reason, it is not applying as expected. Here is the code snippet I am working with: "& .MuiListItemIcon-root": { color: "red" }, ...

javascriptreactjsreact-hooksmaterial-ui

Hamburger must be used in order for the menu to be displayed

Whenever I visit the site, the menu remains hidden. However, when I resize the page and use the hamburger icon, the menu appears as expected. Even after resizing the page back to its original size, the menu continues to be visible. Refreshing the sit ...

htmlcss

It seems like there may be an issue with the React Table Pagination in reactjs

As a newcomer to React JS, I have been utilizing react-table to create a component that can filter, sort, and paginate sample data from a JSON file. If you are interested in the tutorial I am following, you can find it here: Currently, I am encountering ...

javascripthtmlreactjsfrontend

Loading screen displayed while transitioning between routes within Angular

I have been struggling to implement a loading spinner in my project. How can I display a loading screen when changing routes in Angular? Here is the HTML code snippet: <div *ngIf="showLoadingIndicator" class="spinner"></div> ...

cssangulartypescript

Using Selenium Webdriver to set a cookie with a Chrome extension

I have been experimenting with a Chrome extension in order to set a cookie when I use a Selenium Webdriver instance to open a page. Despite trying various methods suggested on different Stack Overflow posts, none of them seem to work as the cookie does not ...

javascriptgoogle-chromeselenium-webdrivergoogle-chrome-extension

Despite using "border-box" for the box-sizing property, the table cells are

Padding needs to be added to the cells of a table, but this is causing overflow issues with text and inputs inside the table. Despite attempting to set box-sizing: border-box, the problem persists. An example below demonstrates the issue: * { box-siz ...

htmlcsshtml-tableborder-boxbox-sizing

What is the best way to display a selected checkbox in an AJAX editing modal?

Can someone assist me in loading the checked checkboxes in an edit modal? I am using checkboxes to assign multiple roles in my system. Everything was working fine, but I encountered an issue with my edit modal where the checkboxes appear blank and unchecke ...

javascriptphpjqueryajax

Navigate to a section that has been dynamically loaded through ajax

My page displays a list of products in alphabetical order, with the products dynamically loaded via ajax as the user scrolls. At the top of my page, I have an alphabet list (A-Z) that allows users to click on any letter to jump to the list of products st ...

javascriptjqueryhtmlajax

Issue with Javascript functionality not persisting after page reload initiated with a href = '#'

I am facing an issue with a button on my webpage that is meant to redirect and reload the home page. However, after redirection to '#', my JavaScript seems to stop functioning correctly. Currently, my JavaScript code is enclosed within window.on ...

javascriptjqueryhtmlanchor

Shifting the Ion Menu side dynamically based on screen size: A step-by-step guide

Working with Ionic 4, I encountered the need to dynamically change the side property of ion-menu. On larger screens, ion-menu is always visible or static, whereas on smaller screens, it remains hidden until the user clicks on the ion-menu-button. My goal i ...

htmlangulartypescriptionic-framework