Windows XP-Style Menus and ToolTips Using HTML for Applications

Environment: COM, VC++

Introduction

In the hope of inspiring Windows XP design to be mutual, I challenged myself to create a code example that would display menus with items like those when you click the Start button, when you get a few text lines for one item, a very beautiful 48×48 true-color icon, and, of course, a ToolTip for each item. However, after a few attempts, I realized how difficult this task can be in terms of all the alignments and drawings; all can just bog you down coding for months and months. The example I’m giving here indeed does what I planned; it displays that sort of menu items and ToolTips, but it does so in the simplest possible way you could ever imagine. I realize how many code examples out there today that implement the same thing—handling in one way or another drawing routines, loading toolbars along with menus, using the Windows API for complex drawing procedures, and so on and so forth. This example is an attempt to turn all such solutions into a history; it’s the century of open source code out there, so prepare for the era of HTML for Applications.

This article and the downloadable example explain how to draw a single menu item so that developers could create their own libraries to support XP menus. The given example illustrates how easy it can be to use HTML for Applications to perform drawing operations.

How to Draw a Menu Item by Using HTML for Applications

Let’s assume we’re working with an MFC application using either an SDI or MDI architecture. We will create an XP menu item in our menu File, submenu ID_FILE_OPEN, using the following steps:

1. Include the VXPLib.h file in your stdafx.h in the following way:

     #define VXPLIB_WITH_EVENTS
     #include "VXPLib.h"
   

   We need to declare VXPLIB_WITH_EVENTS because we are going to handle HTML events. HTML events are implemented using ATL; therefore, it is necessary to use ATL in the project.

2. Now, add ATL support if you do not have it in your project. If you do have it already, ignore this step.
   • Add CComModule _Module; in your MainFrm.cpp.
   • In your App::InitInstance, you must have AfxOleInit() as the first line, and then _Module.Init(NULL, GetModuleHandle(NULL));.
3. Create a menu item class like the one in the example, called CMenuItem.
4. Make the menu item ownerdrawn. The following code can be used:

     int CMainFrame::OnCreate(LPCREATESTRUCT lpCreateStruct)
     {
     ...
       HMENU hMenu = *GetMenu()->GetSubMenu(0);
       // Retrieving the "File" pop-up menu
       MENUITEMINFO mi;
       mi.cbSize = sizeof(MENUITEMINFO);
       mi.fMask = MIIM_TYPE;
       mi.fType = MFT_OWNERDRAW;
       // Making the menu item ownerdrawn:
       SetMenuItemInfo(hMenu, ID_FILE_OPEN, FALSE, &mi);
     ...
     }
   

5. Redirect drawing calls in void CMainFrame::OnDrawItem(int nIDCtl, LPDRAWITEMSTRUCT lpDrawItemStruct), and void CMainFrame::OnMeasureItem(int nIDCtl, LPMEASUREITEMSTRUCT lpMeasureItemStruct) into the HTML parser as shown in the example, and this is it.
6. Register the VXPLib.dll file on your PC. It must be either the Windows 2000 or XP operating system. For instance, you can use regsvr32.exe vxplib.dll.

If somebody ever tried to use/create custom menus, the example given here will be more than enough to understand how drawing happens. There will be more articles on HTML for Applications, so take your time and get started on the new technology.

Note: The example requires Windows2000/XP.

Downloads

Download demo project – 177 Kb

Also, please go to www.tooltips.net for further documentation and more examples.