Guía: Personalizar celdas y columnas en el control DataGridView de Windows Forms mejorando su comportamiento y apariencia

El DataGridView control proporciona varias maneras de personalizar su apariencia y comportamiento mediante propiedades, eventos y clases complementarias. En ocasiones, es posible que tenga requisitos para las celdas que van más allá de lo que estas características pueden proporcionar. Puede crear su propia clase personalizada DataGridViewCell para proporcionar funcionalidad extendida.

Cree una clase personalizada DataGridViewCell derivando de la DataGridViewCell clase base o de una de sus clases derivadas. Aunque puede mostrar cualquier tipo de celda en cualquier tipo de columna, normalmente también creará una clase personalizada DataGridViewColumn especializada para mostrar el tipo de celda. Las clases de columna derivan de DataGridViewColumn o de uno de sus tipos derivados.

En el ejemplo de código siguiente, creará una clase de celda personalizada denominada DataGridViewRolloverCell que detecta cuándo entra el mouse y sale de los límites de la celda. Mientras el ratón está dentro de los límites de la celda, se dibuja un rectángulo interno. Este nuevo tipo se deriva de DataGridViewTextBoxCell y se comporta en todos los demás aspectos como su clase base. La clase de columna complementaria se denomina DataGridViewRolloverColumn.

Para usar estas clases, cree un formulario que contenga un DataGridView control, agregue uno o varios DataGridViewRolloverColumn objetos a la Columns colección y rellene el control con filas que contienen valores.

Nota:

Este ejemplo no funcionará correctamente si agrega filas vacías. Las filas vacías se crean, por ejemplo, al agregar filas al control estableciendo la RowCount propiedad . Esto se debe a que las filas agregadas en este caso se comparten automáticamente, lo que significa que los objetos no se instancian hasta que se hace clic en celdas individuales, lo que provoca que las filas asociadas se vuelvan no compartidas.

Dado que este tipo de personalización de celda requiere filas no compartidas, no es adecuado para su uso con grandes conjuntos de datos. Para obtener más información sobre el uso compartido de filas, vea Procedimientos recomendados para escalar el control DataGridView de formularios Windows Forms.

Nota:

Cuando derive de DataGridViewCell o DataGridViewColumn y agregue nuevas propiedades a la clase derivada, asegúrese de invalidar el Clone método para copiar las nuevas propiedades durante las operaciones de clonación. También debe llamar al método de la clase base, Clone, para que las propiedades de la clase base se copien en la nueva celda o columna.

Para personalizar celdas y columnas en el control DataGridView

1. Derive una nueva clase de celda, denominada DataGridViewRolloverCell, del DataGridViewTextBoxCell tipo .

   public class DataGridViewRolloverCell : DataGridViewTextBoxCell
   {
   

   Public Class DataGridViewRolloverCell
       Inherits DataGridViewTextBoxCell
   

   }
   

   End Class
   

2. Invalide el Paint método en la DataGridViewRolloverCell clase . En la sobrescritura, primero llame a la implementación de la clase base, que controla la funcionalidad del cuadro de texto alojado. A continuación, use el método del control para transformar la posición del PointToClient cursor (en coordenadas de pantalla) a las DataGridView coordenadas del área cliente. Si las coordenadas del ratón se encuentran dentro de los límites de la celda, dibuje el rectángulo interior.

   protected override void Paint(
       Graphics graphics,
       Rectangle clipBounds,
       Rectangle cellBounds,
       int rowIndex,
       DataGridViewElementStates cellState,
       object value,
       object formattedValue,
       string errorText,
       DataGridViewCellStyle cellStyle,
       DataGridViewAdvancedBorderStyle advancedBorderStyle,
       DataGridViewPaintParts paintParts)
   {
       // Call the base class method to paint the default cell appearance.
       base.Paint(graphics, clipBounds, cellBounds, rowIndex, cellState,
           value, formattedValue, errorText, cellStyle,
           advancedBorderStyle, paintParts);
   
       // Retrieve the client location of the mouse pointer.
       Point cursorPosition =
           this.DataGridView.PointToClient(Cursor.Position);
   
       // If the mouse pointer is over the current cell, draw a custom border.
       if (cellBounds.Contains(cursorPosition))
       {
           Rectangle newRect = new Rectangle(cellBounds.X + 1,
               cellBounds.Y + 1, cellBounds.Width - 4,
               cellBounds.Height - 4);
           graphics.DrawRectangle(Pens.Red, newRect);
       }
   }
   

   Protected Overrides Sub Paint( _
       ByVal graphics As Graphics, _
       ByVal clipBounds As Rectangle, _
       ByVal cellBounds As Rectangle, _
       ByVal rowIndex As Integer, _
       ByVal elementState As DataGridViewElementStates, _
       ByVal value As Object, _
       ByVal formattedValue As Object, _
       ByVal errorText As String, _
       ByVal cellStyle As DataGridViewCellStyle, _
       ByVal advancedBorderStyle As DataGridViewAdvancedBorderStyle, _
       ByVal paintParts As DataGridViewPaintParts)
   
       ' Call the base class method to paint the default cell appearance.
       MyBase.Paint(graphics, clipBounds, cellBounds, rowIndex, elementState, _
           value, formattedValue, errorText, cellStyle, _
           advancedBorderStyle, paintParts)
   
       ' Retrieve the client location of the mouse pointer.
       Dim cursorPosition As Point = _
           Me.DataGridView.PointToClient(Cursor.Position)
   
       ' If the mouse pointer is over the current cell, draw a custom border.
       If cellBounds.Contains(cursorPosition) Then
           Dim newRect As New Rectangle(cellBounds.X + 1, _
               cellBounds.Y + 1, cellBounds.Width - 4, _
               cellBounds.Height - 4)
           graphics.DrawRectangle(Pens.Red, newRect)
       End If
   
   End Sub
   

