(Print this page)

The WebBrowser control
Published date: Friday, April 27, 2007
On: Moer and Éric Moreau's web site

Have you ever needed to include a browsing feature into one of your Windows-based application? For sure you will not want to recreate a complete new web browser. But maybe you wanted to display some HR pages, maybe you just wanted to easily load PDF files, or maybe you want to let your children to only visit Barney and Barbie web sites!

With Visual Studio 2005 came a new very useful control, the WebBrowser control. It is a managed wrapper over Internet Explorer ActiveX browser control. So depending of your plug-ins and security settings, anything you can see in IE can be used in this control. As you will discover in this article, the control is very easy to use from your current Windows type applications.

Requirements

For the WebBrowser control to work in your application, you need to have IE already installed on your computer. In fact, in the background, IE is really running.

A safe browser for the kids

To start the exploration of this control, we will create a safe browser for the kids. Only a given list of websites will be available from a ComboBox, no URI bar to navigate elsewhere, no context menus at all, no printing … just the plain Barney! You could easily add a timer to this application so that you limit the time your kids are spending with Barney!

The interface is really simple, a ComboBox control to let people select a site and a WebBrowser control to display the site (see figure 1).

Figure 1: the kids’ browser in action

In the load event of this form, I fill the ComboBox content with a DataTable created on the fly (download code to see it) and I also set the IsWebBrowserContextMenuEnabled (couldn’t have been longer!) property to False. This property will not let the browser display its context menu if you right click on it. This will stop your kids from being able to save or print the content.

Other scenarios where this kind of usage would be good include HR department documentation browsing or maybe your application’s help topics.

Give more control to the user

When your kids are getting holder, you may want to let them more control. Now suppose we want to give a more conventional user interface to our browser. Something with the usual Back, Forward, Stop, Refresh and Home button. It will not be complicated, about just a single line for each of these buttons. The other we will add, is a TextBox and a Go button. Finally, a WebBrowser control is needed. See figure 2 for a preview of that form.

Figure 2: A more complete interface

The first thing we will do is being able to navigate to a given URL. Thanks to the new features of the TextBox control, you can set the AutoCompleteSource property of the TextBox control to AllUrl and the user will see the same behavior as in IE (see my article of June 2006 for more information on this). It is also easy to set the Form’s AcceptButton to the Go button so that when the user presses the Enter key, the Go button will execute.

Speaking of the Go button, when we click on it, we should initiate an action to display what the user typed into the TextBox. The method to do that is called Navigate:

WebBrowser1.Navigate(txtURI.Text)

When your target is found, an event is raised and returns the real URL. This event is the Navigated:

txtURI.Text = WebBrowser1.Url.ToString

If you want to get some status after the navigation has been started, you can trap the StatusTextChanged event and display the StatusText property of the WebBrowser control. I use this method to display in a Label at the bottom of my form:

lblStatus.Text = WebBrowser1.StatusText

Another useful event to trap is the DocumentCompleted. This event is triggered when the page is fully loaded:

lblStatus.Text = "Document fully loaded"

If you want the Back and Forward buttons to be correctly enabled or disabled depending on the state of the history, you can trap the CanGoBackChanged and the CanGoForwardChanged event:

btnGoBack.Enabled = WebBrowser1.CanGoBack
btnGoForward.Enabled = WebBrowser1.CanGoForward

The code behind the Back and the Forward buttons is really simple:

WebBrowser1.GoBack()
WebBrowser1.GoForward()

Finally, if you want the user to be able to open the Home page that is set into Internet Explorer, you can simply call the GoHome method like this:

WebBrowser1.GoHome()

Not limited to Web navigation

Notice that your new browser is not limited to browse only html documents. You can load any documents IE can load like Word documents, PDF documents, or Flash animations. Anything that can be loaded in IE, can be loaded in your browser. Remember that your browser is in fact IE with your own GUI!

Other samples

There are a couple of other examples on the net. One I suggest you to see is the one from the Windows Forms site.

Conclusion

I don’t want you to start building your own browser unless you really want to limit your children like I showed you in my first example. But giving some browsing features built-in your own application can be a nice feature for your users.


(Print this page)