Need tutorial on Tab Controls in Windows API

Just wondering if there is any excellent tutorials on Tab Controls in Windows API?

I tried MSDN, but they don't really explain it well enough for me to learn it. A nice descriptive tutorial on this would be helpful.

If it helps, I'm trying to develop a dialog application that has a tabbed interface. This will officially be my first professional and most of all useful win32 program (if I ever get it working that is :)) I just need reliable resources for my learning experiences as I progress through this code. For now, I need information on tab controls :D

I have a big thing against MFC, I don't like how it works. That's my own personal opinion. So, that's why I like Windows API... :)

Again, thanks!

*bump*

No one wants to help? :(

[Moved thread]

Quote:

---

Originally Posted by MrDoomMaster

I have a big thing against MFC, I don't like how it works. That's my own personal opinion. So, that's why I like Windows API... :)

---

I like you ... ;) :D

why not searching the cg articles and/or other developer site articles??
or ask grandfather google ... ;)

I learned from examples, so I will provide you with one:

Code:

---

#include <windows.h>
#include <prsht.h>
#include "resource.h"

static const TCHAR szIniFile[] = TEXT("C:\\test.ini");

typedef struct SETTINGS
{
        TCHAR szEdit1[MAX_PATH];
        TCHAR szEdit2[MAX_PATH];
        TCHAR szEdit3[MAX_PATH];
} SETTINGS, *PSETTINGS;

BOOL LoadSettings(HWND hwnd, PSETTINGS pSettings)
{
        if (!GetPrivateProfileStruct("Test", TEXT("Data"), pSettings, sizeof(SETTINGS), szIniFile))
        {
                // Could not read INI or it doesn't exist.  Use default settings...
                lstrcpy(pSettings->szEdit1, "Init1");
                lstrcpy(pSettings->szEdit2, "Init2");
                lstrcpy(pSettings->szEdit3, "Init3");
        }

        return TRUE;
}

BOOL SaveSettings(HWND hwnd, PSETTINGS pSettings)
{
        return WritePrivateProfileStruct("Test", TEXT("Data"), pSettings, sizeof(SETTINGS), szIniFile);
}

VOID CenterDialog(HWND hwnd)
{
        RECT rcDialog;
        GetWindowRect(hwnd, &rcDialog);
        int cxDialog = rcDialog.right  - rcDialog.left;
        int cyDialog = rcDialog.bottom - rcDialog.top;

        RECT rcWorkArea;
        SystemParametersInfo(SPI_GETWORKAREA, NULL, &rcWorkArea, NULL);
        int cxWorkArea = rcWorkArea.right  - rcWorkArea.left;
        int cyWorkArea = rcWorkArea.bottom - rcWorkArea.top;


        SetWindowPos(hwnd, NULL, rcWorkArea.left + (cxWorkArea - cxDialog) / 2,
                                rcWorkArea.top  + (cyWorkArea - cyDialog) / 2,
                                0, 0, SWP_NOSIZE | SWP_NOACTIVATE);
}

