Customised TabControl using C#

Download ColorTabControlExample.zip - 36.46 KB

Introduction

The TabControl included in Visual Studio doesn't allow us to change the property settings of behaviour of the tabcontrol.I searched the Internet for something similar, but couldn't find any resource that satisfied my needs.

Well, here is the control, it appears flat and supports icons and is filled with the backcolor property.

Background

First of all,we need to set the DrawMode property of the TabControl to OwnerDrawFixed.Then we to write the DrawItem event of the TabControl to customise it.

public CTabControl()
{
this.DrawMode = System.Windows.Forms.TabDrawMode.OwnerDrawFixed;
this.DrawItem += new DrawItemEventHandler(this.RepaintControls);
this.Invalidate(); 
}

Normally when we use OwnerDrawFixed DrawMode,the empty right edge of the TabControl will be standard Gray Color.

To set the color for the empty right edge of the TabControl,we need to get that empty area location and paint it with the Form background color.

Brush background_brush = new SolidBrush(Color.DodgerBlue);//Backcolor of the form
Rectangle LastTabRect = this.GetTabRect(this.TabPages.Count - 1);
Rectangle rect = new Rectangle();
rect.Location = new Point(LastTabRect.Right + this.Left, this.Top);
rect.Size = new Size(this.Right - rect.Left, LastTabRect.Height); 
e.Graphics.FillRectangle(background_brush, rect);
background_brush.Dispose();

Full Source Code is

using System;

using System.Collections.Generic;

using System.ComponentModel;

using System.Drawing;

using System.Data;

using System.Text;

using System.Windows.Forms;

namespace ColorTabControlExample

{

public partial class CTabControl : System.Windows.Forms.TabControl

{

public CTabControl()

{

this.ItemSize = new Size(80, 30);

this.DrawMode = System.Windows.Forms.TabDrawMode.OwnerDrawFixed;

this.SetStyle(ControlStyles.AllPaintingInWmPaint, true);

this.DrawItem += new DrawItemEventHandler(this.RepaintControls);

this.Invalidate();

}

 

private void RepaintControls(object sender, DrawItemEventArgs e)

{

Font font;

Brush back_brush;

Brush fore_brush;

Rectangle bounds = e.Bounds;

this.TabPages[e.Index].BackColor = Color.Silver;

if (e.Index == this.SelectedIndex)

{

font = new Font(e.Font, e.Font.Style);

back_brush = new SolidBrush(Color.DimGray);

fore_brush = new SolidBrush(Color.White);

bounds = new Rectangle(bounds.X + (this.Padding.X / 2), bounds.Y + this.Padding.Y, bounds.Width - this.Padding.X, bounds.Height - (this.Padding.Y * 2));

}

else

{

font = new Font(e.Font, e.Font.Style & ~FontStyle.Bold);

back_brush = new SolidBrush(this.TabPages[e.Index].BackColor);

fore_brush = new SolidBrush(this.TabPages[e.Index].ForeColor);

}

string tab_name = this.TabPages[e.Index].Text;

StringFormat sf = new StringFormat();

sf.Alignment = StringAlignment.Center;

sf.LineAlignment = StringAlignment.Center;

e.Graphics.FillRectangle(back_brush, bounds);

e.Graphics.DrawString(tab_name, font, fore_brush, bounds, sf);

Brush background_brush = new SolidBrush(Color.DodgerBlue);

Rectangle LastTabRect = this.GetTabRect(this.TabPages.Count - 1);

Rectangle rect = new Rectangle();

rect.Location = new Point(LastTabRect.Right + this.Left, this.Top);

rect.Size = new Size(this.Right - rect.Left, LastTabRect.Height);

e.Graphics.FillRectangle(background_brush, rect);

background_brush.Dispose();

sf.Dispose();

back_brush.Dispose();

fore_brush.Dispose();

font.Dispose();

}

}

}

Using the Code

To use the code, simply add reference to the CTabControl and change the normal TabControls to CTabControls. All the properties remain unchanged.

Blocks of code should be set as style "Formatted" like this:

            


""cs"">/// <SUMMARY>
/// Summary description for Form1.
/// </SUMMARY>
public class Form1 : System.Windows.Forms.Form
{
  private CTabControl.CTabControl tabControl1;
  
  ...
    
  #region Windows Form Designer generated code
  /// <SUMMARY>
  /// Required method for Designer support - do not modify
  /// the contents of this method with the code editor.
  /// </SUMMARY>
  private void InitializeComponent()
  {
  
  ...
    
    this.tabControl1 = new CTabControl.CTabControl();
  ...
    
  }
  #endregion