CSS Includes

Friday, May 13, 2011

How To View a Webpage Inside Your Android App

11/09/2012 Related Update: Instant Android WebView Code

Hi there! Today I'm gonna share how to view a website or webpage to your Android apllication. You'll be able to view webpages from the internet or from the storage of your Adroid device such as your sdcard. This is useful if you want your app not to open a web browser for web links. It is like, the browser is inside or embedded your Android application.

How To View a Webpage Inside Your Android App
Android WebView


The following code will enable you to view this blog on your Android Application. This code uses the Android WebView class which is also an extension of Android's View class.

package com.example.yourproject;

import android.app.Activity;
import android.os.Bundle;
import android.view.Window;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

public class YourProject extends Activity {
     /** Called when the activity is first created. */
     @Override
     public void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          //setContentView(R.layout.main);
        
          // Let's display the progress in the activity title bar, like the
          // browser app does.
          getWindow().requestFeature(Window.FEATURE_PROGRESS);

          WebView webview = new WebView(this);
          setContentView(webview);
        
          webview.getSettings().setJavaScriptEnabled(true);

          final Activity activity = this;
          webview.setWebChromeClient(new WebChromeClient() {
          public void onProgressChanged(WebView view, int progress) {
               // Activities and WebViews measure progress with different scales.
               // The progress meter will automatically disappear when we reach 100%
               activity.setProgress(progress * 1000);
          }
        });
        
webview.setWebViewClient(new WebViewClient() {
          
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
          //Users will be notified in case there's an error (i.e. no internet connection)
          Toast.makeText(activity, "Oh no! " + description, Toast.LENGTH_SHORT).show();
}
 });
       //This will load the webpage that we want to see
        webview.loadUrl("http://codeofaninja.blogspot.com/");

     }
}

If you want to view an html page from your sdcard, you can change the url for example "file:///sdcard/YourProject/index.html". Well that's it. Thanks for reading. :)
Thanks for sharing the post! :)
For FREE programming tutorials, enter your email below and subscribe! :)

10 comments:

Android XDA Developees :) said...

actually android devices now has a built in HTML Viewer so it is not necessary to code it :). Anyway that's the good thing, thanks for sharing the code!

Michael said...

Yes but there are some situations when you want to view a webpage inside you app and this code could be used. Anyway thanks for your extra info :)

Anonymous said...

Hi...how can i achieve the same effect(load a web page)...using an intent.I want the progress bar to display...and also the name of the application to display..when loading is complete.

Sergio D. Rossetti said...

Simple, clear. It's just what I was looking for. Nice code. Thanks!

Mike Dalisay said...

@Sergio: Thanks for your comment. You're welcome! :)

Joe said...

Does anyone know how to enable javascript within the webview?

Android Tablet Apps said...

@joe: add this to your app's activity


[code]webview.getSettings().setJavaScriptEnabled(true);[/code]

Jessica said...

Hello,

I am new to this and I am really lost in how to view a web page in the current app I am working on. Right now, I have an app, but I would like to link it to an external web page that will not launch a web browser. I am currently using HTML, CSS and JS.

How can I incorporate what is shown here with what I am using? I tried and I have no luck.

Thanks!
-Jess

ccortina said...

Not working with a website on internet until you add

[code]
[/code]

to AndroidManifest.xml thanks for the project!

D.C. said...

WoW! Thanks bro! I was searching all night long and now I found it! Your Post is very usefull! Thanks for this very easy example!

Post a Comment

You can use http://pastebin.com/ or http://jsfiddle.net/ if you want to comment some codes.

Related Posts