Formateando el control DataGrid

Creando y usando estilos 

Fecha: 16/Jun/2005 (15 de Junio de 2005)
Autor: Ing. Fernando Luque Sánchez - DCE 4 Estrellas
fls2307@hotmail.com
fernandoluque2307@yahoo.com

 


Sres. Desarrolladores, este aporte ayudará a muchos de ustedes a darle ese toque final a sus proyectos, en esta oportunidad envio un ejemplo donde explico como cambiar la forma de presentación de un Grid en una aplicción Windows.

UN POCO DE TEORIA

El control DataGrid es un control que muestra un conjunto de datos de manera tabular, es decir ordenado con filas y columnas donde posiblemente muestre los datos de una tabla que son  el resultado de una instrucción Transact-SQL como Select. Este contenido lo pasamos a un DataTable dentro de nuestro DataSet y luego desde el IDE o mediante código especificamos el origen del Grid.

Este Grid o control DataGrid tiene una apariencia que en muchas ocasiones no se adecua a nuestros requerimientos, para esto debemos cambiarle la forma de como se ve aplicando un Estilo o lo que se conoce como CAMBIARLE EL FORMATO AL GRID.

La Clase DataGridTableStyle

La clase DataGridTableStyle es una clase que representa al control Grid dibujado, mediante esta clase se puede controlar la forma de como se visualiza el control DataGrid. Para cambiar el formato de un control DataGrid debemos crear una nueva instancia de esta clase y luego cambiar sus propiedades de la forma como se desea ver el control DataGrid.

Para crear una nueva instancia de  la clase DataGridTableStyle se utiliza:

Dim dgEstiloTabla As New DataGridTableStyle

Donde dgEstiloTabla es el nombre asignado a esta instancia. Luego se especifican las características de este nuevo formato, como por ejemplo:

        With dgEstiloTabla
            .AlternatingBackColor = Color.GhostWhite
            .BackColor = Color.GhostWhite
            .ForeColor = Color.MidnightBlue
            .GridLineColor = Color.RoyalBlue
            .HeaderBackColor = Color.MidnightBlue
            .HeaderFont = New Font("Tahoma", 8.0!, FontStyle.Bold)
            .HeaderForeColor = Color.Lavender
            .SelectionBackColor = Color.Teal
            .SelectionForeColor = Color.PaleGreen
            ' Establecer la propiedad Mapping
              'para que tenga efecto el objeto DataGridTableStyle
            .MappingName = vNombreTabla
            .PreferredColumnWidth = 125
            .PreferredRowHeight = 15
        End With

Luego para asignar el estilo creado al control DataGrid debemos utilizar la propiedad Mapping y seleccionar el nombre del DataTable que tomará el formato definido.

Fijese en la fila que contiene la instrucción  .MappingName = vNombreTabla, aqui se asigna el DataTable respectivo, previamente en el ejemplo que comparto con ustedes se ha declarado una variable vNombreTabla con la siguiente instrucción:

Public vNombreTabla As String = "Clientes"

El estilo definido se agrega a la colección GridTableStylesCollection, en esta colección se puede agregar todos los estilos que el usuario desee, luego para utilizarlos basta con utilizar la propiedad Mapping para especificar que DataTable se mostrará en el control DataGrid.

COMO MUESTRO EL FORMATO

Una vez definido el formato, especificada la propiedad Mapping debe agregarse este a la colección TableStyles del control DataGrid, la instrucción para nuestro ejemplo es:

dgClientes.TableStyles.Add(dgEstiloTabla)

La Clase DataGridColumnStyle

Esta clase determina la apariencia, el formato del texto y la forma de comportamiento de cada columna del control DataGrid. Las siguientes instrucciones muestran la definición del formato de una de las columnas, note que el estilo es definido usando la clase DataGridTextBoxColumn que es heredada de la clase DataGridColumnStyle.

        Dim ColEStilo1 As New DataGridTextBoxColumn
        With ColEStilo1
            .HeaderText = "Id Cliente"
            .MappingName = "CustomerID"
            .Width = 75
            .ReadOnly = True
        End With

Después de crear todos los estilos de las columnas a mostrar deben agregarse estos a la colección GridColumnStyles del control DataGrid.

VAMOS CON EL EJEMPLO

A continuación sigue código en Visual Basic

'NameSpace necesarios
Imports System.Data
Imports System.Data.SqlClient

Public Class frmFormatoGrid
    Inherits System.Windows.Forms.Form

    'Definición del Dataset
    Dim dsDatos As New DataSet

    'Guargar el estilo del Borde
    Dim EstiloBordeGrid As BorderStyle

    Public vNombreTabla As String = "Clientes"

 

#Region " Código generado por el Diseñador de Windows Forms "
            CÓDIGO ELIMINADO
#End Region

    Private Sub frmFormatoGrid_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        LlenarGrid()
    End Sub

    Public Sub LlenarGrid()
        'Llenar los datos del Grid
        daClientes.Fill(dsDatos, "Clientes")
        dgClientes.DataSource = dsDatos.Tables("Clientes")
    End Sub

    'Este Procedimiento es el que maneja todo
    Private Sub Estilos(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) _
        Handles cmdPorDefecto.Click, cmdEstiloTabla.Click, _
        cmdEstiloColumnas.Click

        'Usando Sender para saber que control se pulsó
        If sender Is cmdPorDefecto Then
            PorDefecto()
        ElseIf sender Is cmdEstiloTabla Then
            EstiloTabla()
        ElseIf sender Is cmdEstiloColumnas Then
            EstiloColumna()
        End If
    End Sub

El codigo completo está en el empaquetado al final del artículo. Suerte a todos y no se olviden dar su opinion en PanoramaBox.

Ing. Fernando Luque Sánchez
CIP 61806
Trujillo - Perú


Espacios de nombres usados en el código de este artículo:

System.Data
System.Data.SQLClient


Fichero con el código de ejemplo: FernandoLuque_FormateandoDataGrid.zip - Tamaño 44 KB


ir al índice