Skip to content

Pravin Paratey

Natural Language Processing, Data mining and Information Extraction consultant based in London.

Jul 26 2008
Jul 26 2008

Lesson 3 - Resources: Icons, Dialogs and Menus

In this lesson we'll take a look at Windows Resources. You'll learn to add an icon to your application, add a menu, and version information. You'll also learn to include a very important kind of resource - the Dialog resource.

Resources

Resources are data that you can add to the applications executable file (Read more on msdn). Resources can be:

Add two new files to your project. Name them resource.h and resource.rc. resource.rc will contain the resource definitions and resource.h will define constants.

Adding an application icon

When Windows Explorer has to draw an icon for an .exe file, it looks for the first icon in the executable resource. What this means is, you must number the application icon with the lowest number so that it is found first.

Lets call our application icon IDI_APP_ICON. We give it the lowest possible number 1. Add the following code to the respective files:

resource.h
 1 /* DrawLite - Windows Programming Tutorial
 2  * by Pravin Paratey (March 31, 2007)
 3  * http://pravin.insanityebegins.com/wintut
 4  *
 5  * Source released under
 6  * Creative Commons Attribution-Noncommercial-No Derivative Works 3.0
 7  * http://creativecommons.org/licenses/by-nc-nd/3.0/
 8  */
 9 
10 #define IDI_APP_ICON    1

resource.rc
 1 /* DrawLite - Windows Programming Tutorial
 2  * by Pravin Paratey (March 31, 2007)
 3  *
 4  * Source released under
 5  * Creative Commons Attribution-Noncommercial-No Derivative Works 3.0
 6  * http://creativecommons.org/licenses/by-nc-nd/3.0/
 7  */
 8 
 9 #include <windows.h>
10 #include "resource.h"
11 
12 IDI_APP_ICON   ICON    DISCARDABLE "res\\draw.ico"

Download draw.ico and place it in the a folder called res. This folder will contain all our resource files (*.bmp, *.ico, etc). Our folder structure will now resemble:

./ +-- DrawLite.cbp
   +-- DrawLite.layout
   +-- ./bin/ +- DrawLite.exe
              +- DrawLite.exe.Manifest
              +- (Other binaries)
   +-- ./res/ +- draw.ico
   +- main.cpp
   +- MainWindow.cpp
   +- MainWindow.h
   +- resource.h
   +- resource.rc

Press Ctrl+F9 to build your project. If you go the bin folder now, you will see that the icon has changed. However, running the application does not show the icon in the top left corner. This is fixed by changing lines 28 and 33 of MainWindow.cpp as follows:

MainWindow.cpp
27 m_wndClass.hInstance = hInstance; // Instance of the application
28 m_wndClass.hIcon = LoadIcon(hInstance, MAKEINTRESOURCE(IDI_APP_ICON)); // Class Icon
29 m_wndClass.hCursor = LoadCursor(NULL, IDC_ARROW); // Class cursor
30 m_wndClass.hbrBackground = (HBRUSH) (COLOR_WINDOW); // Background brush
31 m_wndClass.lpszMenuName = NULL; // Menu Resource
32 m_wndClass.lpszClassName = m_szClassName; // Name of this class
33 m_wndClass.hIconSm = LoadIcon(hInstance, MAKEINTRESOURCE(IDI_APP_ICON)); // Small icon for this class

You'll also have to add #include "resource.h" to MainWindow.cpp before hitting build.

What happens if the top level windows' class icon isn't the lowest numbered icon? Try it. You'll see something odd. Explorer displays one icon and the top left corner of your application displays another icon.

Adding an About dialog

Let's add an About box to our app. The first thing we need to do, is to define a dialog resource. Edit resource.rc and add:

resource.rc
13 IDI_APP_ICON   ICON    DISCARDABLE "res\\draw.ico"
14 
15 // About window
16 IDD_ABOUT   DIALOG  DISCARDABLE 32, 32, 180, 100
17 STYLE   DS_MODALFRAME | WS_POPUP | WS_CAPTION | WS_SYSMENU
18 CAPTION "About DrawLite"
19 FONT 8, "MS Sans Serif"
20 BEGIN
21     CTEXT   "DrawLite v0.1", IDC_STATIC, 40, 12, 100, 8
22     DEFPUSHBUTTON   "&Ok", IDOK, 66, 80, 50, 14
23     CTEXT   "A drawing application for windows", IDC_STATIC, 7, 52, 166, 8
24 END

Numeric Identifiers

The symbols IDI_APP_ICON and IDD_ABOUT are called numeric indentifiers. They're used in place of numbers simply because its easier to remember IDD_ABOUT rather than 100.

Terms like STYLE, CAPTION and BEGIN are keywords. To learn more about them, look up your Win32 docs or MSDN under Resources.

Okaay. But what's with the IDD?