3. Invalide los OnMouseEnter métodos y OnMouseLeave de la DataGridViewRolloverCell clase para forzar que las celdas se vuelvan a pintar cuando el puntero del mouse entra o los deja.

   // Force the cell to repaint itself when the mouse pointer enters it.
   protected override void OnMouseEnter(int rowIndex)
   {
       this.DataGridView.InvalidateCell(this);
   }
   
   // Force the cell to repaint itself when the mouse pointer leaves it.
   protected override void OnMouseLeave(int rowIndex)
   {
       this.DataGridView.InvalidateCell(this);
   }
   

   ' Force the cell to repaint itself when the mouse pointer enters it.
   Protected Overrides Sub OnMouseEnter(ByVal rowIndex As Integer)
       Me.DataGridView.InvalidateCell(Me)
   End Sub
   
   ' Force the cell to repaint itself when the mouse pointer leaves it.
   Protected Overrides Sub OnMouseLeave(ByVal rowIndex As Integer)
       Me.DataGridView.InvalidateCell(Me)
   End Sub
   

4. Derive una nueva clase, denominada DataGridViewRolloverCellColumn, del DataGridViewColumn tipo . En el constructor, asigne un nuevo DataGridViewRolloverCell objeto a su CellTemplate propiedad .

   public class DataGridViewRolloverCellColumn : DataGridViewColumn
   {
       public DataGridViewRolloverCellColumn()
       {
           this.CellTemplate = new DataGridViewRolloverCell();
       }
   }
   

   Public Class DataGridViewRolloverCellColumn
       Inherits DataGridViewColumn
   
       Public Sub New()
           Me.CellTemplate = New DataGridViewRolloverCell()
       End Sub
   
   End Class
   

Ejemplo

El ejemplo de código completo incluye un formulario de prueba pequeño que muestra el comportamiento del tipo de celda personalizado.

using System;
using System.Drawing;
using System.Windows.Forms;

class Form1 : Form
{
    [STAThreadAttribute()]
    public static void Main()
    {
        Application.Run(new Form1());
    }

    public Form1()
    {
        DataGridView dataGridView1 = new DataGridView();
        DataGridViewRolloverCellColumn col =
            new DataGridViewRolloverCellColumn();
        dataGridView1.Columns.Add(col);
        dataGridView1.Rows.Add(new string[] { "" });
        dataGridView1.Rows.Add(new string[] { "" });
        dataGridView1.Rows.Add(new string[] { "" });
        dataGridView1.Rows.Add(new string[] { "" });
        this.Controls.Add(dataGridView1);
        this.Text = "DataGridView rollover-cell demo";
    }
}

