Практическое руководство. Отображение расположенных сбоку вкладок с помощью TabControl

Свойство Alignment элемента TabControl поддерживает вертикальное отображение вкладок (вдоль левой или правой границы элемента управления), в отличие от горизонтального отображения (поперек верхней или нижней области элемента управления). Вертикальное отображение по умолчанию бывает неудобным для пользователя, так как свойство Text объекта TabPage не отображается на вкладке при включении стилей оформления. Также не предусмотрена возможность прямого управления направлением текста на вкладке. Для улучшения взаимодействия с пользователем можно использовать рисование владельцем на TabControl.

Ниже описан порядок визуализации вкладок с выравниванием по правому краю, в которых текст располагается слева направо, с помощью возможности "рисование владельцем".

Отображение вкладок с выравниванием по правому краю

  1. Добавьте элемент TabControl в форму.

  2. Задайте для свойства Alignment значение Right.

  3. Присвойте свойству SizeMode значение Fixed так, чтобы все вкладки имели одинаковую ширину.

  4. Для свойства ItemSize установите необходимый фиксированный размер вкладок. Имейте в виду, что свойство ItemSize ведет себя так, как если бы вкладки располагались вверху, несмотря на то что они выровнены по правому краю. Таким образом, чтобы увеличить ширину вкладок, нужно изменить свойство Height, а чтобы сделать их выше, изменить свойство Width.

    Для получения оптимальных результатов в примере кода ниже свойство Width имеет значение 25, а Height — значение 100.

  5. Задайте для свойства DrawMode значение OwnerDrawFixed.

  6. Определите обработчик для события DrawItem элемента TabControl, выводящий текст слева направо.

    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));
}

См. также