BOOL CALLBACK DialogProcOptions(HWND hwnd, UINT message, WPARAM wParam, LPARAM lParam)
{
        static PSETTINGS pSettings;

        switch (message)
        {
                case WM_INITDIALOG:
                        CenterDialog(GetParent(hwnd));
                        pSettings = (PSETTINGS) ((LPPROPSHEETPAGE) lParam)->lParam;
                        return TRUE;
                       
                case WM_NOTIFY:
                        switch (((LPNMHDR)lParam)->code)
                        {
                                case PSN_SETACTIVE:
                                        switch (PropSheet_HwndToIndex(GetParent(hwnd), hwnd))
                                        {
                                                case 0:
                                                        SetWindowText(GetDlgItem(hwnd, IDC_EDIT1), pSettings->szEdit1);
                                                        break;
                                                case 1:
                                                        SetWindowText(GetDlgItem(hwnd, IDC_EDIT2), pSettings->szEdit2);
                                                        break;
                                                case 2:
                                                        SetWindowText(GetDlgItem(hwnd, IDC_EDIT3), pSettings->szEdit3);
                                                        break;
                                        }
                                        break;
                                case PSN_APPLY:
                                        switch (PropSheet_HwndToIndex(GetParent(hwnd), hwnd))
                                        {
                                                case 0:
                                                        GetWindowText(GetDlgItem(hwnd, IDC_EDIT1), pSettings->szEdit1, sizeof(pSettings->szEdit1) / sizeof(TCHAR));
                                                        break;
                                                case 1:
                                                        GetWindowText(GetDlgItem(hwnd, IDC_EDIT2), pSettings->szEdit2, sizeof(pSettings->szEdit2) / sizeof(TCHAR));
                                                        break;
                                                case 2:
                                                        GetWindowText(GetDlgItem(hwnd, IDC_EDIT3), pSettings->szEdit3, sizeof(pSettings->szEdit3) / sizeof(TCHAR));
                                                        break;
                                        }
                                        break;
                        }
                        return TRUE;

                default:
                        return FALSE;
        }
}

BOOL CALLBACK PropSheetProc(HWND hwnd, UINT uMsg, LPARAM lParam)
{
        typedef struct DLGTEMPLATEEX
        {
                WORD dlgVer;
                WORD signature;
                DWORD helpID;
                DWORD exStyle;
                DWORD style;
                WORD cDlgItems;
                short x;
                short y;
                short cx;
                short cy;
        } DLGTEMPLATEEX, *LPDLGTEMPLATEEX;

        switch (uMsg)
        {
        case PSCB_INITIALIZED:
                {
                LOGFONT lf  = {0};
                lf.lfCharSet = DEFAULT_CHARSET;
                lf.lfHeight  = 13;
                lstrcpy(lf.lfFaceName, TEXT("Tahoma"));
                HFONT hFont  = CreateFontIndirect(&lf);

                SendMessage(PropSheet_GetTabControl(hwnd), WM_SETFONT, (WPARAM) hFont, TRUE);
                SendMessage(GetDlgItem(hwnd, IDOK),        WM_SETFONT, (WPARAM) hFont, TRUE);
                SendMessage(GetDlgItem(hwnd, IDCANCEL),    WM_SETFONT, (WPARAM) hFont, TRUE);

                return TRUE;
                }

        case PSCB_PRECREATE:
                if (((LPDLGTEMPLATEEX)lParam)->signature ==  0xFFFF)
                        ((LPDLGTEMPLATEEX)lParam)->style &= ~DS_CONTEXTHELP;
                else
                        ((LPDLGTEMPLATE)lParam)->style &= ~DS_CONTEXTHELP;

        return TRUE;       
        }

        return 0;
}

int WINAPI WinMain(HINSTANCE hInstance, HINSTANCE hPrevInstance, PSTR pCmdLine, int CmdShow)
{
        SETTINGS settings = {0};
        LoadSettings(NULL, &settings);

        // Define the property pages...
        PROPSHEETPAGE psp[3] = {0};
        for (int i = 0; i < 3; i++)
        {
                psp[i].dwSize      = sizeof(PROPSHEETPAGE);
                psp[i].hInstance  = hInstance;
                psp[i].pszTemplate = MAKEINTRESOURCE(IDD_PROPPAGE1 + i);
                psp[i].lParam      = (LPARAM) &settings;
                psp[i].pfnDlgProc  = DialogProcOptions;
        }

        // Define the property sheet...
        PROPSHEETHEADER psh = {0};
        psh.dwSize          = sizeof(PROPSHEETHEADER);
        psh.dwFlags        = PSH_USEICONID |PSH_PROPSHEETPAGE | PSH_USECALLBACK  | PSH_NOAPPLYNOW;
        psh.hwndParent      = NULL;
        psh.hInstance      = hInstance;
        psh.pszIcon        = MAKEINTRESOURCE(IDI_ICON1);
        psh.pszCaption      = TEXT("<Application Name> Properties");
        psh.nPages          = sizeof(psp) / sizeof(PROPSHEETPAGE);
        psh.ppsp            = (LPCPROPSHEETPAGE) &psp;
        psh.pfnCallback    = PropSheetProc;

        if (PropertySheet(&psh))
                SaveSettings(NULL, &settings);

        return 0;
}

