One of the most useful UI elements that can be simply merged into applications is HTML dialogs. An HTML dialog is a normal dialog, except that it shows HTML content instead of normal dialog elements. You can use any HTML code for an HTML dialog; even you can use DHTML, and scripting, embed Flash animations, use Java applets, and absolutely anything you can do with normal applications. If you are good in designing pages, HTML dialogs provide a rapid way for developing rich user interfaces. Many big applications are using HTML dialogs. The most famous sample is Microsoft Internet Explorer. Open up IE, choose Help | About menu item, and yuppers! What you see is an HTML dialog! Microsoft's Visual Studio .NET IDE also makes heavy use of HTML dialogs for its wizards. So, why shouldn't you use them in your own applications?
Although not difficult, the implementation of an HTML dialog is a big task. The MSHTML.DLL which is the core HTML parser engine of IE exports a function named ShowHTMLDialog which - as you'd guess - is used for showing an HTML dialog. A lot of details must be considered in calling that function, which was the reason I wrote the CHTMLDlg class.
This class enables you to show any HTML dialog easily by using only a few C++ code lines. You create an object of this class, call CHTMLDlg::Init( ), pass the URL (could be a web URL, a ile path, or a res protocol URL) of the HTML document, as well as the handle to the parent window of the dialog (could be NULL, if you don't want the dialog to have any parents) to it, and then call CHTMLDlg::Show( ). CHTMLDlg::Show( ) takes an optional parameter which is a pointer to a VARIANT structure containing some arguments. These arguments can be retrieved from the HTML document's scripts using the window.dialogArguments object. The dialog can also pass data to your application upon returning. The script code inside the dialog sets the window.returnValue object to some meaningful data, and your application retrieves that data in the form of a VARIANT structure by calling CHTMLDlg::GetResult( ). That's it for showing a modal HTML dialog!
There are also several other public member functions inside the CHTMLDlg class under the section of Attributes inside the header file. These are very simple methods which either get or change the properties of the dialog. You can change any of these properties before showing the dialog. The sample application shows how you can use each and every of these properties. Play around with the properties to know how you want the dialog to look, and then study the source code to figure out which methods you have to call to simulate those properties. The sample application also enables you to send arguments to the dialog, and retrieve the returned data from it.
So, you can have dialogs with rich UI and capable of communicating with the host application available, just start inserting HTML dialogs in your own applications. There is a big chance that the users would like the UI better. A nice thing about this is that you can write JavaScript code to manage the user interface items (like disabling a button on some condition, for example) which is far easier than writing C++ code to do the same thing on normal dialogs. The only dependency that using HTML dialogs introduces is that the user should have IE 4 or higher installed on their machine (and who doesn't have that nowadays?!).
To use CHTMLDlg, download the sample application at the bottom of the article, copy and paste the HTMLDlg.h and HTMLDlg.cpp files to your application's directory, add them to your project, and here you go! Start using the CHTMLDlg class! BTW, this class is not dependent upon MFC, so you can even use it inside your SDK projects if you're one of those SDK gurus. Have fun with it!
Download source code for the article
This article originally appeared on BeginThread.com. It's been republished here, and may contain modifications from the original article.