Loading...

How to Load HTML Data/String on Android WebView Application

Android WebView is a View that allows you to display website, static HTML data, and your custom web page. Using WebView you can able to convert your web page into android application. Here I describe how to load HTML Data on android WebView.


Android Example: Load HTML Data/String on Android WebView App


Creating Android Project

Let’s start by creating a new android project to Load HTML Data on Android WebView with following information:
Application name: Load HTML Data on Android WebView
Company Domain: sirseni.com
Package name: com.sirseni.loadhtmldataonandroidwebview
Minimum SDK: Android 2.2 (API 8 Froyo)

Adding a WebView in Your Layout File

To load HTML string on your android WebView, first you have to add <WebView> element in your layout file.
res/layout/activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <WebView
        android:id="@+id/myWebView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

</LinearLayout>


Modify Your Java File

To load HTML data in your android WebView just call loadData(), here is final code of MainActivity.java file.
src/MainActivity.java

/*
* Load HTML Data on Android WebView
*
*/

package com.sirseni.loadhtmldataonandroidwebview;

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WebView mWebView = (WebView) findViewById(R.id.myWebView);
        String myHtmlString = "<html><body>" +
                "<h2>This is a HTML Heading in Android WebView.</h2>\n" +
                "<p>This is a HTML paragraph in android WebView.</p>\n" +
                "\n" +
                "<h4>Following is HTML Table in WebView</h4>\n" +
                "<table border=\"1\" width=\"100%\">\n" +
                "  <tr>\n" +
                "    <td>Android</td>\n" +
                "    <td>WebView</td>\t\t\n" +
                "    <td>100</td>\n" +
                "  </tr>\n" +
                "  <tr>\n" +
                "    <td>Android</td>\n" +
                "    <td>WebView</td>\t\t\n" +
                "    <td>200</td>\n" +
                "  </tr>\n" +
                "  <tr>\n" +
                "    <td>Android</td>\n" +
                "    <td>WebView</td>\t\t\n" +
                "    <td>300</td>\n" +
                "  </tr>\n" +
                "</table>" +
                "</body></html>";
        mWebView.loadData(myHtmlString, "text/html", null);
    }
}


That’s it, now run your Load HTML Data on Android WebView application, your app is look like below screenshot.

Simple Android WebView Example and Tutorial

Implementing Navigation Back Feature to Android WebView Application

Download complete Load HTML Data/String on Android WebView Application example project source code from GitHub.


Application Screenshot:


Android Example: Load HTML Data/String on Android WebView App

WebView 3611030115937129436
Home item