---

The code will load/save a struct from an INI file into the property sheets. It creates three sheets, changes the font to Tahoma, removes the help icon, and centers the dialog.

Look through it and if you have any questions, post them here.

Also, this page frm MSDN will be a huge help:
http://msdn.microsoft.com/library/de.../propsheet.asp

Well, thanks for your responses guys.

Unfortunately, I have already reviewed MSDN's articles on Tab Controls and Property Sheets, yet I don't find them reliable resources to learn on. Perhaps they are adequate for programmers that have had prior experience with tab controls and are very familiar with the functions, structures, and terminology of creating tab controls.

I, however, have not had ANY experience with tab controls except that of which I have learned so far.

As of thus far, I was able to create a dialog in the dialog editor, create a handle for this dialog as my main modeless dialog box. Then, I have create a tab control using CreateWindow(), and I have created my own function for quickly adding a tab to a dialog and returning its index.

Code:

---

int CreateTab(HWND TabCtrl, LPSTR Description)
{
    TCITEM Tab;

    Tab.mask = TCIF_TEXT;
    Tab.pszText = Description;

    return TabCtrl_InsertItem(TabCtrl, 0, &Tab);
}

---

using this function, I created one tab for my tab control. I have also stored this index of the tab in an int array.

Now, I am working on creating a dialog inside of the dialog editor, which has no border and will be attached to the first page of my tab control. Now that I have this dialog done, I don't know how to attach it, or make sure it's the right size, or any of that stuff.

All I know this far I have learned from talking to knowledgable people. If there are no detailed tutorials that can help me out, maybe one of you would make a good personal resource, in case I have questions? I know it's troublesome having to answer a lot of questions for us tab dialog newbies, but perhaps someone won't mind? :)

If no one knows any dialog tutorials, could you give your AIM/Yahoo IM/MSN/ICQ user name, so I can ask questions if need be? On the fly way of me getting answers instead of posting in the forums and waiting hours for reliable answers :D

In any case, I thank you for your example but it is really cryptic to me at the moment.

Well, let's start out with the basics...

We need to create the property sheet pages (or tabs) for the property sheet dialog. We do this be creating an array of PROPSHEETPAGE structures. In this example, I create 3 pages (tabs) for my property sheet dialog.

Code:

---

// Define the property pages...
PROPSHEETPAGE psp[3] = {0};
for (int i = 0; i < 3; i++)
{
        psp[i].dwSize      = sizeof(PROPSHEETPAGE);
        psp[i].hInstance  = hInstance;
        psp[i].pszTemplate = MAKEINTRESOURCE(IDD_PROPPAGE1 + i);
        psp[i].pfnDlgProc  = DialogProcOptions;
}

---

The params should be pretty self-explanatory. The pszTemplate points to the resource of the property page. In this case, I have already created dialogs with ID's of:
IDD_PROPPAGE1
IDD_PROPPAGE2
IDD_PROPPAGE3

and their values in my resource.h file are consecutive. IDD_PROPPAGE1 has a value of 105, IDD_PROPPAGE2 = 106, and IDD_PROPPAGE3 = 107. So, I can easily set their pszTemplate value by using a loop and just adding i to the value of IDD_PROPPAGE1. Hope that makes sense.

pfnDialogProc is just a pointer to an application-defined procedure that is used for your propery sheet dialog, just like any old dialog box procedure. Mine is named DialogProcOptions.