Right. Long back, people used the Hungarian notation at Microsoft (perhaps they still do), and so most of the example code was written in Hungarian. I guess I caught the habit. I personally find it rather convenient.

In our code, IDD_ABOUT would mean ID for a Dialog named ABOUT. The idea is that you can learn about the variable (or constant) by merely looking at it.

We'll have to define IDD_ABOUT and IDC_STATIC. We'll arbitrarily assign them numbers:

resource.h
10 #define IDI_APP_ICON    1
11 
12 #define IDD_ABOUT   100
13 #define IDC_STATIC  101

Next, lets add code to handle the About Dialog. Create two files AboutDialog.cpp and AboutDialog.h with the code:

AboutDialog.cpp
 50 /* DrawLite - Windows Programming Tutorial
 51  * by Pravin Paratey (April 22, 2007)
 52  *
 53  * Source released under
 54  * Creative Commons Attribution-Noncommercial-No Derivative Works 3.0
 55  * http://creativecommons.org/licenses/by-nc-nd/3.0/
 56  */
 57 
 58 #include <windows.h>
 59 #include "AboutDialog.h"
 60 #include "resource.h"
 61 
 62 AboutDialog::AboutDialog()
 63 {
 64 }
 65 
 66 AboutDialog::~AboutDialog()
 67 {
 68 }
 69 
 70 // Function: Run
 71 // Returns: Result of the DialogBox
 72 int AboutDialog::Run(HINSTANCE hInstance, HWND hParent)
 73 {
 74     int retval = DialogBox(
 75         hInstance,
 76         MAKEINTRESOURCE(IDD_ABOUT), // Dialog template
 77         hParent, // Pointer to parent hwnd
 78         DialogProc);
 79 
 80 }
 81 
 82 // Function: DialogProc
 83 // Handles the messages for the About dialog
 84 BOOL CALLBACK
 85     AboutDialog::DialogProc (HWND hwnd, UINT msg, WPARAM wParam, LPARAM lParam)
 86 {
 87     int retVal = false;
 88     switch(msg)
 89     {
 90     case WM_INITDIALOG:
 91         retVal = true;
 92         break;
 93     case WM_COMMAND:
 94         if(LOWORD(wParam)== IDOK)
 95             EndDialog(hwnd, TRUE);
 96         break;
 97     case WM_CLOSE:
 98         EndDialog(hwnd, TRUE);
 99         break;
100     }
101     return retVal;
102 }

AboutDialog.h
50 /* DrawLite - Windows Programming Tutorial
51  * by Pravin Paratey (April 22, 2007)
52  *
53  * Source released under
54  * Creative Commons Attribution-Noncommercial-No Derivative Works 3.0
55  * http://creativecommons.org/licenses/by-nc-nd/3.0/
56  */
57 
58 #include <windows.h>
59 #include "resource.h"
60 
61 // Class: AboutDialog
62 // Draws the About Dialog
63 class AboutDialog
64 {
65 public:
66     AboutDialog();
67     ~AboutDialog();
68     static BOOL CALLBACK DialogProc (HWND hwnd, UINT msg, WPARAM wParam, LPARAM lParam);
69     int Run(HINSTANCE hInstance, HWND hParent);
70 
71 private:
72     HWND m_hwnd;
73 };

Hit Ctrl+F9 to build. You should get no errors. We haven't added code to display the About box yet, so that's what we'll do now:

MainWindow.cpp
50 case WM_DESTROY:
51         PostQuitMessage (0);
52         break;
53     case WM_LBUTTONDOWN:
54         AboutDialog* dlg = new AboutDialog();
55         dlg->Run(m_hInstance, hwnd);
56         delete dlg; dlg = NULL;
57         break;
58     default:
59         return DefWindowProc (hwnd, msg, wParam, lParam);

Hit F9 to build and run. Clicking anywhere on the window should cause the About Dialog to pop up.

3:2

Good job! You're almost done for today. Next, we'll learn to add menus and wrap up by adding version information to our project.

Exercise

Add an icon to the About Dialog:

3:3

Hint: ICON IDI_APP_ICON, IDC_STATIC, 80, 28, 32, 32

Menus

Adding static menus is deceptively simple. All you have to do is define a Menu structure like so:

resource.rc
27 IDM_MAINMENU MENU DISCARDABLE
28 BEGIN
29     POPUP "&File"
30     BEGIN
31         MENUITEM "&New\tCtrl+N", IDM_FILE_NEW
32 		MENUITEM "&Open\tCtrl+O", IDM_FILE_OPEN
33 		MENUITEM "&Save\tCtrl+S", IDM_FILE_SAVE
34 		MENUITEM SEPARATOR
35         MENUITEM "E&xit", IDM_FILE_EXIT
36     END
37     POPUP "&Help"
38     BEGIN
39         MENUITEM "&About", IDM_HELP_ABOUT
40     END
41 END

