Usar el control DataGrid

El control DataGrid puede mostrar una colección de datos en varias columnas y filas. Incluye la funcionalidad para ordenar por columnas.

Para obtener información acerca del control DataGrid, vea DataGrid (Clase) (System.Windows.Controls) en MSDN.

Crear datos de ejemplo para mostrar en un control DataGrid

Puede usar cualquier tipo de datos en el control DataGrid. Si no dispone todavía de datos que pueda usar en el procedimiento "Rellenar un control DataGrid" más adelante, realice este procedimiento para configurar datos de ejemplo que ilustrarán por completo las características del control DataGrid.

1. Si no ve el panel Datos, haga clic en Datos en el menú Ventana.

2. En el panel Datos, haga clic en Agregar origen de datos de ejemplo  y, a continuación, haga clic en Definir nuevos datos de ejemplo.

3. En el cuadro de diálogo Definir nuevos datos de ejemplo, puede cambiar el nombre predeterminado del conjunto de datos y seleccionar a continuación la parte del proyecto a la que desea asignar la disponibilidad de los datos.

4. Active la casilla Habilitar datos de ejemplo cuando se ejecute la aplicación.

   Sugerencia:
   La casilla Habilitar datos de ejemplo cuando se ejecute la aplicación permite que el proyecto muestre los datos de ejemplo cuando se ejecute la aplicación. Si la casilla no está activada, Microsoft Expression Blend muestra los datos de ejemplo únicamente en la mesa de trabajo. Para obtener más información, vea Hacer que la aplicación muestre datos de ejemplo cuando se ejecute.

5. Haga clic en Aceptar.

   Se crea un origen de datos de ejemplo que incluye una colección de tres tipos de propiedades (cadena , número  y booleana ).

   

   Para explorar completamente las características de los datos de ejemplo y el control DataGrid, agregue una propiedad de imagen a la colección.

6. Junto a Colección , haga clic en Agregar propiedad simple  para agregar una nueva propiedad a la colección.

   Sugerencia:
   Puede hacer clic en la flecha desplegable junto al botón Agregar propiedad simple para seleccionar distintos tipos de propiedades para agregar: simple, compleja y de colección.

7. Junto a la nueva propiedad (Property4), haga clic en Cambiar tipo de propiedad . En el editor que aparece, haga clic en la flecha desplegable situada junto a Tipo y, a continuación, haga clic en Imagen.

8. Haga clic fuera del editor para cerrarlo.

   El icono situado junto a Property4 se actualiza para identificarla como una propiedad de imagen .

Ya dispone de una colección de datos de ejemplo lista para ser mostrada en un control DataGrid.

Para obtener información acerca de la modificación de datos de ejemplo y de cómo agregar más propiedades de datos, vea Modificar datos de ejemplo.

Rellenar un control DataGrid

Existen diversas formas de enlazar datos a un control de la mesa de trabajo. El siguiente procedimiento le muestra la forma más rápida cuando se usa un control DataGrid.

Para otras opciones, vea Enlazar un objeto a datos.

1. En el panel Herramientas, haga clic en Activos.

   Sugerencia:
   De forma alternativa, puede mostrar el panel Activos en un panel acoplado haciendo clic en Activos en el menú Ventana.

2. En el panel Activos, expanda Controles, haga clic en Todo y, por último, haga clic en el control DataGrid .

   El botón situado debajo del botón Activos en el panel Herramientas muestra el icono del control DataGrid y está seleccionado.

3. Use el mouse para dibujar un objeto DataGrid grande en la mesa de trabajo en el documento principal.

4. En el panel Datos, arrastre la colección de datos de ejemplo ( Colección) al nuevo objeto de cuadrícula de datos.

   La cuadrícula de datos muestra la colección en el origen de los datos de ejemplo, convirtiendo las propiedades de imagen en objetos de imagen y las propiedades booleanas en casillas.

5. Presione F5 para ejecutar la aplicación.

   Si utiliza los datos de ejemplo del procedimiento anterior y ha habilitado los datos de ejemplo al probar la aplicación, debería ver lo siguiente:

   

   Sugerencia:
   Para actualizar un objeto DataGrid en la mesa de trabajo después de modificar los datos de ejemplo que muestra, puede arrastrar propiedades de datos individuales hasta el control para agregar nuevas columnas o volver a arrastrar la colección en su totalidad. En el panel Objetos y escala de tiempo, puede expandir el nodo Columna del objeto DataGrid para eliminar y volver a ordenar las columnas.

