Silk Screen: Using the New WebBrowser Control

Ken Bergmann
Microsoft Developer Network Technology Group

June 1996

Click to open or copy the files in the SILKSCRN sample application for this technical article.

Abstract

This article demonstrates the use of the new Microsoft® ActiveX™ WebBrowser control included with Internet Explorer version 3.0 and illustrates the basics of programming the control and handling event notifications. The sample that accompanies this article uses the WebBrowser ActiveX control to build a fully functional, feature-laden custom Web browser. The 32-bit code is in Microsoft Visual Basic® 4.0 and has been tested on and built for the Microsoft Windows® 95 platform only.

Introduction

If you have installed Microsoft® Internet Explorer 3.0, your system has been given a subtle boost of which you may not be aware. Installed with Internet Explorer 3.0 is an ActiveX™ control that provides all the functionality you need to build browser functionality into your applications.

There are really only three avenues for harnessing the Web from your applications. The typical approach, shared by almost all popular browsers, basically uses dynamic data exchange (DDE) to load the browser as a separate application and command it to navigate to specific URLs. When you are using Internet Explorer version 2.0 and all the Netscape browsers, this is your only choice.

With the arrival of Internet Explorer 3.0, two alternatives are available. The first offers you the ability to control the Internet Explorer 3.0 browser application through OLE Automation, which gives you much more precise control over the actual browser. For instances where the desired user experience is from within the context of the browser, this setup is ideal. Of course, there are many times when you will want to give your application the features of a Web browser. In these situations, actually moving user focus from your application to another application (that is, a separate browser) can significantly affect the user experience. For instance, using the WebBrowser control provided by Internet Explorer 3.0, you can actually provide all the features of a browser in an embeddable format—presented from within your application, in the context you want. Today, Internet Explorer 3.0 is the only full-featured solution to providing custom browser functionality in your applications. It is this functionality that I explore in this article, through the creation of a custom Web browsing application.

At the end of this article you will be able to construct a fully featured Web browser and customize its features to the needs of your applications.

Silk Screen: Creating a Custom Browser

This sample is based on the features in the WebBrowser control. If you have installed Internet Explorer version 3.0, you already have this control on your system. You simply need to add a reference to it for your project.

When dropped into a form, this control outlines the area in which you request the specific HTML you want it to find. The control handles all the formatting, display, linking, downloading, and other features that you would normally expect from your browser. You don't need to do anything to use these features. All you need to do is ask the control to navigate to URLs and respond to the events that it will raise. For a full description of the WebBrowser control go to http://www.microsoft.com/workshop/browser/webbrowser/webbrowser.asp.

For this discussion, we'll concentrate on those features that you need to really get some use out of the control. First and foremost is how to get the control to show a page.

Showing a Page

To show a page using the WebBrowser control, you simply ensure that the control is visible and then execute the Navigate method on the control, passing in the URL that you want to be displayed:

Private Sub btGo_Click()
On Error Resume Next
'The txtAddress control is an edit box
'that contains a URL
webMain.Navigate txtAddress
End Sub

The control will do all the work of downloading and caching the page and formatting and displaying the HTML. This works even with partial URLs and will use any proxies that your system is aware of.

While the control is doing all this work to present a page in its display area, some events are fired that can be handled to make this process a little more precise and informative. For example, I use the OnNavigate event to reset the status display and show the expanded URL in the address edit box:

Private Sub webMain_OnNavigate(ByVal URL As String, ByVal Flags As Long, _
   ByVal TargetFrameName As String, PostData As Variant, _
   ByVal Headers As String, ByVal Referrer As String
On Error Resume Next
Debug.Print "OnNavigate: " & URL
lblStatus = "Ready"
txtAddress = URL
End Sub

You can also use the OnProgress and OnStatusTextChange events to handle download progress notifications and to display the status text provided by the control in your own status bar or label.

Canceling Download

For a browser to be user-friendly, it must provide a way for the user to cancel downloads while they are still in progress. In most browsers, this takes the form of a Stop button. This sample implements this same feature in the same way. Because the Navigate method operates asynchronously, we can use a simple button to provide this functionality. The code is very straightforward and simple:

Private Sub imgStop_Click()
On Error Resume Next
'Discontinue any current download attempts
webMain.Stop
End Sub

As you can see, simply calling the Stop method notifies the browser control to cease downloading. Through experimentation, you will find that this is not quite as clean an approach as one in which your applications are multithreaded (as a real browser would need to be), but it is useful during long downloads when you wish to regain control of the browser.

Refreshing the Current Page

Any decent browser also needs to allow the user to refresh the contents of the current page. Using the WebBrowser control, this is simplicity itself. Basically, you just call the Refresh method:

Private Sub imgRefresh_Click()
On Error Resume Next
'Reload the currently displayed URL
webMain.Refresh
End Sub

This is especially helpful in situations where the browser can make intelligent decisions about how to reload content. For example, if the server indicates that a file is up-to-date, a smart browser will reload only the components of the page (graphics, scripts, and so on), instead of reloading and re-caching the actual HTML of the page. When you are using the WebBrowser control in your applications, you get all these smarts for free.

Providing Home and Search Buttons

The next feature that our browser requires to be truly full-fledged is the ability to navigate to user-defined Home and Search pages. The WebBrowser control makes this easy. For navigating the Home page, you simply use this code:

Private Sub imgHome_Click()
On Error Resume Next
'Navigate to the user's home page
webMain.GoHome
End Sub

And if you want to go to the URL that the user has defined as the Search page, you simply invoke the GoSearch method:

Private Sub imgSearch_Click()
On Error Resume Next
'Navigate to the user's pre-defined search page
webMain.GoSearch
End Sub

This is so easy it makes you want to weep, doesn't it? Someone finally took the hard part out of providing Web browsing functionality in your custom applications. But wait, there's more!

It Even Prints

By providing built-in printing capabilities, this browser control goes way beyond traditional controls. Not simple text output or draft text, but high-quality rendered text and dithered graphics! The WebBrowser control takes what the user sees on screen and recreates it in hard-copy format. And it doesn't cost you a cent more! Look at how easy it is to implement:

Private Sub imgPrint_Click()
On Error Resume Next
'Use the default settings of the default printer
webMain.PrintOut
End Sub

Of course, if you must fiddle with everything, there is a list of parameters you can send with this method to fully tailor and customize the output to whatever your needs of the moment may be. Check out the type library included with the controls for all the details.

At the End of the Day

When the dust settles, what do you really have? You can use the controls available with Internet Explorer 3.0 to fully encapsulate Web browser functionality in your applications. And you don't have to write very much code to do it.

Imagine having a list of URLs, specific to your business, that your application could download from the Web. Then imagine if these URLs were used to present information to the user straight from the Internet! Updates to your application's documents, new marketing information, everything your company publishes on the Web! You could present this information in real-time to your users, from inside your application, for virtually no overhead.

Imagine being able to write simple Visual Basic® applications that allow users on your intranet to access information stored on a variety of servers. These simple applications can either drive a browser or they can be embedded in this control and determine what information your users see and in what context. Now, with very little effort, the applications your enterprise uses every day can be expanded to include data feeds from Web pages all over the network by using multiple instances of the control, all on the same form.

Now stop imagining and go put this to use.