Tutorial: Crear un control DataGridView sin enlazar en formularios Windows Forms

Artículo
10/07/2008

Actualización: noviembre 2007

Quizá desee mostrar frecuentemente datos en formato de tabla que no tienen su origen en una base de datos. Por ejemplo, quizá desear mostrar el contenido de una matriz bidimensional de tipo String. La clase DataGridView proporciona una manera fácil y muy personalizable de mostrar los datos sin enlazarse a un origen de datos. Este tutorial muestra cómo rellenar un control DataGridView y administrar la agregación y eliminación de filas en modo "sin enlazar". De forma predeterminada, el usuario puede agregar nuevas filas. Para impedir que se agreguen filas, establezca la propiedad AllowUserToAddRows en false.

Para copiar el código de este tema como un listado sencillo, vea Cómo: Crear un control DataGridView no enlazado en formularios Windows Forms.

Crear el formulario

Para utilizar un control DataGridView sin enlazar

Cree una clase que deriva de Form y contiene las declaraciones de variable siguientes y el método Main.

Imports System
Imports System.Drawing
Imports System.Windows.Forms

Public Class Form1
    Inherits System.Windows.Forms.Form

    Private buttonPanel As New Panel
    Private WithEvents songsDataGridView As New DataGridView
    Private WithEvents addNewRowButton As New Button
    Private WithEvents deleteRowButton As New Button


...



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

End Class

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

public class Form1 : System.Windows.Forms.Form
{
    private Panel buttonPanel = new Panel();
    private DataGridView songsDataGridView = new DataGridView();
    private Button addNewRowButton = new Button();
    private Button deleteRowButton = new Button();


...



    [STAThreadAttribute()]
    static void Main()
    {
        Application.EnableVisualStyles();
        Application.Run(new Form1());
    }
}

Implemente un método SetupLayout en la definición de clase del formulario para configurar el diseño del formulario.

Private Sub SetupLayout()

    Me.Size = New Size(600, 500)

    With addNewRowButton
        .Text = "Add Row"
        .Location = New Point(10, 10)
    End With

    With deleteRowButton
        .Text = "Delete Row"
        .Location = New Point(100, 10)
    End With

    With buttonPanel
        .Controls.Add(addNewRowButton)
        .Controls.Add(deleteRowButton)
        .Height = 50
        .Dock = DockStyle.Bottom
    End With

    Me.Controls.Add(Me.buttonPanel)

End Sub

private void SetupLayout()
{
    this.Size = new Size(600, 500);

    addNewRowButton.Text = "Add Row";
    addNewRowButton.Location = new Point(10, 10);
    addNewRowButton.Click += new EventHandler(addNewRowButton_Click);

    deleteRowButton.Text = "Delete Row";
    deleteRowButton.Location = new Point(100, 10);
    deleteRowButton.Click += new EventHandler(deleteRowButton_Click);

    buttonPanel.Controls.Add(addNewRowButton);
    buttonPanel.Controls.Add(deleteRowButton);
    buttonPanel.Height = 50;
    buttonPanel.Dock = DockStyle.Bottom;

    this.Controls.Add(this.buttonPanel);
}

Cree un método SetupDataGridView para configurar las columnas y propiedades de DataGridView.

Este método primero agrega el control DataGridView a la colección Controls del formulario. Luego, establece el número de columnas que se va a mostrar utilizando la propiedad ColumnCount. Para establecer el estilo predeterminado de los encabezados de columna, establezca las propiedades: BackColor, ForeColor y Font del DataGridViewCellStyle devuelto por la propiedad ColumnHeadersDefaultCellStyle.

Se establecerán las propiedades de diseño y apariencia y, a continuación, se asignarán los nombres de columna. Cuando este método devuelve el control al sistema, el control DataGridView está listo para rellenarse.

