Developing HTML 5 Application for Android

Developing HTML 5 Application for Android is an easy process, we will list the few steps needed to achieve this..

1) Create Your Normal Android Project:
-Define the activity and package name in new project wizard.
For example: Activity is TestActivity and package name is osa.ora.test

2) In the main.xml change it to looks like the following:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<WebView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/webView"
/>
</LinearLayout>

This define a web view with the id: webView.

3) In our activity : the following code is needed according to your needs:

public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
WebView webView=(WebView)findViewById(R.id.webView);
webView.setWebChromeClient(new WebChromeClient());
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setDatabaseEnabled(true);
webView.getSettings().setDatabasePath("/data/data/osa.ora.test/databases/");
webView.getSettings().setDomStorageEnabled(true);
webView.loadUrl("file:///android_asset/www/index.html");

}

4) In asset folder create a folder with the name "www":

Place all the HTML, JS and CSS (and images) files under it, you must have the index.html that we refereed in our code (or another file name but match what in our java code).

5) Run the emulator , test it then sign it and upload :)

This is example application running in the emulator:


A lot of video tutorials exist showing the same way to develop such application.
Click here to watch.