AddThis Social Bookmark Button

Print
Liberty on Whidbey

Putting a Browser into Your Windows Application

by Jesse Liberty
05/10/2005

There are times when it would be awfully convenient to have the capabilities of Internet Explorer inside your Windows application. The classic case is when you want to look at an XML document, and you'd like to take advantage of IE's ability to show the document as a collapsible and expandable hierarchy. This article will show you how to do that, in just a few easy steps (I sound like Betty Crocker).

Begin by firing up Beta 2 of Visual Studio 2005, and create a new project. Pick a Windows Application and call it "Web Browsing".

Begin by enlarging the form to hold a reasonably-sized browser and a couple of other controls (or set the Size attribute to 800,600). Click on the Common Controls tab in the Toolbox and drag a WebBrowser control onto the form. It's a greedy little control and it fills your entire form. Click on its smart tag and then click on Undock in the parent container to put it in its place, as shown in Figure 1:

Figure 1
Figure 1: Undocking the Browser

Click on the URL property of the WebBrowser control and type the URL of your favorite website (e.g., http://www.LibertyAssociates.com ). Run the application and Hey! Presto! You're browsing my site, as shown in Figure 2:

Figure 2
Figure 2: Browsing from a WinForms App

You have a full browser, more or less. But navigation is a bit of a problem, so it is time to add a few useful controls. Start by dragging a label on and setting its text to URL, and then place a text box (txtURL) next to it (widen the text box to hold a long URL) as shown in Figure 3:

Figure 3
Figure 3: Creating the Address Bar

It would be nice for the text box to remember all of the URLs it has seen before, and to offer autocomplete (as IE6 does), so click on the text box and then in the properties window set the AutoCompleteMode to Suggest and the AutoCompleteSource property to AllUrl as shown in Figure 4:

Figure 4
Figure 4: Using an AutoComplete TextBox

Also drag onto the form a progress bar and three buttons, the text of which you will set to Back, Forward and Stop! (and the IDs of which you will set to btnBack, btnForward, and btnStop, respectively) as shown in Figure 5:

Figure 5
Figure 5: Using a ProgressBar

There are a number of useful events fired by the browser control as the page is loading. Some of the most useful are shown in Table 1.

Table 1: Browser Events

Browser Event

Description

Navigating

Raised when you set a new URL or when the user clicks a link. (Use this to cancel navigation.)

Navigated

Raised just before the web browser begins downloading the page.

ProgressChanged

Raised periodically during a download. Tells you how many bytes have been downloaded and how many are expected. (Use this to create a progress bar.)

DocumentCompleted

Raised when the page is fully loaded.

Setting the Event Handlers

The next step is to set the event handlers for your buttons:

private void btnBack_Click(object sender, EventArgs e)
{
  webBrowser1.GoBack();
}

private void btnForward_Click(object sender, EventArgs e)
{
  webBrowser1.GoForward;
}

private void btnStop_Click(object sender, EventArgs e)
{
  webBrowser1.Stop();
}

There are three other events you'll want to handle as well:

  • ProgressChanged - to update the progress bar
  • txtURL_Leave - to set the browser to the new URL
  • DocumentCompleted - to display the document once it has been downloaded.

Note: Documents are downloaded asynchronously, and the DocumentCompleted event is raised when the document is completely downloaded to the client browser.

To handle Progress Changed, you'll need to ask the WebBrowserProgressChangedEventArgs object passed into the event handler for the current progress, which you will divide by the MaximumProgress to get the percentage downloaded so far. You'll convert that value to an integer and assign it to the Value property of the ProgressBar:

private void webBrowser1_ProgressChanged(
   object sender, WebBrowserProgressChangedEventArgs e)
{
   progressBar1.Value = (int)(e.CurrentProgress / e.MaximumProgress);
}

When the user leaves the URL text box, you'll assign the new URL to the browser's URL property. If the user leaves the box blank, you'll fill it in with the default website of your choice.

 private void txtURL_Leave(object sender, EventArgs e)
{
  if (txtURL.Text.Length < 1)
  {
    txtURL.Text = "http://www.ActonEquality.org";
  }

  webBrowser1.Url = new System.Uri(txtURL.Text);

}

Note that the URL property of the WebBrowser requires an object of type System.Uri, which you can create by passing the text string from the text box to the constructor of the System.Uri class. Don't forget to set this handler in the Leave event for the text box.

Finally, when the document is fully loaded into the browser, you'll want to make sure that the URL text box matches the document loaded, so you'll handle the documentCompleted event. (This is useful when first loading the form if the URL is hardwired, or if the URL is set programmatically.)

private void webBrowser1_DocumentCompleted(
   object sender, WebBrowserDocumentCompletedEventArgs e)
{ 
   txtURL.Text = webBrowser1.Url.ToString();
}

Don't forget to set the event handlers for the browser (DocumentCompleted and Progress Changed). To do so, click on the browser, then click on the lightning bolts. If you've already written the event handler, you can choose from the dropdown menu next to the two events. Otherwise, type the event handler name in, and Visual Studio will create the outline of the event handler for you.

The result is shown in Figure 6:

Figure 6
Figure 6: Browsing in Action

Perhaps of even greater utility is the fact that you can navigate to an XML file on your own disk, and use IE6's XML display abilities to make the structure of the XML document clear, as shown in Figure 7:

Figure 7
Figure 7: Browsing XML Documents

As you can see, adding the functionality of a full-fledged browser to your Windows application is frightfully easy. Microsoft has created all the plumbing; you just have to wire up the events and add any application-specific logic.

Jesse Liberty is a senior program manager for Microsoft Silverlight where he is responsible for the creation of tutorials, videos and other content to facilitate the learning and use of Silverlight. Jesse is well known in the industry in part because of his many bestselling books, including O'Reilly Media's Programming .NET 3.5, Programming C# 3.0, Learning ASP.NET with AJAX and the soon to be published Programming Silverlight.

Programming .NET Windows Applications

Related Reading

Programming .NET Windows Applications
By Jesse Liberty, Dan Hurwitz

Read more Liberty on Whidbey columns.

Return to ONDotnet.com