Private Sub SetupDataGridView()

    Me.Controls.Add(songsDataGridView)

    songsDataGridView.ColumnCount = 5
    With songsDataGridView.ColumnHeadersDefaultCellStyle
        .BackColor = Color.Navy
        .ForeColor = Color.White
        .Font = New Font(songsDataGridView.Font, FontStyle.Bold)
    End With

    With songsDataGridView
        .Name = "songsDataGridView"
        .Location = New Point(8, 8)
        .Size = New Size(500, 250)
        .AutoSizeRowsMode = _
            DataGridViewAutoSizeRowsMode.DisplayedCellsExceptHeaders
        .ColumnHeadersBorderStyle = DataGridViewHeaderBorderStyle.Single
        .CellBorderStyle = DataGridViewCellBorderStyle.Single
        .GridColor = Color.Black
        .RowHeadersVisible = False

        .Columns(0).Name = "Release Date"
        .Columns(1).Name = "Track"
        .Columns(2).Name = "Title"
        .Columns(3).Name = "Artist"
        .Columns(4).Name = "Album"
        .Columns(4).DefaultCellStyle.Font = _
            New Font(Me.songsDataGridView.DefaultCellStyle.Font, FontStyle.Italic)

        .SelectionMode = DataGridViewSelectionMode.FullRowSelect
        .MultiSelect = False
        .Dock = DockStyle.Fill
    End With

End Sub

private void SetupDataGridView()
{
    this.Controls.Add(songsDataGridView);

    songsDataGridView.ColumnCount = 5;

    songsDataGridView.ColumnHeadersDefaultCellStyle.BackColor = Color.Navy;
    songsDataGridView.ColumnHeadersDefaultCellStyle.ForeColor = Color.White;
    songsDataGridView.ColumnHeadersDefaultCellStyle.Font =
        new Font(songsDataGridView.Font, FontStyle.Bold);

    songsDataGridView.Name = "songsDataGridView";
    songsDataGridView.Location = new Point(8, 8);
    songsDataGridView.Size = new Size(500, 250);
    songsDataGridView.AutoSizeRowsMode =
        DataGridViewAutoSizeRowsMode.DisplayedCellsExceptHeaders;
    songsDataGridView.ColumnHeadersBorderStyle =
        DataGridViewHeaderBorderStyle.Single;
    songsDataGridView.CellBorderStyle = DataGridViewCellBorderStyle.Single;
    songsDataGridView.GridColor = Color.Black;
    songsDataGridView.RowHeadersVisible = false;

    songsDataGridView.Columns[0].Name = "Release Date";
    songsDataGridView.Columns[1].Name = "Track";
    songsDataGridView.Columns[2].Name = "Title";
    songsDataGridView.Columns[3].Name = "Artist";
    songsDataGridView.Columns[4].Name = "Album";
    songsDataGridView.Columns[4].DefaultCellStyle.Font =
        new Font(songsDataGridView.DefaultCellStyle.Font, FontStyle.Italic);

    songsDataGridView.SelectionMode =
        DataGridViewSelectionMode.FullRowSelect;
    songsDataGridView.MultiSelect = false;
    songsDataGridView.Dock = DockStyle.Fill;

    songsDataGridView.CellFormatting += new
        DataGridViewCellFormattingEventHandler(
        songsDataGridView_CellFormatting);
}

Cree un método PopulateDataGridView para agregar las filas al control DataGridView.

Cada fila representa una canción y su información asociada.

Private Sub PopulateDataGridView()

    Dim row0 As String() = {"11/22/1968", "29", "Revolution 9", _
        "Beatles", "The Beatles [White Album]"}
    Dim row1 As String() = {"1960", "6", "Fools Rush In", _
        "Frank Sinatra", "Nice 'N' Easy"}
    Dim row2 As String() = {"11/11/1971", "1", "One of These Days", _
        "Pink Floyd", "Meddle"}
    Dim row3 As String() = {"1988", "7", "Where Is My Mind?", _
        "Pixies", "Surfer Rosa"}
    Dim row4 As String() = {"5/1981", "9", "Can't Find My Mind", _
        "Cramps", "Psychedelic Jungle"}
    Dim row5 As String() = {"6/10/2003", "13", _
        "Scatterbrain. (As Dead As Leaves.)", _
        "Radiohead", "Hail to the Thief"}
    Dim row6 As String() = {"6/30/1992", "3", "Dress", "P J Harvey", "Dry"}

    With Me.songsDataGridView.Rows
        .Add(row0)
        .Add(row1)
        .Add(row2)
        .Add(row3)
        .Add(row4)
        .Add(row5)
        .Add(row6)
    End With

    With Me.songsDataGridView
        .Columns(0).DisplayIndex = 3
        .Columns(1).DisplayIndex = 4
        .Columns(2).DisplayIndex = 0
        .Columns(3).DisplayIndex = 1
        .Columns(4).DisplayIndex = 2
    End With

