Scribd
Upload
47 views

How To - Display Side-Aligned Tabs With TabControl - Windows Forms .NET Framework - Microsoft Docs

This document provides instructions for displaying tabs vertically and aligned to the right side of a TabControl in Windows Forms. It explains that by default, vertical tabs have a poor user experience because the tab text does not display. The document then provides steps to set properties like Alignment, SizeMode, and ItemSize to control the tab layout. It also describes handling the DrawItem event to render the tab text from left to right to improve the vertical tab experience.

Uploaded by

saddam alameer
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
47 views

How To - Display Side-Aligned Tabs With TabControl - Windows Forms .NET Framework - Microsoft Docs

This document provides instructions for displaying tabs vertically and aligned to the right side of a TabControl in Windows Forms. It explains that by default, vertical tabs have a poor user experience because the tab text does not display. The document then provides steps to set properties like Alignment, SizeMode, and ItemSize to control the tab layout. It also describes handling the DrawItem event to render the tab text from left to right to improve the vertical tab experience.

Uploaded by

saddam alameer
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

How to: Display Side-Aligned Tabs with

TabControl
03/30/2017 • 2 minutes to read •
In this article
See also

The Alignment property of TabControl supports displaying tabs vertically (along the left
or right edge of the control), as opposed to horizontally (across the top or bottom of
the control). By default, this vertical display results in a poor user experience, because
the Text property of the TabPage object does not display in the tab when visual styles
are enabled. There is also no direct way to control the direction of the text within the
tab. You can use owner draw on TabControl to improve this experience.
The following procedure shows how to render right-aligned tabs, with the tab text
running from left to right, by using the "owner draw" feature.

To display right-aligned tabs


1. Add a TabControl to your form.
2. Set the Alignment property to Right.
3. Set the SizeMode property to Fixed, so that all tabs are the same width.
4. Set the ItemSize property to the preferred fixed size for the tabs. Keep in mind that
the ItemSize property behaves as though the tabs were on top, although they are
right-aligned. As a result, in order to make the tabs wider, you must change the
Height property, and in order to make them taller, you must change the Width
property.
For best result with the code example below, set the Width of the tabs to 25 and
the Height to 100.
5. Set the DrawMode property to OwnerDrawFixed.
6. Define a handler for the DrawItem event of TabControl that renders the text from
left to right.
public Form1()
{
// Remove this call if you do not program using Visual
Studio.
InitializeComponent();

tabControl1.DrawItem += new
DrawItemEventHandler(tabControl1_DrawItem);
}

private void tabControl1_DrawItem(Object sender,


System.Windows.Forms.DrawItemEventArgs e)
{
Graphics g = e.Graphics;
Brush _textBrush;

// Get the item from the collection.


TabPage _tabPage = tabControl1.TabPages[e.Index];

// Get the real bounds for the tab rectangle.


Rectangle _tabBounds = tabControl1.GetTabRect(e.Index);

if (e.State == DrawItemState.Selected)
{

// Draw a different background color, and don't paint a


focus rectangle.
_textBrush = new SolidBrush(Color.Red);
g.FillRectangle(Brushes.Gray, e.Bounds);
}
else
{
_textBrush = new System.Drawing.SolidBrush(e.ForeColor);
e.DrawBackground();
}

// Use our own font.


Font _tabFont = new Font("Arial", 10.0f, FontStyle.Bold,
GraphicsUnit.Pixel);

// Draw string. Center the text.


StringFormat _stringFlags = new StringFormat();
_stringFlags.Alignment = StringAlignment.Center;
_stringFlags.LineAlignment = StringAlignment.Center;
g.DrawString(_tabPage.Text, _tabFont, _textBrush,
_tabBounds, new StringFormat(_stringFlags));
}

See also
TabControl Control
Is this page helpful?
 Yes  No

You might also like