Now that I have my individual pages created, I just need to add them to the main property sheet dialog. That main property sheet dialog is defined by the PROPSHEETHEADER structure. So, I create the structure and add the array of pages:

Code:

---

// Define the property sheet...
PROPSHEETHEADER psh = {0};
psh.dwSize          = sizeof(PROPSHEETHEADER);
psh.dwFlags        = PSH_USEICONID |PSH_PROPSHEETPAGE | PSH_NOAPPLYNOW;
psh.hwndParent      = NULL;
psh.hInstance      = hInstance;
psh.pszIcon        = MAKEINTRESOURCE(IDI_ICON1);
psh.pszCaption      = TEXT("<Application Name> Properties");
psh.nPages          = sizeof(psp) / sizeof(PROPSHEETPAGE);
psh.ppsp            = (LPCPROPSHEETPAGE) &psp;

---

You can check the values of the dwFlags params in MSDN, but the keys here are the nPages variable (# of pages in the property sheet dialog) and the ppsp variable (pointer to the property sheet pages array that we created first).

So, you've created the individual pages (tabs) for your property sheet, and now you've created the property sheet to hold those pages. Now, you can call the function to load the dialog:

Code:

---

PropertySheet(&psh);

---

Now that the dialog is loaded, it will call the application-defined callback function that you defined in the beginning FOR EACH PAGE. An example of this call function is as follows:

Code:

---

BOOL CALLBACK DialogProcOptions(HWND hwnd, UINT message, WPARAM wParam, LPARAM lParam)
{
        switch (message)
        {
                case WM_NOTIFY:
                        switch (((LPNMHDR)lParam)->code)
                        {
                                case PSN_SETACTIVE:
                                        switch (PropSheet_HwndToIndex(GetParent(hwnd), hwnd))
                                        {
                                                case 0:
                                                        // Tab 1 was clicked.  Initialize it.
                                                        break;
                                                case 1:
                                                        // Tab 2 was clicked.  Initialize it.
                                                        break;
                                                case 2:
                                                        // Tab 3 was clicked.  Initialize it.
                                                        break;
                                        }
                                        break;
                                case PSN_APPLY:
                                        switch (PropSheet_HwndToIndex(GetParent(hwnd), hwnd))
                                        {
                                                case 0:
                                                        // Apply was clicked.  Save tab 1 data.
                                                        break;
                                                case 1:
                                                        // Apply was clicked.  Save tab 2 data.
                                                        break;
                                                case 2:
                                                        // Apply was clicked.  Save tab 3 data.
                                                        break;
                                        }
                                        break;
                        }
                        return TRUE;

                default:
                        return FALSE;
        }
}

---

Not much to it. Trust me, it was a pain figuring out how this all worked, but you can just use my template above as your callback function and it should help immensly.

The procedure will receive notifications (WM_NOTIFY) whenever an event occurs in your property sheet. You determine which event occured by examining the code member of the NMHDR structure that is pointed to by lParam.

I have accounted for the following two notifications:
PSN_SETACTIVE -- A property sheet page is becoming active (tab was clicked, etc.)
PSN_APPLY -- the Apply button was clicked. Save your data on each page.


In this example, each page uses the same callback function. You don't have to design your property sheet that way. Back in the beginning, I created a loop to initialize my three pages and I set the pfnDlgProc member to DialogProcOptions for each page. You could make this different for each page, if you wish, maybe:

DialogProcPage1
DialogProcPage2
...

Then, you'd know exactly which page you're processing. In my example, though, I've decided to use the same callback function for all the pages. If you follow that example, you'll need a way to determine which page is currently being processed. I use the PropSheet_HwndToIndex() function to convert the HWND of the property page to an index.

Well, I hope that's enough to get your started!

Nice explanation Bond :thumb:

I have done lots of property sheets before and usually do all of my initialization in WM_INITDIALOG. I don't see why things have to be re-initted each time you change the tab. There's only been one case where I've ever used PSN_SETACTIVE and that was because the options on that page were dependent on a setting from another page.

Also, you should use PSN_KILLACTIVE (in the same WM_NOTIFY case as PSN_SETACTIVE) for error handling when the Apply button is pressed.

Something like

Code:

---

...
BOOL msgResult = FALSE;

case PSN_KILLACTIVE:
{
if (ThereAreErrors())
    msgResult = TRUE;    // Do not let the Apply button take effect
}
...
return msgResult;

---

Wow bond, very helpful! A few inquiries:

1) Since my dialog app will be an app instead of a configuration dialog, do I need an apply button?