Cambiar etiquetas de columna en un control DataGrid

Al arrastrar una colección de datos hasta un control de cuadrícula de datos, las etiquetas de columna se establecen por según los nombres de las propiedades. Sin embargo, puede cambiar las etiquetas de columna después de rellenar el control de cuadrícula de datos.

1. En el panel Objetos y escala de tiempo, expanda el objeto [DataGrid] para mostrar los objetos de columna.

2. Seleccione el primer objeto de columna ([DataGridTemplateColumn] "Property1"). En el panel Propiedades, junto a la propiedad Header, escriba un nombre descriptivo como, por ejemplo, "Descripción", y presione ENTRAR.

3. Seleccione los otros dos objetos de columna y cambie sus nombres.

4. Presione F5 para ejecutar la aplicación.

   Si utiliza los datos de ejemplo del procedimiento anterior y ha habilitado los datos de ejemplo al probar la aplicación, debería ver algo parecido a lo siguiente:

   

Cambiar la apariencia del control DataGrid

Puede cambiar la apariencia de los controles modificando sus propiedades o las plantillas que se usan para aplicarles estilos. Puede modificar la plantilla general, una plantilla de fila vacía, las plantillas que se aplican a celdas individuales, plantillas de encabezado, etc.

Para obtener más información, vea Crear o modificar una plantilla.

Cambiar la apariencia de los encabezados de columna

1. En el panel Objetos y escala de tiempo o en la mesa de trabajo, haga clic con el botón secundario en el objeto DataGrid, elija Editar plantillas adicionales, elija Editar ColumnHeaderStyle y, a continuación, haga clic en Editar una copia.

   

2. En el cuadro de diálogo Crear recurso Style, haga clic en Aceptar.

   Expression Blend cambia al modo de edición de plantilla. La barra de ruta de navegación de la parte superior de la mesa de trabajo muestra que se está editando una plantilla dentro del objeto DataGrid.

3. En el panel Objetos y escala de tiempo, agregue otros objetos a la plantilla o bien modifique las propiedades de los objetos existentes en el panel Propiedades. Por ejemplo, en el objeto [Grid], hay un trazado denominado SortIcon que representa un icono para un botón de ordenación. Puede cambiarlo a una imagen o modificar el trazado. El botón de ordenación aparece al ejecutar la aplicación y hacer clic en un encabezado de columna.

   Sugerencia:
   Algunas propiedades pueden mostrar un rectángulo de selección amarillo para indicar que están enlazadas a datos o a propiedades del control que usa la plantilla (enlace a plantilla). Para obtener más información acerca del enlace a plantilla, vea Aplicar estilos a un control que admite plantillas.

Cambiar la apariencia de celdas que contienen imágenes

1. En la mesa de trabajo, haga clic con el botón secundario en una celda del objeto de cuadrícula de datos que muestre una imagen, elija Editar plantilla de columna, elija Editar CellTemplate y, por último, haga clic en Editar actual.

2. En el panel Objetos y escala de tiempo, agregue otros objetos al contenedor de diseño [StackPanel] (como un símbolo de copyright) o seleccione el objeto [Image] y modifique sus propiedades en el panel Propiedades.

   Los cambios que haga afectarán a todas las celdas que contengan imágenes.

Cambiar los colores de filas alternas

1. En el panel Objetos y escala de tiempo, seleccione el objeto [DataGrid].

2. En el panel Propiedades, en Filas, haga clic dentro del rectángulo situado junto a la propiedad AlternatingRowBackground.

   Aparecerá el editor de pinceles.

3. Haga clic en una de las fichas de la parte superior del editor de colores para seleccionar un tipo de pincel. Si usa el pincel actual (Pincel de color sólido ) y cambia el color, asegúrese de que aumenta la propiedad Alpha para que el color no sea transparente.

4. Puede modificar la propiedad RowBackground para cambiar los colores de las otras filas.

   Para obtener más información acerca de la modificación de pinceles, vea Establecer colores, pinceles y máscaras.

Vea también

Otros recursos

Crear datos de ejemplo

Conectarse a datos en directo

Mostrar datos en controles