Cómo: Utilizar el control DataGrid en Pocket PC

Artículo
10/07/2008

Actualización: noviembre 2007

En este ejemplo se muestran técnicas para utilizar el control DataGrid con formularios para ver y editar un registro seleccionado en el control DataGrid, y agregar un nuevo registro a la base de datos. Observe que se debe proporcionar una interfaz de usuario para editar valores de DataGrid, porque .NET Compact Framework no admite editar las celdas de DataGrid en .NET Compact Framework. En este ejemplo se utiliza la base de datos Northwind, que se instala con Visual Studio.

Nota:
Si está utilizando .NET Compact Framework versión 2.0, debe agregar una referencia a System.Windows.Forms.DataGrid.dll en su proyecto para utilizar el control DataGrid.

Un objeto BindingSource proporciona acceso al registro seleccionado en la base de datos, que se pasa al constructor de los formularios de resumen y de edición para que todos los formularios utilicen el mismo origen de enlace. Además de los controles de enlace de datos, un objeto BindingSource puede devolver un objeto DataRowView de la fila actual. Se puede utilizar el objeto DataRowView para tener acceso a datos con varias finalidades, como determinar el valor actual de una columna. Observe que, a efectos de demostración, sólo se utilizan dos columnas en este ejemplo para los formularios de resumen y de edición.

También se puede hacer que Visual Studio genere automáticamente formularios de resumen y de edición seleccionando Generar formularios de datos en el menú de acceso directo correspondiente a la etiqueta inteligente de un control DataGrid. Para obtener más información acerca de esta característica, vea Cómo: Generar vistas de resumen y edición para aplicaciones de datos (Dispositivos).

Esta aplicación tiene los formularios que se describen en la tabla siguiente. También se enumeran las opciones de menú correspondientes.

Formulario	Características	Opciones de menú
Formulario principal (Form1)	Muestra el control DataGrid.	Nuevo Agrega un nuevo registro a la base de datos y muestra el formulario EditView. Editar Muestra el formulario EditView.
SummaryView	Muestra los valores de columna del registro actual optimizados para su visualización.	(ninguna)
EditView	Muestra los valores de columna del registro actual optimizados para su edición.	Listo Acepta el cuadro de diálogo, actualiza la base de datos y muestra el formulario principal. Cancelar Cancela el cuadro de diálogo y muestra el formulario principal.

Formulario principal

(Form1)

Muestra el control DataGrid.

Nuevo

Agrega un nuevo registro a la base de datos y muestra el formulario EditView.

Editar

Muestra el formulario EditView.

SummaryView

Muestra los valores de columna del registro actual optimizados para su visualización.

(ninguna)

EditView

Muestra los valores de columna del registro actual optimizados para su edición.

Listo

Acepta el cuadro de diálogo, actualiza la base de datos y muestra el formulario principal.

Cancelar

Cancela el cuadro de diálogo y muestra el formulario principal.

Para crear el proyecto y diseñar el formulario principal

En Visual Studio, cree un proyecto para Smart Device y establezca la plataforma de destino en Windows Mobile 5.0 Pocket PC SDK o Windows Mobile 6 Professional SDK.
En el menú Datos, haga clic en Agregar nuevo elemento.

En Asistente para la configuración de orígenes de datos, conéctese a la base de datos Northwind mediante Microsoft SQL Compact Edition (Proveedor de datos .NET Framework para SQL Server CE). La base de datos Northwind, Northwind.sdf, se instala en \Archivos de programa\Microsoft SQL Server Compact Edition\v3.5\Ejemplos.

Nota:
En Windows Vista, debe ejecutar Visual Studio como un administrador para tener acceso a la base de datos Northwind. Para obtener más información sobre cómo agregar la base de datos, vea Cómo: Agregar una base de datos a un proyecto de dispositivos.

En el paso Elija los objetos de base de datos del asistente, seleccione la tabla Products y todas sus columnas.
En el Cuadro de herramientas, agregue un control DataGrid al formulario. Establezca las propiedades de tamaño y de diseño que desee.
Establezca la propiedad DataSource en la tabla Products. Visual Studio agrega los objetos NorthwindDataSet, ProductsBindingSource y ProductsTableAdapter al proyecto.
Diseñe el control DataGrid de modo que muestre una o dos columnas de la tabla agregando un objeto DataGridTableStyle a la colección TableStyles. Haga clic en la propiedad TableStyles en el panel Propiedades. Con esta acción se muestra el cuadro de diálogo Editor de la colección DataGridTableStyle. A continuación, realice las acciones siguientes:
1. Agregue un objeto DataGridTableStyle a la colección TableStyles.
2. Especifique "Products" para la propiedad MappingName.
3. Haga clic en la propiedad GridColumnStyle. Con esta acción se muestra el cuadro de diálogo Editor de la colección DataGridColumnStyle.
4. Agregue un objeto DataGridTextBoxColumn a la colección GridColumnStyles.
5. Haga clic en la propiedad MappingName y seleccione Nombre del producto.
6. Establezca los valores de Texto de encabezado y Ancho deseados.
7. Repita el procedimiento para las columnas adicionales.
8. Cierre los cuadros de diálogo.
Agregue dos formularios al proyecto, uno para la vista de resumen y otro para la vista de edición. Denomínelos SummaryView y EditView.
Agregue un parámetro a los constructores de los formularios SummaryView y EditView para tomar un objeto BindingSource. Declare una variable global, CurrentBindingSouce, en estos formularios para que se establezca en el objeto BindingSource que se pasa al constructor. Observe que debe establecerse antes de que se llame al método InitializeComponent.