2) I see that your dialog resources are contiguous in numbering, 106, 107, etc. Using the dialog editor, is there a way to set the symbolic ID's to your liking? I realize I could open the resource.h file in the text editor and change it, but perhaps there is another way meant to do it? Keep in mind, I'm using Visual Studio .NET 2003

3) How can I ensure that the dialogs I create in the dialog editor (for my property pages) fit the property sheet? Somehow, I would need to make sure it was that correct size in the dialog editor, so I may better position any controls inside of it.

Thanks for your tutorial, it helped a LOT

Quote:

---

Originally Posted by MrDoomMaster

1) Since my dialog app will be an app instead of a configuration dialog, do I need an apply button?

---

I'm not sure what your program is, so I can't answer this. You'll have to determine if an apply button would facilitate the user's experience or not.

Quote:

---

Originally Posted by MrDoomMaster

2) I see that your dialog resources are contiguous in numbering, 106, 107, etc. Using the dialog editor, is there a way to set the symbolic ID's to your liking? I realize I could open the resource.h file in the text editor and change it, but perhaps there is another way meant to do it? Keep in mind, I'm using Visual Studio .NET 2003

---

I'm not sure. Maybe someone else could answer this. I just modify my resource.h file. :)

You could just create an array, like so:

Code:

---

static const UINT uPages[] = { IDD_PROPPAGE1, IDD_PROPPAGE2, IDD_PROPPAGE3 };

---

Then, use uPages[i] in your loop.

Quote:

---

Originally Posted by MrDoomMaster

3) How can I ensure that the dialogs I create in the dialog editor (for my property pages) fit the property sheet? Somehow, I would need to make sure it was that correct size in the dialog editor, so I may better position any controls inside of it.

---

The size of the property sheet will be the size of your largest property page, if I remember correctly.

Quote:

---

Originally Posted by Drum Bouncer

I have done lots of property sheets before and usually do all of my initialization in WM_INITDIALOG. I don't see why things have to be re-initted each time you change the tab. There's only been one case where I've ever used PSN_SETACTIVE and that was because the options on that page were dependent on a setting from another page.

Also, you should use PSN_KILLACTIVE (in the same WM_NOTIFY case as PSN_SETACTIVE) for error handling when the Apply button is pressed.

---

You're right. I was just trying to give a clear explanation of what happens when tabs are clicked, pages are loaded, etc.

WM_INITDIALOG is called once for each page, the first time a page is selected. PSN_SETACTIVE is called everytime a page is selected.

You'd probably be better off just using Drum Bouncer's suggestion and doing initialization for all of your pages in WM_INITDIALOG.

You said it sizes the property sheet to the largest dialog, but, what if I want my property sheet to extend to the very edges of my client rectangle in the dialog it is in?

The requirements would be for the property sheet to extend to the edges of the client rectangle, and for the property sheet pages to be big enough to fit the property sheet, which should be just a bit smaller than the client rect of the parent dialog because of the space required for the tabs

I'm not sure if I really understand what it is that you're trying to do, but if you look back to my first post in this thread, I used a CenterDialog function to position the property sheet dialog in the middle of the screen (work area). You could probably do something similar to set the size.

Here is how I understand it:

Create a dialog >> Create the property sheet and center/size it inside of the dialog >> add dialog resources to each of the tab pages?