Click here to Skip to main content
15,884,099 members
Articles / Desktop Programming

TabCtrl - Adjustable Control with Zooming and Scrolling Tabs

Rate me:
Please Sign up or sign in to vote.
4.97/5 (140 votes)
25 Mar 2021Public Domain2 min read 216.7K   22.8K   346   107
In this article, you will learn about an adjustable control that has zooming and scrolling tabs, dragging with the mouse, custom drawing and much more.

Sample Image

Introduction

Tabs can be top or bottom of child windows. The user can drag tabs using the mouse. Control has a zoom (shrink of tabs) and scrolling tabs mode. Also, if there is one tab, the area of tabs can be hidden.

Control has 28 built-in tab drawing styles, including tabs VS2003, VS2008, VS2010 and VS2019. Drawing for all styles is created programmatically and does not require resources. You can create your own style by editing an existing render class or creating a new one.

This control is based on CWnd class and can be placed as a child window anywhere, for example, in the client area of the frame or dialog.

Using the Code

Child windows are added using their HWND and they can be of any type, for example, modeless dialogs. TabCtrl consists of three areas: control area, tabs area, windows area. This knowledge can be useful to you when creating a drawing class and working with TabCtrl functions.

Sample Image

To create the control and add elements to it, you can do the next steps:

C++
#include "TabCtrl.h"

TabCtrlEx<TabCtrlStyle_VS2019_client_light> m_TabCtrl;
CListCtrl m_List1, m_List2;

...

// Creation and initialization of TabCtrl.
if( !m_TabCtrl.Create(this,WS_CHILD | WS_VISIBLE,CRect(0,0,0,0),ID_TabCtrl) )
    return -1;    // error.

// Creation of ImageList with icons for buttons (close, menu, scroll) and for tabs.
if( !m_TabCtrl.CreateSystemImage(NULL,IDB_IMAGES_SYSTEM,true,14) ||
    !m_TabCtrl.CreateImage(NULL,IDB_IMAGES_TAB_NORMAL,IDB_IMAGES_TAB_DISABLE,true,16) )
    return -1;    // error.

// Creation of child windows.
if( !m_List1.Create(WS_CLIPCHILDREN | LVS_REPORT,CRect(0,0,0,0),&m_TabCtrl,ID_List1) ||
    !m_List2.Create(WS_CLIPCHILDREN | LVS_REPORT,CRect(0,0,0,0),&m_TabCtrl,ID_List2) )
    return -1;    // error.
m_List1.InsertColumn(0,"Mail",LVCFMT_LEFT,100);
m_List2.InsertColumn(0,"Calendar",LVCFMT_LEFT,100);

// Attaching of child windows to the TabCtrl.
if( !m_TabCtrl.Add(m_List1,"Mail",0) ||
    !m_TabCtrl.Add(m_List2,"Calendar",1) )
    return -1;    // error.

// Load state from registry and update.
m_TabCtrl.LoadState(AfxGetApp(),"TabCtrl","State");
m_TabCtrl.Update();

Class TabCtrl does not perform any rendering. For its drawing, it calls the functions of TabCtrl::Draw interface. To draw TabCtrl, you need to create an object inherited from the TabCtrl::Draw class, implement its functions, and pass the TabCtrl::Draw pointer to TabCtrl using the TabCtrl::SetDrawManager function call.

Similarly, a TabCtrl::IRecalc interface is used to specify the size and spacing between TabCtrl areas. A TabCtrl::IBehavior interface will help you adjust the behavior of the TabCtrl, and a TabCtrl::ToolTip will help you create tooltips for tabs and buttons. There is also a TabCtrl::Ability class for setting the ability to click on buttons and a TabCtrl::Notify class for notifying about events in TabCtrl.

If you implement any of the above interfaces, then this implementation must exist for the entire time the control is running. If you are working with only one style, then use the template class, TabCtrlEx. The name of the style class is specified as a template parameter, for example:

C++
TabCtrlEx<TabCtrlStyle_VS2003_client> m_TabCtrl;

Some styles have already been created. For example, styles similar to the docking/floating panels in Visual Studio 2003, 2008, 2010 and 2019. See the TabCtrlComplex class in the DemoDlg.h file for a list of all existing style classes.

Classes ITabCtrlStyle::RecalcStub and ITabCtrlStyle::BehaviorStub create a default implementation for the functions of TabCtrl::IRecalc and TabCtrl::IBehavior interfaces respectively. You can use them to create your own style classes.

