Procedimiento para mostrar fichas alineadas a la izquierda con TabControl

La propiedad Alignment de TabControl permite mostrar pestañas verticalmente (a lo largo del borde izquierdo o derecho del control) en lugar de horizontalmente (en la parte superior o inferior del control). De forma predeterminada, esta presentación vertical produce una mala experiencia de usuario porque la propiedad Text del objeto TabPage no se muestra en la pestaña cuando se habilitan estilos visuales. Tampoco existe una forma directa de controlar la dirección del texto dentro de la pestaña. Puede usar el modo dibujado por el propietario de TabControl para mejorar esta experiencia.

El procedimiento siguiente muestra cómo representar pestañas alineadas a la derecha, con el texto de la pestaña escrito de izquierda a derecha usando la característica "dibujado por el propietario".

Para mostrar pestañas alineadas a la derecha

  1. Agregue un TabControl al formulario.

  2. Establezca la propiedad Alignment en Right.

  3. Establezca la propiedad SizeMode en Fixed para que todas las pestañas tengan el mismo ancho.

  4. Establezca la propiedad ItemSize en el tamaño fijo preferido para las pestañas. Tenga en cuenta que la propiedad ItemSize se comporta como si las pestañas estuvieran en la parte superior, aunque estén alineadas a la derecha. Como resultado, para hacer que las pestañas sean más anchas, debe cambiar la propiedad Height y, para que sean más altas, debe cambiar la propiedad Width.

    Para obtener los mejores resultados con el siguiente ejemplo de código, establezca el valor de Width en 25 y el valor de Height en 100.

  5. Establezca la propiedad DrawMode en OwnerDrawFixed.

  6. Defina un controlador para el evento DrawItem de TabControl que representa el texto de izquierda a derecha.

    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));
    }
    
    Private Sub TabControl1_DrawItem(ByVal sender As Object, ByVal e As System.Windows.Forms.DrawItemEventArgs) Handles TabControl1.DrawItem
        Dim g As Graphics = e.Graphics
        Dim _TextBrush As Brush
    
        ' Get the item from the collection.
        Dim _TabPage As TabPage = TabControl1.TabPages(e.Index)
    
        ' Get the real bounds for the tab rectangle.
        Dim _TabBounds As Rectangle = TabControl1.GetTabRect(e.Index)
    
        If (e.State = DrawItemState.Selected) Then
            ' 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()
        End If
    
        ' Use our own font.
        Dim _TabFont As New Font("Arial", 10.0, FontStyle.Bold, GraphicsUnit.Pixel)
    
        ' Draw string. Center the text.
        Dim _StringFlags As New StringFormat()
        _StringFlags.Alignment = StringAlignment.Center
        _StringFlags.LineAlignment = StringAlignment.Center
        g.DrawString(_TabPage.Text, _TabFont, _TextBrush, _TabBounds, New StringFormat(_StringFlags))
    End Sub
    

Consulte también