Click here to Skip to main content
15,355,946 members
Articles / Mobile Apps / Android
Tip/Trick
Posted 25 Aug 2013

Tagged as

Stats

34.7K views
2.1K downloads
6 bookmarked

WebView browser controller

Rate me:
Please Sign up or sign in to vote.
5.00/5 (3 votes)
30 Aug 2013CPOL
Android webview browser controller

Introduction

Today, I will guide that way to control a WebView Android, with some normal action of web Browser.

  • Reload button: tap on to refresh current page.
  • Back button: back to previous page of webview if it exists.
  • Next button: go to next page if it exists.

Using the code

Off course we will customize to have Webview like that. In this tip, I will layout for custom view by coding, not xml. I hope it can help you use it easier. 

The customize view is FrameLayout which contains:

  • A WebView is fill_parent.
  • A LinearLayout in the bottom which contains [Back], [Next], [Reload] button.

And below is customize class

CustomizeWebview.java  

Java
/**
 * @author huyletran84@gmail.com
 */
public class CustomizeWebview extends FrameLayout {
    private Button mReload;
    private Button mNextBtn;
    private Button mPreBbn;
    private WebView mWebView;
    private boolean mIsLoadFinish = false;
    private LinearLayout mWebViewControllerLn;
    private WebViewClient mWebViewClient;

    public CustomizeWebview(final Context context, final AttributeSet attrs) {
	super(context, attrs);
	mWebView = new WebView(getContext());
	mWebView.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,
		LayoutParams.MATCH_PARENT));
	addView(mWebView);

	mReload = new Button(getContext());
	mReload.setText("Reload");
	mReload.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,
		LayoutParams.WRAP_CONTENT));

	mNextBtn = new Button(getContext());
	mNextBtn.setText("Next");
	mNextBtn.setEnabled(false);
	mNextBtn.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,
		LayoutParams.WRAP_CONTENT));

	mPreBbn = new Button(getContext());
	mPreBbn.setText("Back");
	mPreBbn.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,
		LayoutParams.WRAP_CONTENT));
	mPreBbn.setEnabled(false);

	mWebViewControllerLn = new LinearLayout(getContext());
	mWebViewControllerLn.setLayoutParams(new LayoutParams(
		LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT,
		Gravity.BOTTOM));
	mWebViewControllerLn.setOrientation(LinearLayout.HORIZONTAL);
	mWebViewControllerLn.setBackgroundColor(Color.GRAY);

	mWebViewControllerLn.addView(mPreBbn);
	mWebViewControllerLn.addView(mNextBtn);
	mWebViewControllerLn.addView(mReload);
	addView(mWebViewControllerLn);

	// Setup for button controller
	mReload.setOnClickListener(new OnClickListener() {
	    @Override
	    public void onClick(View v) {
		mWebView.reload();
		enableControllerButton();
	    }
	});
	mPreBbn.setOnClickListener(new OnClickListener() {
	    @Override
	    public void onClick(View v) {
		mWebView.goBack();
		enableControllerButton();
	    }
	});
	mNextBtn.setOnClickListener(new OnClickListener() {

	    @Override
	    public void onClick(View v) {
		mWebView.goForward();
		enableControllerButton();
	    }
	});
    }

    public void loadUrl(String url) {
	mWebView.getSettings().setJavaScriptEnabled(true);
	mWebViewClient = new WebViewClient() {
	    @Override
	    public boolean shouldOverrideUrlLoading(WebView view, String url) {
		return super.shouldOverrideUrlLoading(view, url);
	    }

	    @Override
	    public void onPageStarted(WebView view, String url,
		    android.graphics.Bitmap favicon) {
	    }

	    @Override
	    public void onPageFinished(WebView view, String url) {
		mIsLoadFinish = true;
		enableControllerButton();
	    }
	};
	mWebView.setWebViewClient(mWebViewClient);
	mWebView.loadUrl(url);
    }

    private void enableControllerButton() {
	if (mIsLoadFinish) {
	    mReload.setEnabled(true);
	    if (mWebView.canGoBack()) {
		mPreBbn.setEnabled(true);
	    } else {
		mPreBbn.setEnabled(false);
	    }
	    if (mWebView.canGoForward()) {
		mNextBtn.setEnabled(true);
	    } else {
		mNextBtn.setEnabled(false);
	    }
	} else {
	    mPreBbn.setEnabled(false);
	    mNextBtn.setEnabled(false);
	}
    }
}

And the result is here

Beside that, if you want to hide and view controller by tapping, please download this source

History 

  • 20130826: First version.
  • 20130830: add source to view and hide controller by tapping event. 
  • 20130831: add source to display video in html5 in webview (Clinton's request) 

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

huyletran
Vietnam Vietnam
I'm Java developer.
I started Java web coding from 2007 to 2010. After that, I began to develop Android from 2010 to now.
In my thinking, sharing and connecting is the best way to develop.
I would like to study more via yours comments and would like to have relationship with more developers in the world.

Comments and Discussions

 
Questiondisplay video via webview?? Pin
Mo Kash30-Aug-13 4:08
MemberMo Kash30-Aug-13 4:08 
AnswerRe: display video via webview?? Pin
huyletran30-Aug-13 4:45
Memberhuyletran30-Aug-13 4:45 
AnswerRe: display video via webview?? Pin
huyletran30-Aug-13 4:47
Memberhuyletran30-Aug-13 4:47 
GeneralRe: display video via webview?? Pin
Clinton Gallagher30-Aug-13 7:44
professionalClinton Gallagher30-Aug-13 7:44 
GeneralRe: display video via webview?? Pin
huyletran30-Aug-13 18:44
Memberhuyletran30-Aug-13 18:44 
GeneralRe: display video via webview?? Pin
Clinton Gallagher31-Aug-13 10:00
professionalClinton Gallagher31-Aug-13 10:00 
Thank you. Don't worry about the time it takes to respond. No problem. We're the ones you are helping out with the code and listening to our feedback.

Here's what I need... I am a C# and HTML5 developer. I can read Java okay and have taken a little time to learn Android development but not enough time to do useful coding.

You know there are about ~1000 different Android TV boxes and sticks being marketed to enable us to connect a box or a stick to an extisting TV set and playback content from the WWW. You migh want to think about your interest in Webview as an app that can be installed to an Android device from Google Play that allows the rest of us to configure the app to load our websites in the view.

What is going on is we are trying to run digital signage on TV sets.
Clinton Gallagher

GeneralMy vote of 5 Pin
trth27-Aug-13 20:38
Membertrth27-Aug-13 20:38 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.