Programming and Personal Development

Display Web Pages in your android application

Webview extends the View class and is useful for displaying a web page  as part of your activity. By default it behaves like a browser minus things like navigation controls, address bar etc. Even javascript is disabled with the default settings.
Load Url using Webview

Load url using WebView

You can use it to display things like help files , end-user agreements, FAQs etc.  Since such contents change frequently, its useful to make a mobile friendly HTML webpage, and display them as a webpage rather than packaging them as part of your application.

Example

Lets begin with a simple example that loads a URL from internet or local HTML file.

XML layout

This is not much different from any of the previous examples we have seen. You have a simple WebView element that takes up the entire screen.
<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
         android:id="@+id/browser1"
         android:layout_width="match_parent"
         android:layout_height="match_parent"/>

AndroidManifest Permissions

In order for your application to access resources from the internet, you need to specify the Permission in the Android manifest file. Without this android wont let you load a URL from the internet.
<!--Specify the permissions that the application uses-->
<uses-permission android:name="android.permission.INTERNET"/>

HTML Asset

In addition to the loading a URL from the internet, you can also load resources local to your application. In this case we have a simple HTML page (HelloWorld.html) under the assets/html/ folder.  You can access this local resource in your Java code by prefixing your URI (Uniform resource Identifier) with “file:///android_asset/<path-to-resource>” as shown later.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Hello World</title>
</head>
<body>
<H1>
    Hi There...I am a local resource
</H1>
</body>
</html>

Java code

Load a local resource using webview

Load a local resource using webview

Finally, within the activity class,
  • We load the WebView element by its ID using the findViewById () method and
  • Use a private helper method called loadResource() that can load both the URL and the local resource
Couple things to note here.
  • As mentioned earlier, Javascript is disabled by default. You have to explicitly enable it by accessing the WebView settings  and calling setJavaScriptEnabled () method as shown.
  • If you want to load the local resource, simply call the private  loadResource () method with the LOCAL_RESOURCE string instead of URL_TO_LOAD string .
public class WebViewDemo extends Activity {
   private static final String URL_TO_LOAD = "http://google.com";
   private static final String LOCAL_RESOURCE = "file:///android_asset/html/HelloWorld.html";
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.browser_demo);
      WebView wv = (WebView) findViewById(R.id.browser1);      loadResource(wv, URL_TO_LOAD);   }
   private void loadResource(WebView wv, String resource) {
      wv.loadUrl(resource);      wv.getSettings().setJavaScriptEnabled(true);   }
}
Web Analytics