Click here to Skip to main content
15,393,863 members
Articles / Desktop Programming
Article
Posted 29 May 2010

Stats

186.5K views
22.1K downloads
341 bookmarked

TabCtrl - Adjustable Control with Zooming and Scrolling Tabs

Rate me:
Please Sign up or sign in to vote.
4.97/5 (139 votes)
25 Mar 2021Public Domain2 min read
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

Share

About the Author

Baradzenka Aleh
Software Developer
Canada Canada

Comments and Discussions

 
Generalgood Pin
landwalker30-May-10 15:30
Memberlandwalker30-May-10 15:30 
Generalnice job Pin
zyj40230130-May-10 15:21
Memberzyj40230130-May-10 15:21 
Generalnice,nice and question about tab function Pin
Andi Sielicki29-May-10 22:37
MemberAndi Sielicki29-May-10 22:37 
GeneralRe: nice,nice and question about tab function Pin
Baradzenka Aleh30-May-10 20:02
MemberBaradzenka Aleh30-May-10 20:02 
GeneralRe: cycling tabs Pin
GAG [Jaguar]2-Jun-10 2:42
MemberGAG [Jaguar]2-Jun-10 2:42 
GeneralRe: cycling tabs Pin
Baradzenka Aleh2-Jun-10 7:32
MemberBaradzenka Aleh2-Jun-10 7:32 
GeneralRe: nice,nice and question about tab function Pin
Blake Miller21-Jun-10 11:26
MemberBlake Miller21-Jun-10 11:26 
Generalthe best article about the tabCtrl i've seen till now ! Pin
m.moestl29-May-10 10:20
Memberm.moestl29-May-10 10:20 
thanks a lot for publish it !
GeneralRe: the best article about the tabCtrl i've seen till now ! Pin
Joxemi16-Jun-10 1:35
MemberJoxemi16-Jun-10 1:35 

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.