The control requires a call of Update() after you add or delete tabs, as well as change its properties and state.

Good luck!

History

  • 28th May, 2010: Initial version
  • 10th June, 2010: Added redirect WM_NOTIFY message from child windows to a parent of the TabCtrl control
  • 12th June, 2010: Corrected error display of tooltips
  • 16th March, 2021: Improved sources and text of the article
  • 25th March, 2021: Added a new style and scrolling of tabs with the mouse wheel

License

This article, along with any associated source code and files, is licensed under A Public Domain dedication


Written By
Software Developer
Canada Canada

Comments and Discussions

 
GeneralRe: why not support CWnd ,CDialog? Pin
hui16828-Jul-10 8:05
hui16828-Jul-10 8:05 
GeneralMy vote of 5 Pin
yuluhz23-Jul-10 18:30
yuluhz23-Jul-10 18:30 
GeneralMy vote of 5 Pin
Bill Gord19-Jul-10 14:31
professionalBill Gord19-Jul-10 14:31 
GeneralMy vote of 5 Pin
eleqi12-Jul-10 22:51
eleqi12-Jul-10 22:51 
GeneralMy vote of 5 Pin
aaa94526011-Jul-10 4:18
aaa94526011-Jul-10 4:18 
GeneralMy vote of 5 Pin
aaa94526011-Jul-10 4:18
aaa94526011-Jul-10 4:18 
Questioncan be use in c#? Pin
iamcoder1-Jul-10 18:29
iamcoder1-Jul-10 18:29 
AnswerRe: can be use in c#? Pin
Aleh Baradzenka13-Jul-10 8:58
Aleh Baradzenka13-Jul-10 8:58 
Unfortunately I do not know. I have never used a C code in C# programs.
GeneralIt is really great but unspport for 32-bit image list PinPopular
Argon Lam29-Jun-10 5:02
Argon Lam29-Jun-10 5:02 
GeneralRe: It is really great but unspport for 32-bit image list Pin
Aleh Baradzenka13-Jul-10 9:56
Aleh Baradzenka13-Jul-10 9:56 
GeneralReally amazing control Pin
MANISH RASTOGI22-Jun-10 0:49
MANISH RASTOGI22-Jun-10 0:49 
QuestionCommercial license Pin
d3nika12-Jun-10 4:45
d3nika12-Jun-10 4:45 
AnswerRe: Commercial license Pin
Aleh Baradzenka12-Jun-10 6:19
Aleh Baradzenka12-Jun-10 6:19 
QuestionHide a single tab Pin
Joxemi8-Jun-10 10:27
Joxemi8-Jun-10 10:27 
AnswerRe: Hide a single tab Pin
Aleh Baradzenka9-Jun-10 9:20
Aleh Baradzenka9-Jun-10 9:20 
Questiongreat tabctrl :) but I met one problem Pin
happycampus7-Jun-10 4:32
happycampus7-Jun-10 4:32 
AnswerRe: great tabctrl :) but I met one problem Pin
Aleh Baradzenka7-Jun-10 10:14
Aleh Baradzenka7-Jun-10 10:14 
AnswerRe: great tabctrl :) but I met one problem Pin
happycampus7-Jun-10 15:55
happycampus7-Jun-10 15:55 
GeneralRe: great tabctrl :) but I met one problem Pin
Aleh Baradzenka7-Jun-10 22:03
Aleh Baradzenka7-Jun-10 22:03 
GeneralRe: great tabctrl :) but I met one problem Pin
happycampus8-Jun-10 15:34
happycampus8-Jun-10 15:34 
Generalchange to wtl/atl Pin
davyy4-Jun-10 21:25
davyy4-Jun-10 21:25 
GeneralRe: change to wtl/atl Pin
Aleh Baradzenka4-Jun-10 22:52
Aleh Baradzenka4-Jun-10 22:52 
GeneralRe: change to wtl/atl Pin
davyy6-Jun-10 19:23
davyy6-Jun-10 19:23 
GeneralRe: change to wtl/atl Pin
John M. Drescher7-Jun-10 7:41
John M. Drescher7-Jun-10 7:41 
GeneralRe: change to wtl/atl Pin
Aleh Baradzenka7-Jun-10 10:19
Aleh Baradzenka7-Jun-10 10:19 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.