Los desarrolladores de Visual Basic tienen que agregar Sub New al formulario, agregando un método New de la lista superior derecha Nombre de método del panel de código.
```
Dim CurrentBindingSource As BindingSource
Public Sub New(ByVal bsource As BindingSource)
    CurrentBindingSource = bsource
    InitializeComponent()
End Sub
```
```
private BindingSource CurrentBindingSource;
public SummaryView(BindingSource bsource)
{
    CurrentBindingSource = bsource;
    InitializeComponent();
}
```

En el formulario principal, agregue un objeto MenuItem denominado New (MenuItem1) y otro denominado Edit (MenuItem2). Agregue el código siguiente para los eventos ClickNew y Edit.

' Add new record.
Private Sub MenuItem1_Click(ByVal sender As System.Object,_
  ByVal e As System.EventArgs) Handles MenuItem1.Click
    ProductsBindingSource.AllowNew = True
    ProductsBindingSource.AddNew()

    ' Pass the binding source to the form.
    Dim EditViewDialog As New EditView(ProductsBindingSource)
    If EditViewDialog.ShowDialog() <> DialogResult.OK Then
        ProductsBindingSource.CancelEdit()
    Else
        ProductsBindingSource.EndEdit()
        Me.ProductsTableAdapter.Update(Me.NorthwindDataSet)
    End If
End Sub

' Edit record.
Private Sub MenuItem2_Click(ByVal sender As System.Object,_
  ByVal e As System.EventArgs) Handles MenuItem2.Click

    ' Pass the binding source to the form.
    Dim EditViewDialog As New EditView(ProductsBindingSource)
    If EditViewDialog.ShowDialog() <> DialogResult.OK Then
        ProductsBindingSource.CancelEdit()
    Else
        ProductsBindingSource.EndEdit()
        Me.ProductsTableAdapter.Update(Me.NorthwindDataSet)
    End If
End Sub

// Add new record.
private void menuItem1_Click(object sender, EventArgs e)
{
    productsBindingSource.AllowNew = true;
    productsBindingSource.AddNew();
    EditView EditViewDialog = new EditView(productsBindingSource);
    if (EditViewDialog.ShowDialog() != DialogResult.OK)
    {
        productsBindingSource.CancelEdit();
    }
    else
    {
        ProductsBindingSource.EndEdit();
        this.productsTableAdapter.Update(this.northwindDataSet);
     }
}
// Edit record (Edit).
private void menuItem2_Click(object sender, EventArgs e)
{
    EditView EditViewDialog = new EditView(productsBindingSource);
    if (EditViewDialog.ShowDialog() != DialogResult.OK)
    {
        productsBindingSource.CancelEdit();
    }
    else
    {
        productsBindingSource.EndEdit();
        this.productsTableAdapter.Update(this.northwindDataSet);
    }
}

En el formulario principal, agregue código para el evento KeyDown del control DataGrid, que se produce cuando la tecla de acción se presiona en el Pocket PC. Con esta acción se muestra el formulario SummaryView.

' Action button pressed.
Private Sub DataGrid1_KeyDown(ByVal sender As System.Object, _
  ByVal e As System.Windows.Forms.KeyEventArgs) _
  Handles DataGrid1.KeyDown
    If (e.KeyCode = Keys.Enter) Then
        Dim SummaryViewDialog As New SummaryView(ProductsBindingSource)
        SummaryViewDialog.ShowDialog()
    End If
End Sub

// Action button pressed.
private void dataGrid1_KeyDown(object sender, KeyEventArgs e)
{
    if (e.KeyCode == Keys.Enter)
    {
        SummaryView SummaryViewDialog = 
          new SummaryView(productsBindingSource);
        SummaryViewDialog.ShowDialog();
     }
}

Para crear la vista de resumen

Agregue los controles siguientes al formulario SummaryView:
- Un control Label para el encabezado Product Name, como "Product Name:".
- Un control Label para el valor Product Name.
- Un control Label para el valor Discontinued, que sólo se muestra cuando el valor de la columna Discontinued de la tabla Products es true. Asigne a esta etiqueta el título "DISCONTINUED" con una fuente de color rojo.

Agregue el código siguiente al constructor para que el formulario SummaryView establezca los enlaces de datos. Declare una variable de formulario denominada CurrentBindingSource para que se establezca en la instancia de BindingSource pasada en el constructor del formulario. Un objeto DataRowView determina que si la columna Discontinued es true, se muestre la etiqueta Discontinued.