End Sub

private void PopulateDataGridView()
{

    string[] row0 = { "11/22/1968", "29", "Revolution 9", 
        "Beatles", "The Beatles [White Album]" };
    string[] row1 = { "1960", "6", "Fools Rush In", 
        "Frank Sinatra", "Nice 'N' Easy" };
    string[] row2 = { "11/11/1971", "1", "One of These Days", 
        "Pink Floyd", "Meddle" };
    string[] row3 = { "1988", "7", "Where Is My Mind?", 
        "Pixies", "Surfer Rosa" };
    string[] row4 = { "5/1981", "9", "Can't Find My Mind", 
        "Cramps", "Psychedelic Jungle" };
    string[] row5 = { "6/10/2003", "13", 
        "Scatterbrain. (As Dead As Leaves.)", 
        "Radiohead", "Hail to the Thief" };
    string[] row6 = { "6/30/1992", "3", "Dress", "P J Harvey", "Dry" };

    songsDataGridView.Rows.Add(row0);
    songsDataGridView.Rows.Add(row1);
    songsDataGridView.Rows.Add(row2);
    songsDataGridView.Rows.Add(row3);
    songsDataGridView.Rows.Add(row4);
    songsDataGridView.Rows.Add(row5);
    songsDataGridView.Rows.Add(row6);

    songsDataGridView.Columns[0].DisplayIndex = 3;
    songsDataGridView.Columns[1].DisplayIndex = 4;
    songsDataGridView.Columns[2].DisplayIndex = 0;
    songsDataGridView.Columns[3].DisplayIndex = 1;
    songsDataGridView.Columns[4].DisplayIndex = 2;
}

Con los métodos de utilidad en contexto, puede asociar controladores de eventos.

Controlará los eventos Click de los botones Agregar y Eliminar, el evento Load del formulario y el evento CellFormatting del control DataGridView.

Cuando se provoca el evento Click del botón Agregar, se agrega una nueva fila vacía a DataGridView.

Cuando se provoca el evento Click del botón Eliminar, se elimina la fila seleccionada, a no ser que sea la fila para nuevos registros, que permite al usuario agregar nuevas filas. Esta fila siempre es la última fila del control DataGridView.

Cuando se provoca el evento Load del formulario, se llama a los métodos de utilidad SetupLayout, SetupDataGridView y PopulateDataGridView.

Cuando se provoca el evento CellFormatting, se da formato de fecha larga a todas las celdas de la columna Date, a no ser que no se pueda analizar el valor de la celda.

