XP Themes Tab Control in any orientation

Using CXPTabCtrl, XP Themes Tab Control, left, bottom, and right orientation

1. Introduction

The article shows how to solve a problem that appears on the Windows Tab Control when using the Windows XP operating system with XP Themes enabled. The tab control behaves as it has only one orientation—top. In fact, it has all four orientations, but all four of them (for some reason) have the same appearance.

It is demonstrated how to use the proposed class CXPTabCtrl, a Windows tab control extension, as a solution to this problem. CXPTabCtrl detects the operating system and tab control orientation:

  • If it is not an XP system or XP Themes are not enabled, it uses the default Windows tab behaviour (it does not do anything extra).
  • If it is an XP system and XP Themes are enabled, it draws the tab control properly in the appropriate direction.

The CXPTabCtrl control also works properly if the state of XP Themes enabling is changed during the running of the application. Tab control hot tracking is also supported.

2. Method

There are a lot of Windows applications developed for earlier Windows versions that use bottom or other "not-top" oriented Windows tab control. The problem is: If the application is running on an XP system with XP Themes, the Windows tab control is not shown properly as it used to be.

Problems when using the default SysTabControl32 (CTabCtrl) with XP Themes, bottom orientation

One possibility to solve this problem is to change all tab controls in these applications to be top oriented. This would involve change of the look of the applications and painful Windows resource changes and posssible code changes.

Another possibility (used for CXPTabCtrl) is to use a thin wrapper around the tab control and to simulate missing orientations. CXPTabCtrl uses the available XP Themes "top-tab" look as a template and adapts it for other tab orientations:

  • Bottom orientation:
    1. Use a top background bitmap
    2. Mirror it vertically
    3. Draw icon and text on mirrored background
  • Left orientation:
    1. Use top background bitmap
    2. Draw icon and text on the background
    3. Rotate the bitmap for 900.
  • Right orientation:
    1. Use top background bitmap
    2. Mirror it vertically
    3. Draw icon and text on the background
    4. rotate the bitmap for 900.
  • Top orientation (used only for test purposes, could use default from XP Themes Windows XP):
    1. Use top background bitmap
    2. Draw icon and text

Notice also that the body of the tab control has to be manipulated, mirrored, or rotated, not only the "tab" parts of the tab control (because a "tab body" has texture and shadows).

3. Programming Hints

The CXPTabCtrl class is simple to use. To add it to your project, please follow the steps below:

  1. Put its source files (XPTabCtrl.cpp and XPTabCtrl.h) into the proper project folder and add their file names to your Visual Studio project.
  2. Include its header to the appropriate header file—usually a dialog class header where the CXPTabCtrl class is used.
  3. If you plan to use CXPTabCtrl in several places of your application, you can add it only to your StdAfx.h file:
    #include "XPTabCtrl.h"
  4. You should replace CTabCtrl with CXPTabCtrl everywhere in the project where you want new XP Themes tab behaviour.
    CXPTabCtrl  m_tabCtrl
  5. If CXPTabCtrl has images, the appropriate bitmap IDB_TABIMAGES (or other with correct tab images) should be included as resource bitmap. It is also necessary to call the InitImageList(IDB_TABIMAGES) function, from OnInitDialog or other appropriate initialising place:
  6. m_tabCtrl.InitImageList(IDB_TABIMAGES);    // only necessary
                                               // to call if tabs
                                               // have images
    

Although the tab control orientation is usually set in the resource editor or in the Tab's Create function, CXPTabCtrl orientation can be changed any time while application is running.

4. Other Techniques

This sample could also be used as an example of how to solve some other problems in Windows programming. Other techniques shown in this sample include:

  1. How to mirror a bitmap image vertically quickly and simply by using only two Windows calls, GetDIBits and SetDIBits. This works in any colour resolution.
  2. How to rotate a rectangular bitmap image fast and in any colour resolution.
  3. How to use an inline assembler for lengthy repetitive processing; in this case, rotating bitmap image pixels. If the image has large dimensions (large tab control body), C-style coding could take considerable more time than an assembler version.
  4. How to use XP Themes functions in application, which can run on earlier operating systems.
  5. How to enable XP Themes a dialog texture background.
  6. How to make an application XP Themes-aware by simply copying XP manifest, resource "24", ID "1" from one application resource to another.
  7. How to use tab ToolTips.

5. Testing Conditions

  • The sample is created and compiled on VC++ 6.0 service pack 5.
  • The sample has been tested on Windows XP (XP Themes enabled or disabled while sample was running).
  • The sample has also been tested on Windows 2000 and Windows NT 4.0 (CXPTabCtr does not have effect)
  • Other Windows systems could have possible problems (?)
  • The sample has been tested on these colour resolutions: 8-bit, 16-bit, 24-bit, and 32-bit colours
  • The sample has not been tested on multiline (stacked) tabs; could be problems (?)

6. Feedback

Please post your questions, suggestions, and bug reports only to the forum below.


Downloads

Comments

  • Pure win32 port... kinda

    Posted by hikikomori-san on 02/10/2007 09:49am

    Hi. I've ported most of this code to pure win32 (no MFC). I've left out afew things, but here it is anyway. Feel free to use it anyhow you please. Here is the code with a simple app demonstrating its use. http://www.geocities.com/adelamro2004/files/TabWin32.zip Happy coding, everyone.

    Reply
  • How to change the tab item color ?

    Posted by sms88 on 11/30/2006 10:00pm

    In this demo ,the tab item color is gray ,how can i change the item color to red ?
    
    How to change the tab item color ?

    Reply
  • Guru!!!

    Posted by kaeti on 02/10/2006 08:10am

    I appriciate the logic behind your thinking

    Reply
  • Help!!!

    Posted by kaeti on 02/10/2006 07:57am

    Hello I m a situation where basic things only works for me. the hard part is that i am just a VB.Net learner , but i will be specialising in development software. If possible on your time,and due to what I saw in the way your coding is, I'm asking help with some VB.Net code that can boost my understanding of the caurse. I would like to here from you on the same channel...thanks

    Reply
  • Processing TCN_SELCHANGE message

    Posted by gstyles on 03/23/2005 07:38am

    I cannot get this class to enter the TCN_SELCHANGE message handler. If I change the member variable back to a CTabCtrl type then it works fine. Any ideas anyone?

    Reply
Leave a Comment
  • Your email address will not be published. All fields are required.

Top White Papers and Webcasts

  • Live Event Date: November 20, 2014 @ 2:00 p.m. ET / 11:00 a.m. PT Are you wanting to target two or more platforms such as iOS, Android, and/or Windows? You are not alone. 90% of enterprises today are targeting two or more platforms. Attend this eSeminar to discover how mobile app developers can rely on one IDE to create applications across platforms and approaches (web, native, and/or hybrid), saving time, money, and effort and introducing apps to market faster. You'll learn the trade-offs for gaining long …

  • Live Event Date: October 29, 2014 @ 11:00 a.m. ET / 8:00 a.m. PT Are you interested in building a cognitive application using the power of IBM Watson? Need a platform that provides speed and ease for rapidly deploying this application? Join Chris Madison, Watson Solution Architect, as he walks through the process of building a Watson powered application on IBM Bluemix. Chris will talk about the new Watson Services just released on IBM bluemix, but more importantly he will do a step by step cognitive …

Most Popular Programming Stories

More for Developers

Latest Developer Headlines

RSS Feeds