'Dim CurrentBindingSource As BindingSource
Public Sub New(ByVal bsource As BindingSource)
    CurrentBindingSource = bsource
    ' This call is required by the Windows Forms Designer.
    InitializeComponent()
    ' Add any initialization after the InitializeComponent() call.
    ' Bind the label that shows the product name.
    ProductNameLabelVal.DataBindings.Add("Text", _
      CurrentBindingSource, "Product Name")

        ' Show the Discontinued label if
        ' that value is true in the database.
        Dim drView As DataRowView
        drView = CurrentBindingSource.Current
        If drView.Item("Discontinued") = True Then
            DiscontinuedLabel.Visible = True
        Else
            DiscontinuedLabel.Visible = False
        End If
End Sub

private BindingSource CurrentBindingSource;
public SummaryView(BindingSource bsource)
{
    CurrentBindingSource = bsource;
    InitializeComponent();
    // Bind the label that shows the product name.
    ProductNameLabelVal.DataBindings.Add("Text",
      CurrentBindingSource, "Product Name");
    // Show the Discontinued label if
    // that value is true in the database.
    DataRowView drView;
    drView = (DataRowView) CurrentBindingSource.Current;
    if (drView["Discontinued"] == true)
    {
        DiscontinuedLabel.Visible = true;
    }
    else
    {
        DiscontinuedLabel.Visible = false;
    }
}

Para crear la vista de edición

Agregue una referencia al espacio de nombres Microsoft.WindowsCE.Forms en el proyecto.
Arrastre un componente InputPanel desde el Cuadro de herramientas hasta el formulario EditView. Sólo se necesita una instancia para proporcionar el panel de entrada de software (SIP) al usuario para escribir texto en un cuadro de texto.
Agregue los controles siguientes al formulario:
- Un control Label para el cuadro de texto Product Name.
- Un control TextBox para la columna Product Name.
- Un control CheckBox para la columna Discontinued. Establezca la propiedad ThreeState en true.

Para establecer el enlace de datos, agregue el código siguiente al constructor del formulario detrás de la llamada a InitializeComponent. Este código incluye la adición de un nuevo registro o la edición de un registro existente. Si se agrega un nuevo registro, un objeto DataRowView determina si la columna Discontinued tiene un valor null, y establece la propiedad NullValue del enlace en el valor Indeterminate de la propiedad CheckState.

Public Sub New(ByVal bsource As BindingSource)
    CurrentBindingSource = bsource
    InitializeComponent()
    ' Add the bindings.
    ProductNameTextBox.DataBindings.Add("Text",_
  CurrentBindingSource, "Product Name")
    Dim drView As DataRowView
    drView = CurrentBindingSource.Current
    If IsDBNull(drView("Discontinued")) Then
        DiscontinuedCheckBox.DataBindings.Add("CheckState",_
          CurrentBindingSource, "Discontinued", True,_
          DataSourceUpdateMode.OnValidation, _
          CheckState.Indeterminate)
    Else
        DiscontinuedCheckBox.DataBindings.Add("Checked",_
         CurrentBindingSource, "Discontinued")
    End If
End Sub

public EditView(BindingSource bsource)
{
    CurrentBindingSource = bsource;
     InitializeComponent();
     CurrentBindingSource = bsource;
     InitializeComponent();
     //  Add the bindings.
     productNameTextBox.DataBindings.Add("Text",
       CurrentBindingSource, "Product Name");
     DataRowView drView;
     drView = (DataRowView) CurrentBindingSource.Current;
     if (drView("Discontinued") == null)
     {
         DiscontinuedCheckBox.DataBindings.Add("CheckState",
           CurrentBindingSource, "Discontinued", true,
           DataSourceUpdateMode.OnValidation,
           CheckState.Indeterminate);
     }
     else
     {
          DiscontinuedCheckBox.DataBindings.Add("Checked",
            CurrentBindingSource, "Discontinued");
     }
}

Agregue un objeto MenuItem con el título Listo para actualizar la base de datos con los cambios y volver al formulario principal.

' Done
Private Sub MenuItem1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MenuItem1.Click
    Me.DialogResult = DialogResult.OK
    Me.Close()
End Sub
// Done
private void menuItem1_Click(object sender, EventArgs e)
{
    this.DialogResult = DialogResult.OK;
    this.Close();
}

Agregue un objeto MenuItem con el título Cancelar,en el mismo nivel que Listo, para descartar los cambios y volver al formulario principal.

' Cancel
Private Sub MenuItem2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MenuItem1.Click
    Me.DialogResult = DialogResult.Cancel
    Me.Close()
End Sub

// Cancel
private void menuItem1_Click(object sender, EventArgs e)
{
    this.DialogResult = DialogResult.Cancel;
    this.Close();
}

Compilar el código

Para este ejemplo se requieren referencias a los siguientes espacios de nombres:

Vea también

Cómo: Utilizar el control DataGrid en Pocket PC

Para crear el proyecto y diseñar el formulario principal

Para crear la vista de resumen

Para crear la vista de edición

Compilar el código

Vea también

Tareas

Conceptos

Otros recursos

Recursos adicionales