public class DataGridViewRolloverCell : DataGridViewTextBoxCell
{
    protected override void Paint(
        Graphics graphics,
        Rectangle clipBounds,
        Rectangle cellBounds,
        int rowIndex,
        DataGridViewElementStates cellState,
        object value,
        object formattedValue,
        string errorText,
        DataGridViewCellStyle cellStyle,
        DataGridViewAdvancedBorderStyle advancedBorderStyle,
        DataGridViewPaintParts paintParts)
    {
        // Call the base class method to paint the default cell appearance.
        base.Paint(graphics, clipBounds, cellBounds, rowIndex, cellState,
            value, formattedValue, errorText, cellStyle,
            advancedBorderStyle, paintParts);

        // Retrieve the client location of the mouse pointer.
        Point cursorPosition =
            this.DataGridView.PointToClient(Cursor.Position);

        // If the mouse pointer is over the current cell, draw a custom border.
        if (cellBounds.Contains(cursorPosition))
        {
            Rectangle newRect = new Rectangle(cellBounds.X + 1,
                cellBounds.Y + 1, cellBounds.Width - 4,
                cellBounds.Height - 4);
            graphics.DrawRectangle(Pens.Red, newRect);
        }
    }

    // Force the cell to repaint itself when the mouse pointer enters it.
    protected override void OnMouseEnter(int rowIndex)
    {
        this.DataGridView.InvalidateCell(this);
    }

    // Force the cell to repaint itself when the mouse pointer leaves it.
    protected override void OnMouseLeave(int rowIndex)
    {
        this.DataGridView.InvalidateCell(this);
    }

}

public class DataGridViewRolloverCellColumn : DataGridViewColumn
{
    public DataGridViewRolloverCellColumn()
    {
        this.CellTemplate = new DataGridViewRolloverCell();
    }
}

Imports System.Drawing
Imports System.Windows.Forms

Class Form1
    Inherits Form

    <STAThreadAttribute()> _
    Public Shared Sub Main()
        Application.Run(New Form1())
    End Sub

    Public Sub New()
        Dim dataGridView1 As New DataGridView()
        Dim col As New DataGridViewRolloverCellColumn()
        dataGridView1.Columns.Add(col)
        dataGridView1.Rows.Add(New String() {""})
        dataGridView1.Rows.Add(New String() {""})
        dataGridView1.Rows.Add(New String() {""})
        dataGridView1.Rows.Add(New String() {""})
        Me.Controls.Add(dataGridView1)
        Me.Text = "DataGridView rollover-cell demo"
    End Sub

End Class

Public Class DataGridViewRolloverCell
    Inherits DataGridViewTextBoxCell

    Protected Overrides Sub Paint( _
        ByVal graphics As Graphics, _
        ByVal clipBounds As Rectangle, _
        ByVal cellBounds As Rectangle, _
        ByVal rowIndex As Integer, _
        ByVal elementState As DataGridViewElementStates, _
        ByVal value As Object, _
        ByVal formattedValue As Object, _
        ByVal errorText As String, _
        ByVal cellStyle As DataGridViewCellStyle, _
        ByVal advancedBorderStyle As DataGridViewAdvancedBorderStyle, _
        ByVal paintParts As DataGridViewPaintParts)

        ' Call the base class method to paint the default cell appearance.
        MyBase.Paint(graphics, clipBounds, cellBounds, rowIndex, elementState, _
            value, formattedValue, errorText, cellStyle, _
            advancedBorderStyle, paintParts)

        ' Retrieve the client location of the mouse pointer.
        Dim cursorPosition As Point = _
            Me.DataGridView.PointToClient(Cursor.Position)

        ' If the mouse pointer is over the current cell, draw a custom border.
        If cellBounds.Contains(cursorPosition) Then
            Dim newRect As New Rectangle(cellBounds.X + 1, _
                cellBounds.Y + 1, cellBounds.Width - 4, _
                cellBounds.Height - 4)
            graphics.DrawRectangle(Pens.Red, newRect)
        End If

    End Sub

    ' Force the cell to repaint itself when the mouse pointer enters it.
    Protected Overrides Sub OnMouseEnter(ByVal rowIndex As Integer)
        Me.DataGridView.InvalidateCell(Me)
    End Sub

    ' Force the cell to repaint itself when the mouse pointer leaves it.
    Protected Overrides Sub OnMouseLeave(ByVal rowIndex As Integer)
        Me.DataGridView.InvalidateCell(Me)
    End Sub

End Class

Public Class DataGridViewRolloverCellColumn
    Inherits DataGridViewColumn

    Public Sub New()
        Me.CellTemplate = New DataGridViewRolloverCell()
    End Sub

End Class

Compilar el código

Este ejemplo requiere:

• Referencias a los ensamblados System, System.Windows.Forms y System.Drawing.

Consulte también

• DataGridView
• DataGridViewCell
• DataGridViewColumn
• Personalización de controles de formularios Windows Forms DataGridView
• Arquitectura de control DataGridView
• Tipos de columna en el control DataGridView de Windows Forms
• Procedimientos recomendados para escalar el control DataGridView de Windows Forms