resource.h
12 #define IDC_STATIC  101
13 #define IDM_MAINMENU    200
14 #define IDM_FILE_NEW    201
15 #define IDM_FILE_OPEN   203
16 #define IDM_FILE_SAVE   204
17 #define IDM_FILE_EXIT   205
18 #define IDM_HELP_ABOUT  206

And then, change line 32 in MainWindow.cpp to:

MainWindow.cpp
31 m_wndClass.hbrBackground = (HBRUSH) (COLOR_WINDOW); // Background brush
32     m_wndClass.lpszMenuName = MAKEINTRESOURCE(IDM_MAINMENU); // Menu Resource
33     m_wndClass.lpszClassName = m_szClassName; // Name of this class

And tada!

3:4

Handling user input

When a menu item is clicked, a WM_COMMAND message is sent to our application. The WM_COMMAND message looks like:

wNotifyCode = HIWORD(wParam); // notification code
wID = LOWORD(wParam); // item, control, or accelerator identifier
hwndCtl = (HWND) lParam; // handle of control

While we could work with wParam and lParam ourselves, Windows provides a better mechanism for handling WM_ messages - through the HANDLE_WM_ macros. They are defined in windowsx.h. For WM_COMMAND, we use the HANDLE_WM_COMMAND macro defined as,

HANDLE_WM_COMMAND(HWND hwnd, WPARAM wParam, LPARAM lParam,
    (void *)OnCommand (HWND hwnd, int id, HWND hCtl, UINT codeNotify))

windowsx.h

This header files contains many macros designed to make coding easier. Take a look at it. Some of the stuff in there is really interesting. You'll find it in the include folder of your development environment.

Enough of that. Lets code:

MainWindow.cpp
 9 #include <windows.h>
10 #include <windowsx.h>
11 #include "MainWindow.h"

53 case WM_DESTROY:
54         PostQuitMessage (0);
55         break;
56     case WM_COMMAND:
57         HANDLE_WM_COMMAND(hwnd, wParam, lParam, OnCommand);
58         break;
59     default:

63 // Function: OnCommand
64 // Handles WM_COMMAND messages (Menu, toolbar, etc)
65 void MainWindow::OnCommand(HWND hwnd, int id, HWND hCtl, UINT codeNotify)
66 {
67     switch(id)
68     {
69     case IDM_FILE_EXIT:
70         PostQuitMessage(0);
71         break;
72     case IDM_HELP_ABOUT:
73         AboutDialog* dlg = new AboutDialog();
74         dlg->Run(m_hInstance, hwnd);
75         delete dlg; dlg = NULL;
76         break;
77     }
78 }

MainWindow.h
18 static LRESULT CALLBACK MainWndProc (HWND hwnd, UINT msg, WPARAM wParam, LPARAM lParam);
19     static void OnCommand(HWND hwnd, int id, HWND hCtl, UINT codeNotify);
20     bool Run(int nCmdShow);

Hit F9. Selecting Help » About should now pop up the About Dialog while File » Exit should quit the app.

Version Info

This adds version info to your application. Read more about it here. In short, it lets us get to:

3:5
3:6

Adding version info involves editing the resource.rc file and adding:

resource.rc
43 VS_VERSION_INFO VERSIONINFO
44  FILEVERSION 1,0,0,1
45  PRODUCTVERSION 1,0,0,1
46  FILEFLAGSMASK VS_FF_PRERELEASE // Which bits are to be taken
47  FILEFLAGS VS_FF_PRERELEASE // This is a pre-release version
48  FILEOS VOS__WINDOWS32 // Built for Windows 32 bit OS
49  FILETYPE VFT_APP // Type of this is Application
50  FILESUBTYPE 0x0L // 0
51 BEGIN
52     BLOCK "StringFileInfo"
53     BEGIN
54         BLOCK "040904B0"
55         BEGIN
56             VALUE "CompanyName", "Pravin Paratey\0"
57             VALUE "FileDescription", "Windows Drawing Application\0"
58             VALUE "FileVersion", "1, 0, 0, 1\0"
59             VALUE "InternalName", "DrawLite\0"
60             VALUE "LegalCopyright", "Copyright (C) 2007\0"
61             VALUE "LegalTrademarks", "\0"
62             VALUE "OriginalFilename", "DrawLite.exe\0"
63             VALUE "ProductName", "DrawLite\0"
64             VALUE "ProductVersion", "1, 0, 0, 1\0"
65         END
66     END
67 END

And that ends our lesson for today. To recap, we learnt about resources. We started off by adding an icon to our app. We followed that by adding an About dialog and a working Menu. In the next lesson, we'll take a break from win32 programming and learn about managing our code better through auto-documentation systems and code versioning.

Previous Lesson
Next Lesson

Latest Articles