CodeGuru content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More.
I always wanted to make application’s about box more
graphical with images, animations and music. But it required lots of extra
efforts and so I never ventured into that. Fortunately, with the advent of
Internet Explorer 4.0 and the new technologies it has introduced I can do all
these and a lots more without writing huge amounts of code. One way was to use
the web browser control but it is not always the best solution especially for
handling modal dialog boxes. There is another technique using modal HTML dialogs
– a technology introduced with IE4. Modal dialog boxes host only mshtml.dll the
HTML rendering and parsing engine. So some of features such as the ability to click
on a link and load the link in the same window, favourite and history management
are not available in modal dialogs
(see
Reusing the WebBrowser and MSHTML in Internet Client SDK).
This is good enough for almost all the places where we want only modal dialogs.
How to Use Modal HTML Dialogs
The function SHOWHTMLDIALOGFN in mshtml.dll is the means to display a HTML
dialog. But it requires the usual COM stuff – conversions of strings and all
those things. In order to simplify all of this, I developed a class (CHtmlDialog).
All the COM stuff is hidden and thus, the class is easy to incorporate into
almost any application.
A Simple Case of Using CHtmlDialog
As a simple case suppose you want to use it as an about box. All you have to
do is to write an HTML file and include it in the resource file say as
IDR_ABOUT_HTM. Your OnAppAbout function would look like.
void CHDDemoApp::OnAppAbout()
{
CHtmlDialog dlg(IDR_ABOUT_HTM, AfxGetMainWnd());
dlg.DoModal();
}
The constructor also allows you to pass string resource
IDs or URLs to display. See the Demo program for details. Just by using this
code and including graphics and sound in the HTML resource you can have
sophisticated displays and graphics in your about box without any coding on your part. But there all lots more you can do.
Passing Parameters to the Dialog Box
Just displaying an HTML resource is good but sometimes you may want to do
more like you may want to pass some parameters from the application (like
product id, licensing etc.) to be displayed in the about box. You can pass a
string type or a variant type data to the dialog box. As an example I want to
pass product id, user name, company name and the application version to be
displayed.
In my C++ program I would add the following code.
void CHDDemoApp::OnDemoParam1()
{
CHtmlDialog dlg(IDR_ABOUT1_HTM, AfxGetMainWnd());
CString str = m_strProductID //product ID
+ ";"+ m_strUserName //User Licensed + ";"
+ m_strCompanyName //Company Name
+ ";" + m_strAppVersion;
dlg.SetParam(str);
dlg.DoModal();
}
The C++ side is over. In the actual HTML page we are
displaying we have to include some javascript/vbscript functions. If you are not
familiar with IE4 DHTML you can skip this. Whatever parameter that is passed to
the CHtmlDialog become the dialogArguments property of the
window object in the HTML that is being displayed. So the javascript function would look something like this :
function getParameters()
{
var args = new Array();
args = window.dialogArguments.split(";");//Now display in the document
Productid.innerText = args[0];
UserName.innerText = args[1];
CompanyName.innerText = args[2];
AppVersion.innerText = args[3];
}
Note that Productid, UserName, CompanyName and AppVersion are IE4 DOM elements.
Getting Return Values From the Dialog Box
We have seen that by using both Javascript and C++ we can get
something more. How about passing parameters let the user do something in the
dialog as result of which we get some return values and pass it back to C++ program? As an example I
let the user modify the Username an the company name in the demo
program. Again we have to do something with Javascript and with C++ as described below.
When the HTML window is being closed in the handler of onunload, we place the following code.
function window_onclose()
{
window.returnValue = UserName.value + ";" + CompanyName.value;
}
Just by setting the return Value property the value is conveyed
back to C++ code. The return Value can be any variant. In our C++
code we handle return values by calling function GetReturnString or
GetReturnVariant.
dlg.DoModal(); //Display the dialogCString str = dlg.GetReturnString();
//Now handle the return value in whatever way
Setting the Dialog Size
Upto this point the question never occured how we can set the size. In the
above samples the size was set by using the following tag in the HTML
<HTML style="width: 25em; height: 30em>
CHtmlDialog provides a simple method for setting the size without specifying
in the HTML tags. Just call the function SetDialogSize(int nWidth, int
nHeight); There is another function which can be used to set the size
and that is SetOptions(LPCTSTR lpszOptions);. The option string is of
the format "dialogWidth: xxx; dialogHeight: xxx". Refer to description
of showmodalDialog function in Internet client SDK for more details.
Demo Program
The demo program illustrates all these clearly. Run the demo program. You
will find a menu Demo. Select the demo which you want to see. In the Demo
program I have only one HTML resource page and I adjust the contents depending
on the parameters being send to the program. (A bit of Javascript). The
explanation of the Demo is found in a scrolling marquee on the top of the HTML
dialog you open. Just try it and see it. Feel free to consult me for any
doubts.
Conclusion
My class hides all the internal details of the implementations and thus can
be used without any knowledge of the functions of Internet Client SDK used. The
demo program covers almost all the cases. If you don’t have any idea of
Jvascript or IE4 DOM it is useful to through Internet Client SDK. Together with
HTML and C++ you can provide very rich GUI.
Notes
This project requires
- 1. Internet Explorer 4.0 (or greater). (IE4.0 SP1 is recommended)
- 2. VC++ 6.0 (or greater) or VC++ 5.0 (with Internet Client SDK)