Private Sub Form1_Load(ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles MyBase.Load

    SetupLayout()
    SetupDataGridView()
    PopulateDataGridView()

End Sub

Private Sub songsDataGridView_CellFormatting(ByVal sender As Object, _
    ByVal e As System.Windows.Forms.DataGridViewCellFormattingEventArgs) _
    Handles songsDataGridView.CellFormatting

    If Me.songsDataGridView.Columns(e.ColumnIndex).Name = _
        "Release Date" Then

        If e IsNot Nothing Then
            If e.Value IsNot Nothing Then
                Try
                    e.Value = DateTime.Parse(e.Value.ToString()) _
                        .ToLongDateString()
                    e.FormattingApplied = True
                Catch ex As FormatException
                    Console.WriteLine("{0} is not a valid date.", e.Value.ToString())
                End Try
            End If
        End If

    End If

End Sub

Private Sub addNewRowButton_Click(ByVal sender As Object, _
    ByVal e As EventArgs) Handles addNewRowButton.Click

    Me.songsDataGridView.Rows.Add()

End Sub

Private Sub deleteRowButton_Click(ByVal sender As Object, _
    ByVal e As EventArgs) Handles deleteRowButton.Click

    If Me.songsDataGridView.SelectedRows.Count > 0 AndAlso _
        Not Me.songsDataGridView.SelectedRows(0).Index = _
        Me.songsDataGridView.Rows.Count - 1 Then

        Me.songsDataGridView.Rows.RemoveAt( _
            Me.songsDataGridView.SelectedRows(0).Index)

    End If

End Sub

public Form1()
{
    this.Load += new EventHandler(Form1_Load);
}

private void Form1_Load(System.Object sender, System.EventArgs e)
{
    SetupLayout();
    SetupDataGridView();
    PopulateDataGridView();
}

private void songsDataGridView_CellFormatting(object sender,
    System.Windows.Forms.DataGridViewCellFormattingEventArgs e)
{
    if (this.songsDataGridView.Columns[e.ColumnIndex].Name == "Release Date")
    {
        if (e != null)
        {
            if (e.Value != null)
            {
                try
                {
                    e.Value = DateTime.Parse(e.Value.ToString())
                        .ToLongDateString();
                    e.FormattingApplied = true;
                }
                catch (FormatException)
                {
                    Console.WriteLine("{0} is not a valid date.", e.Value.ToString());
                }
            }
        }
    }
}

private void addNewRowButton_Click(object sender, EventArgs e)
{
    this.songsDataGridView.Rows.Add();
}

private void deleteRowButton_Click(object sender, EventArgs e)
{
    if (this.songsDataGridView.SelectedRows.Count > 0 &&
        this.songsDataGridView.SelectedRows[0].Index !=
        this.songsDataGridView.Rows.Count - 1)
    {
        this.songsDataGridView.Rows.RemoveAt(
            this.songsDataGridView.SelectedRows[0].Index);
    }
}

Probar la aplicación

Puede comprobar el formulario para asegurarse de que se comporta de la forma prevista.

Para comprobar el formulario

Presione F5 para ejecutar la aplicación.

Aparecerá un control DataGridView que muestra las canciones enumeradas en PopulateDataGridView. Puede agregar nuevas filas con el botón Agregar fila o eliminar las filas seleccionadas con el botón Eliminar fila. El control DataGridView independiente es el almacén de datos y sus datos son independientes de cualquier origen externo, como un DataSet o una matriz.

Pasos siguientes

Esta aplicación proporciona conocimientos básicos sobre las funciones del control DataGridView. Puede personalizar la apariencia y el comportamiento del control DataGridView de varias formas:

Cambie los estilos de borde y encabezado. Para obtener más información, vea Cómo: Cambiar los estilos de borde y línea de la cuadrícula en el control DataGridView de formularios Windows Forms.
Permita o restringa los datos proporcionados por el usuario al control DataGridView. Para obtener más información, vea Cómo: Impedir la adición y eliminación de filas en el control DataGridView de formularios Windows Forms y Cómo: Crear columnas de sólo lectura en el control DataGridView de formularios Windows Forms.
Compruebe si los datos proporcionados por el usuario tienen errores relacionados con base de datos. Para obtener más información, vea Tutorial: Controlar los errores que se producen durante la entrada de datos en el control DataGridView de formularios Windows Forms.
Controle conjuntos de grandes volúmenes de datos utilizando el modo virtual. Para obtener más información, vea Tutorial: Implementar el modo virtual en el control DataGridView de formularios Windows Forms.
Personalice la apariencia de las celdas. Para obtener más información, vea Cómo: Personalizar la apariencia de las celdas en el control DataGridView de formularios Windows Forms y Cómo: Establecer estilos de celda predeterminados para el control DataGridView de formularios Windows Forms.

Vea también

Compartir a través de

Tutorial: Crear un control DataGridView sin enlazar en formularios Windows Forms

Crear el formulario

Para utilizar un control DataGridView sin enlazar

Probar la aplicación

Para comprobar el formulario

Pasos siguientes

Vea también

Tareas

Conceptos

Referencia

Otros recursos

Recursos adicionales