¿Qué es un control personalizado?

En este artículo se presentan los controles personalizados y se describe cómo son diferentes de los controles de usuario. Los controles personalizados no proporcionan una superficie de diseño visual y se basan en el código proporcionado por el usuario para su representación. Este diseño difiere de los controles de usuario, que proporcionan una superficie de diseño visual para agrupar varios controles en una sola unidad reutilizable.

Use controles personalizados cuando un control o control de usuario existente no esté cerca de proporcionar la interfaz de usuario o la interactividad que necesite. Requieren más esfuerzo por su parte para implementar completamente. Windows Forms sigue proporcionando control de teclado y ratón, pero debe implementar comportamientos específicos. Un control personalizado no incluye una superficie de diseño porque todo el dibujo se realiza mediante código en el OnPaint método . Todavía puede agregar componentes, como un Timer, a través de la superficie de diseño no visual.

Clase base

Al crear un control personalizado, elija entre dos clases base:

• System.Windows.Forms.Control

  Esta clase base es la misma que usan otros controles de Windows Forms. Controla directamente la entrada y salida del control.

• System.Windows.Forms.ScrollableControl

  Algunos controles de Windows Forms usan esta clase base. Se extiende Control agregando la habilidad para desplazarse por el contenido.

A menos que necesite desplazarse por el contenido del control personalizado, use Control como clase base.

Funcionalidades heredadas

Dado que la clase base de un control personalizado es Control, hereda automáticamente la funcionalidad de Windows Forms compartida por todos los controles. Estas son algunas de las funcionalidades que obtiene con un control personalizado:

• Entrada de teclado y mouse.
• Comportamientos de diseño, como anclaje y acoplamiento.
• Compatibilidad con tabulaciones.
• Restricciones de tamaño mínimo y máximo.

Pintura

Pintar significa renderizar el objeto visual del control. Para realizar esta tarea, invalide el OnPaint método . Para obtener más información sobre cómo los controles realizan el pintado, vea Pintar y dibujar en controles.

Al crear un control personalizado mediante las plantillas de Visual Studio, invalida automáticamente el OnPaint método . La plantilla lo hace porque necesitas escribir el código que dibuja tu control. Este es un ejemplo de lo que genera la plantilla:

public partial class CustomControl1 : Control
{
    public CustomControl1()
    {
        InitializeComponent();
    }

    protected override void OnPaint(PaintEventArgs pe)
    {
        base.OnPaint(pe);
    }
}

Public Class CustomControl1

    Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)
        MyBase.OnPaint(e)

        'Add your custom paint code here
    End Sub

End Class

Se pinta un control personalizado usando el método OnPaint. Este método toma un único argumento, un PaintEventArgs objeto , que proporciona toda la información y la funcionalidad que necesita para representar el control. PaintEventArgs proporciona dos propiedades que se usan en la representación del control:

• PaintEventArgs.ClipRectangle: representa la parte del control que debe volver a dibujarse. Esta parte puede ser todo el control o simplemente una sección de ella.

• Graphics: representa la superficie gráfica del control. Ofrece varios objetos y métodos orientados a gráficos que proporcionan la funcionalidad necesaria para dibujar el control.

Se llama al OnPaint método cada vez que se dibuja o actualiza el control en la pantalla, y el PaintEventArgs.ClipRectangle objeto representa el rectángulo en el que tiene lugar el dibujo. Si es necesario actualizar todo el control, PaintEventArgs.ClipRectangle representa el tamaño de todo el control. Si solamente es necesario actualizar una parte del control, representa únicamente la región que debe ser redibujada. Un ejemplo de este tipo de caso sería cuando otro control de la interfaz de usuario oculta parcialmente un control y ese otro control se aleja, la parte recién expuesta del control subyacente debe volver a dibujarse.

El código en el método OnPaint de un control se ejecuta cuando el control se dibuja por primera vez y cada vez que se invalida. Para asegurarte de que el control se vuelve a dibujar cada vez que se cambia el tamaño, agrega la siguiente línea al constructor de tu control:

SetStyle(ControlStyles.ResizeRedraw, true);

SetStyle(ControlStyles.ResizeRedraw, True)

Ejemplo

El siguiente fragmento de código es un control personalizado que representa varios rectángulos de color alrededor del borde del control.

protected override void OnPaint(PaintEventArgs pe)
{
    Rectangle rect = this.ClientRectangle;

    // Bring the width/height in by 1 pixel so the rectangle is drawn inside the control.
    // Otherwise, it kind of overlaps the outside edge.
    rect.Width -= 1;
    rect.Height -= 1;

    Pen[] colorPens = new Pen[] { Pens.Blue, Pens.BlueViolet,
                                  Pens.AliceBlue, Pens.CornflowerBlue,
                                  Pens.Cyan, Pens.DarkCyan };

    foreach (Pen pen in colorPens)
    {
        pe.Graphics.DrawRectangle(pen, rect);
        rect.Inflate(-1, -1);
    }

    // Raise the Paint event so users can custom paint if they want.
    base.OnPaint(pe);
}

Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)

    Dim rect As Rectangle = Me.ClientRectangle

    'Bring the width/height in by 1 pixel so the rectangle is drawn inside the control.
    'Otherwise, it kind of overlaps the outside edge.
    rect.Width -= 1
    rect.Height -= 1

    Dim colorPens As Pen() = {Pens.Blue, Pens.BlueViolet,
                                Pens.AliceBlue, Pens.CornflowerBlue,
                                Pens.Cyan, Pens.DarkCyan}

    For Each curPen As Pen In colorPens

        e.Graphics.DrawRectangle(curPen, rect)
        rect.Inflate(-1, -1)

    Next

    'Raise the Paint event so users can custom paint if they want.
    MyBase.OnPaint(e)

End Sub

El código anterior crea un control similar a la siguiente imagen:

Contexto

Observe que el fondo del control se pinta con el SystemColors.Control color, aunque el OnPaint código no borre o rellene el control con un color. El OnPaintBackground(PaintEventArgs) método pinta el fondo antes de llamar a OnPaint. Invalide OnPaintBackground para controlar el dibujo del fondo del control. La implementación predeterminada de este método dibuja el color y la imagen establecidos por las BackColor propiedades y BackgroundImage , respectivamente.

Contenido relacionado

• Creación de un control personalizado sencillo
• Introducción a los controles personalizados