Download Code

Android WebView Example

In android webview example you will learn how to display web application in an android application.Simply you can say how to display web page in a webview.

Web View

An extension of Android’s View class.Allows to display web pages as a part of your android application activity.This View uses WebKit rendering engine to display web pages.Including methods to navigate forward or backward,Zoom in,out,History etc.Most importantly to load web pages in web view,you should have INTERNET permission in you android manifest file.For More(WebView),detail.

Basically we will load a Android Codec Web page within android app activity using web view.

So, let’s start go ahead and create android webview example application project.

webview,android webview,android webview example,webview example,

After creating android application project.Go to activity_main.xml now you will add web view.Basically there are two ways whether full screen or inside an application as one component.

Full Screen XML

No need to add any thing else just use this xml code.

webview,android webview,android webview example,webview example,

As Component XML

webview,android webview,android webview example,webview example,

You will use full screen web view.After adding xml code.Go to MainActivity.java class/activity,by default it will look like this.

public class MainActivity extends Activity {

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

Now declare a variable of Web View class.

public class MainActivity extends Activity {
    WebView webPage; // declaring web View variable 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    
}

Next refer the id of web view from xml in activity and store it in web View variable.Call loadUrl() method of Web View class to load specific webpages in web view.

public class MainActivity extends Activity {

	Web View webPage; // declaring web View variable 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        webPage = (WebView) findViewById(R.id.web View);  // refering xml web view id
        webPage.loadUrl("http://www.androidcodec.com"); // WebView method loadUrl to display particular webpage
    }

    
}

Now,don’t ever forget to add INTERNET permission in your android manifest file.Go to Android Manifest.xml and add this permission.

Android Manifest.xml

webview,android webview,android webview example,webview example,

Now run your android application project,output will look like this.

webview,android webview,android webview example,webview example,

Now next you will enable javascript.It means that if your web page contains javascript code it will not run until you enable it.So,for that purpose you have to use WebSetting() to get settings of webview and enable javascript using setJavaScriptenabled() method.Now your MainActivity look like this.

public class MainActivity extends Activity {

	Web View webPage; // declaring web View variable 
	WebSettings webPageSetting;   // decalring variable for web settings
        @Override
        protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main);
         webPage = (Web View) findViewById(R.id.web View);  // refering xml web view id
         webPageSetting = webPage.getSettings();          // get setting of webpage and store it in webPageSetting variable
         webPageSetting.setJavaScriptEnabled(true);       // now enabling javascript of a web page
         webPage.loadUrl("http://www.androidcodec.com"); // WebView method loadUrl to display particular webpage
    }

    
}

Next you might have seen a problem when you click on any link within application webpage.It will load in a browser.

To resolve this issue you will use webViewClient class to load url within webpage inside your application using setWebViewClient() method with new class instance (nextWebClient).After that your MainActivity.java will look like this.

public class MainActivity extends Activity {

	WebView webPage; // declaring web View variable 
	WebSettings webPageSetting;   // decalring variable for web settings
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        webPage = (WebView) findViewById(R.id.webView);  // refering xml web view id
        webPageSetting = webPage.getSettings();          // get setting of webpage and store it in webPageSetting variable
        webPageSetting.setJavaScriptEnabled(true);       // now enabling javascript of a web page
        webPage.setWebViewClient(new nextWebClient());   // to open particular url using setWebViewClient() method
        webPage.loadUrl("http://www.androidcodec.com"); // WebView method loadUrl to display particular webpage
    }

    
}

After creating nextWebClient class implement method shouldOverrideUrlLoading() method.

public class nextWebClient extends WebViewClient {

	@Override
	public boolean shouldOverrideUrlLoading(WebView view, String url) {
		// TODO Auto-generated method stub
		return true;
	}

}

You can see there are two parameters Web View and url.WebView is used to display further clicked webpages and url is that particular webpage url which display in Web View.Now use loadUrl() method.

public class nextWebClient extends WebViewClient {

	@Override
	public boolean shouldOverrideUrlLoading(WebView view, String url) {
		// TODO Auto-generated method stub
		view.loadUrl(url);
		return true;
	}

}

Now run your android webview example application project.It will display Main Home page.When you click on any linked webpage,it will load within your application.It might look like this if you are working with my project.

webview,android webview,android webview example,webview example,

That’s it for this tutorial.

Thanks.