Introduction
This article is intended for newbies to the ActiveX world. In a Step-By-Step approach, it demonstrates inserting and handling the Microsoft Internet Explorer as an ActiveX control. The article shows how to insert the control, how to handle events and how to pass data to it. This article may also help you, if you want to use any other ActiveX control.
Inserting the ActiveX control
- On the dialog which you want to add the ActiveX control, right click the mouse to get the pop-up menu. From the pop-up menu, select Insert ActiveX Control.
You will get a menu, scroll down and select Microsoft Web Browser as shown in the next image, then press OK.
All the other items in this menu are ActiveX controls which you can use. You may want to try out a couple of these later on, I am sure you will find a few of them interesting.
- After you have finished step 1, you will notice that a new control has appeared on screen. The ID for this control is
IDC_EXPLORER1
. You should at this stage stretch this controller as much as you can because you will need the space. Click the mouse on this control to highlight it, then press Ctrl and W to start the MFC Class Wizard.
- Click on the second tab, titled Member Variables. Then click on the ID of our new controller
IDC_EXPLORER1
to highlight it. Afterwards, click on button Add Variable. This should open a dialog that informs you that MS Dev. Studio wants to generate a C++ wrapper class for our ActiveX control. Press OK (twice), and let MS Studio do its work.
- After MS Studio is done creating the class, a menu titled Add Member Variable will pop up asking you to name the variable. Give the variable a name like
m_WebBrowserCtrl
.
- You will now see the member variable next to the ID of our controller. MAKE SURE YOU PRESS "OK" NOW, otherwise all the previous changes will be rolled back by MS Studio.
- On the dialog, double click the button OK, and create a member function
OnOK
. We are going to use this button to test our new control. There are many functions that we can use in the new ActiveX control, I will explain a bunch of them later on in this article, but for now we are concerned with the command that allows the Web Browsing component to browse to a (any) webpage. The function is Navigate
. void Navigate(LPCSTR URL, VARIANT *Flags,
VARIANT * TargetFrameName, VARIANT *PostData, VARIANT *Headers)
Don't worry about all the variables, if you simply want your new web component to browse to a web page, all you have to do is the following:
m_WebBrowserCtrl.Navigate("http://www.codeproject.com",
NULL, NULL, NULL, NULL);
Delete the old contents of the OnOK
function and add the previous line in its place. Thus the OnOk
function will look like this:
void CWebBrowserDlg::OnOK()
{
m_WebBrowserCtrl.Navigate("http://www.codeproject.com",
NULL, NULL, NULL, NULL);
}
Now would be a good time to test your application. Once your dialog is opened, click on OK, this should browse into the Code Project main web page.
More functions
Let's now explore a few functions for this ActiveX control:
void Navigate2(VARIANT * URL, VARIANT *Flags, VARIANT * TargetFrameName,
VARIANT *PostData, VARIANT *Headers)
The same as Navigate
, only this function also allows you to load files.
void GoBack()
void GoForward()
These two functions can be used to go forward and backward between browsed pages. Obviously, each has to have its own button on the dialog.
void GoHome()
This function will browse to the web page selected as the User Homepage, in the User Options for Internet Explorer.
void GoSearch()
This function will go to the Microsoft Internet search website.
void Refresh()
This function will refresh the current webpage.
void Stop()
This function stops loading the current page.
CString GetLocationName()
This function gets the name of the location, which is the string that is shown at the title bar of the normal Internet Explorer instance.
CString GetLocationURL()
This function gets the URL or the web address of the current web page.
There are other functions which you can use, you can find them all in MSDN under CHtmlView
.
Events and messages
This component offers a wide range of events. To access the events, you can use the class wizard. Click the ActiveX control on the dialog, then press Ctrl and W, or right click on the control and select Events.... You will see a list of possible events you may want to use. Here are a few of them to get you started:
BeforeNavigate2
This event is fired before a navigation process to a URL starts.
NavigateComplete2
This event is fired after a navigation process to a URL is done, and the page is loaded.
You can check all the other events, and use them in your applications as you might need, or see fit.
I hope this was as much fun to read as it was to write :)
Credits
For the animated images in the demo project, I used the article by Oleg Bykov. It is available on Code Project: Add GIF-animation to your MFC and ATL projects with the help of CPictureEx and CPictureExWnd .