Freigeben über

Gewusst wie: Verwenden von "DataGrid" auf dem Smartphone

  • Artikel

Aktualisiert: November 2007

Sie können eine Smartphone-Anwendung ähnlich dem Smartphone-Programm Kontakte erstellen.

Hinweis:

Wenn Sie eine .NET Compact Framework-Version vor Version 3.5 verwenden, müssen Sie dem Projekt einen Verweis auf System.Windows.Forms.DataGrid.dll hinzufügen, um sie verwenden zu können.

In diesem Beispiel wird das Hauptformular mit einer Liste von Produktnamen aus der mit Visual Studio installierten Northwind-Datenbank in einem DataGrid-Steuerelement angezeigt. Ebenfalls enthalten sind ein Formular mit einer Zusammenfassungsansicht, in dem der aktuelle Datensatz angezeigt wird, sowie ein Formular mit einer Bearbeitungsansicht, in dem Sie Daten bearbeiten und neue Datensätze hinzufügen können. Ein BindingSource-Objekt ermöglicht den Zugriff auf den aktuell ausgewählten Datensatz in der Datenbank. Zusätzlich zu Steuerelementen für die Datenbindung kann ein BindingSource-Objekt ein DataRowView-Objekt der aktuellen Zeile zurückgeben. Mithilfe von DataRowView können Sie zu verschiedenen Zwecken auf Daten zugreifen, so beispielsweise, um den aktuellen Wert einer Spalte zu ermitteln.

Sie können auch festlegen, dass Visual Studio automatisch ein Zusammenfassungs- und ein Bearbeitungsformular generieren soll, indem Sie im Kontextmenü des Smarttags eines DataGrid-Steuerelements die Option Datenformulare generieren auswählen. Beachten Sie, dass in diesem Beispiel zu Demonstrationszwecken nur zwei Spalten für das Zusammenfassungs- und das Bearbeitungsformular verwendet werden.

Diese Anwendung enthält die in der folgenden Tabelle beschriebenen Formulare. Des Weiteren sind die entsprechenden Menüoptionen für die linke und die rechte Bildschirmtaste des Smartphones aufgeführt.

Formular

Features

Linke Bildschirmtaste

Rechte Bildschirmtaste

Hauptformular

(Form1)

Zeigt eine Spalte der Tabelle im DataGrid-Steuerelement im Format einer Smartphone-Kontaktliste an.

Durch Drücken der Aktionstaste oder der EINGABETASTE auf der Tastatur des Emulators wird das Zusammenfassungsansichtsformular angezeigt.

New

Fügt der Datenbank einen neuen Datensatz hinzu und zeigt das EditView-Formular an.

Edit

Zeigt das EditView-Formular an.

SummaryView

Zeigt Spaltenwerte des aktuellen Datensatzes in einem für die Anzeige optimierten Format an.

Done

Zeigt wieder das Hauptformular an.

(keine)

EditView

Zeigt Spaltenwerte des aktuellen Datensatzes in einem für die Bearbeitung optimierten Format an.

Done

Nimmt im Dialogfeld vorgenommene Änderungen an, aktualisiert die Datenbank und zeigt das Hauptformular an.

Cancel

Schließt das Dialogfeld und zeigt das Hauptformular an.

So erstellen Sie das Projekt und entwerfen das Hauptformular

  1. Erstellen Sie in Visual Studio ein Smart Device-Projekt und legen Sie die Zielplattform auf Windows Mobile 5.0 for Smartphone SDK oder Windows Mobile 6 Standard SDK fest.

  2. Klicken Sie im Menü Daten auf Neue Datenquelle hinzufügen.

  3. Stellen Sie im Assistenten zum Konfigurieren von Datenquellen mithilfe von Microsoft SQL Server Compact Edition (.NET Framework-Datenanbieter für SQL Server CE) eine Verbindung mit der Northwind-Datenbank her. Die Northwind-Datenbank, Northwind.sdf, ist im Ordner \Program Files\Microsoft SQL Server Compact Edition\v3\Samples installiert.

    Hinweis:

    Unter Windows Vista müssen Sie Visual Studio als Administrator ausführen, um auf die Northwind-Datenbank zuzugreifen. Weitere Informationen zum Hinzufügen einer Datenbank finden Sie unter Gewusst wie: Hinzufügen einer Datenbank zu einem Geräteprojekt.

  4. Wählen Sie im Assistenten auf der Seite Datenbankobjekte auswählen die Tabelle Products sowie alle darin enthaltenen Spalten aus.

  5. Fügen Sie dem Formular aus der Toolbox ein DataGrid-Steuerelement hinzu.

  6. Damit das DataGrid-Steuerelement wie die Liste Kontakte auf einem Smartphone angezeigt wird, legen Sie seine Eigenschaften entsprechend der folgenden Tabelle fest.

    DataGrid-Eigenschaft

    Wert

    ColumnHeadersVisible

    False

    RowHeadersVisible

    False

    GridLineColor

    Window

    Location

    Point-Struktur mit -2 für x und -2 für y

    Size

    Size-Struktur mit einer Breite von 184 und einer Höhe von 190

  7. Legen Sie die DataSource-Eigenschaft auf die Orders-Tabelle fest. Visual Studio fügt das NorthwindDataSet-Objekt, das ProductsBindingSource-Objekt und das ProductsTableAdapter-Objekt zum Projekt hinzu.

  8. Klicken Sie im Bereich Eigenschaften auf die TableStyles-Eigenschaft. Mit dieser Aktion wird das Dialogfeld DataGridTableStyle-Auflistungs-Editor angezeigt. Nun können Sie wie folgt verfahren:

    1. Fügen Sie der TableStyles-Auflistung ein DataGridTableStyle-Objekt hinzu.

    2. Geben Sie für die MappingName-Eigenschaft "Products" an.

    3. Klicken Sie auf die GridColumnStyle-Eigenschaft. Mit dieser Aktion wird das Dialogfeld DataGridColumnStyle-Auflistungs-Editor angezeigt.

    4. Fügen Sie der GridColumnStyles-Auflistung ein DataGridTextBoxColumn-Objekt hinzu.

    5. Klicken Sie auf die MappingName-Eigenschaft, und wählen Sie Product Name aus.

    6. Legen Sie den gewünschten Headertext und die gewünschte Breite fest.

    7. Wiederholen Sie diesen Vorgang für weitere Spalten.

    8. Schließen Sie die Dialogfelder.

  9. Fügen Sie dem Projekt zwei Formulare hinzu, eines für die Zusammenfassungsansicht und eines für die Bearbeitungsansicht. Nennen Sie das eine SummaryView und das andere EditView.

  10. Fügen Sie den Konstruktoren des SummaryView-Formulars und des EditView-Formulars einen Parameter zum Übernehmen eines BindingSource-Objekts hinzu. Deklarieren Sie in diesen Formularen die globale Variable CurrentBindingSouce, die auf das im Konstruktor übergebene BindingSource-Objekt festgelegt werden muss. Beachten Sie, dass die Festlegung erfolgen muss, bevor die InitializeComponent-Methode aufgerufen wird.

    Visual Basic-Entwickler müssen dem Formular Sub New hinzufügen. Zu diesem Zweck wird aus der Dropdownliste Methodenname oben rechts im Codebereich eine New-Methode hinzugefügt.

    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();
}

  11. Fügen Sie im Hauptformular ein MenuItem-Objekt mit dem Namen New(MenuItem1) und ein weiteres mit dem Namen Edit (MenuItem2) hinzu. Diese Menüs entsprechen der linken und rechten Bildschirmtaste des Smartphones. Fügen Sie den folgenden Code für die Click-Ereignisse für New und Edit hinzu.

    ' Add new record.
Private Sub MenuItem1_Click(ByVal sender As System.Object, _
  ByVal e As System.EventArgs) Handles MenuItem1.Click
    ProductsBindingSource.AddNew()
    Dim EditViewDialog As New EditView(ProductsBindingSource)
    If EditViewDialog.ShowDialog() <> DialogResult.OK Then
        ProductsBindingSource.CancelEdit()
    Else
        ProductsBindingSource.EndEdit()
        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 MenuItem1.Click
    Dim EditViewDialog As New EditView(ProductsBindingSource)
    If EditViewDialog.ShowDialog() <> DialogResult.OK Then
        ProductsBindingSource.CancelEdit()
    Else
        ProductsBindingSource.EndEdit()
        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);
    }
}

  12. Fügen Sie im Hauptformular Code für das KeyDown-Ereignis hinzu, das auftritt, wenn die Aktionstaste des Smartphones gedrückt wird. Durch diese Aktion wird das SummaryView-Formular angezeigt.

    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 SummaryView = New SummaryView(ProductsBindingSource)
        Cursor.Current = Cursors.Default
        SummaryView.ShowDialog()
    End If
End Sub

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

So erstellen Sie die Zusammenfassungsansicht

  1. Fügen Sie dem Formular folgende Steuerelemente hinzu:

    • Ein Label-Steuerelement für die Überschrift Product Name, z. B. "Product Name:".

    • Ein Label-Steuerelement für den Wert von Product Name.

    • Ein Label-Steuerelement für den Wert von Discontinued, das nur dann angezeigt wird, wenn der Wert der Spalte Discontinued der Tabelle Products true lautet. Geben Sie als Bezeichnung "DISCONTINUED" ein, und weisen Sie rote Schrift zu.

  2. Fügen Sie dem Konstruktor für das SummaryView-Formular den folgenden Code hinzu, um die Datenbindungen festzulegen. Deklarieren Sie eine Formularvariable mit dem Namen CurrentBindingSource, die auf die übergebene BindingSource-Instanz im Konstruktor des Formulars festgelegt werden muss. Durch ein DataRowView-Objekt wird festgelegt, dass die Bezeichnung Discontinued angezeigt wird, wenn der Wert der Spalte Discontinued true lautet.

    Public Sub New(ByVal bsource As BindingSource)
    CurrentBindingSource = bsource

    ' This call is required by the Windows Forms Designer.
    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.
        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;
    }
}

  3. Fügen Sie für die linke Bildschirmtaste ein MenuItem-Objekt mit dem Namen Done hinzu, um das Formular zu schließen und zum Hauptformular zurückzukehren.

    Private Sub MenuItem1_Click(ByVal sender As System.Object, _
  ByVal e As System.EventArgs) Handles MenuItem1.Click
    Me.Close
End Sub

    private void MenuItem1_Click(object sender, System.EventArgs e)
{
    this.Close();
}

So erstellen Sie die Bearbeitungsansicht

  1. Fügen Sie im Projekt einen Verweis auf den Microsoft.WindowsCE.Forms-Namespace hinzu. Dies ist erforderlich, um die InputMode-Einstellung des Smartphones für Textfeld-Steuerelemente festzulegen.

  2. Fügen Sie dem Formular folgende Steuerelemente hinzu:

    • Ein Label-Steuerelement für das Textfeld Product Name.

    • Ein TextBox-Steuerelement für die Spalte Product Name.

    • Ein CheckBox-Steuerelement für den Wert von Discontinued.

  3. Um Datenbindungen festzulegen, fügen Sie dem Konstruktor des Formulars nach dem InitializeComponent-Aufruf den folgenden Code hinzu. Dieser Code ermöglicht das Hinzufügen eines neuen Datensatzes oder das Bearbeiten eines vorhandenen Datensatzes. Wenn ein neuer Datensatz hinzugefügt wird, bestimmt ein DataRowView-Objekt, ob die Spalte Discontinued einen NULL-Wert aufweist. Wenn der Wert NULL ist, wird das Kontrollkästchen auf false festgelegt.

    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.

    ' Set the Smartphone input mode.
    InputModeEditor.SetInputMode(ProductNameTextBox,_
      InputMode.AlphaT9)
    ProductNameTextBox.DataBindings.Add("Text",_
      CurrentBindingSource, "Product Name")

    ' Determine the Discontinued value.
    ' If null, change to False.
    Dim drView As DataRowView
    drView = CurrentBindingSource.Current
    ' Set the bindings.
    If IsDBNull(drView("Discontinued")) Then
        DiscontinuedCheckBox.DataBindings.Add("CheckState",_
          CurrentBindingSource, "Discontinued", True,_
          DataSourceUpdateMode.OnValidation, False, "")
    Else
        DiscontinuedCheckBox.DataBindings.Add("Checked",_
          CurrentBindingSource, "Discontinued")
     End If
End Sub

    public EditView(BindingSource bsource)
{
    CurrentBindingSource = bsource;
    InitializeComponent();
    // Set the Smartphone input mode.
    InputModeEditor.SetInputMode(ProductNameTextBox,
      InputMode.AlphaT9);
    // Set the bindings.
    ProductNameTextBox.DataBindings.Add("Text",
      CurrentBindingSource,"Product Name");
    // Determine the Discontinued value.
    // If null, change to False.
    DataRowView drView;
    drView = (DataRowView) CurrentBindingSource.Current;
    if(drView("Discontinued")== null)
    {
        DiscontinuedCheckBox.DataBindings.Add("CheckState",
          CurrentBindingSource, "Discontinued",
          true,DataSourceUpdateMode.OnValidation,false,"");
    }
    else
    {
        DiscontinuedCheckBox.DataBindings.Add("Checked",
          CurrentBindingSource, "Discontinued");
    }
}

  1. Fügen Sie für die linke Bildschirmtaste ein MenuItem-Objekt mit dem Namen Donehinzu, um die Änderungen in die Datenbank zu übernehmen und zum Hauptformular zurückzukehren.

    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

    Private void MenuItem1_Click(object sender, System.EventArgs e)
{
    this.DialogResult = DialogResult.OK;
    this.Close();
}

  1. Fügen Sie für die rechte Bildschirmtaste ein MenuItem-Objekt mit dem Namen Cancelhinzu, um die Änderungen zu verwerfen und zum Hauptformular zurückzukehren.

    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

    Private void MenuItem2_Click(object sender, System.EventArgs e)
{
    this.DialogResult = DialogResult.Cancel;
    this.Close();
}

Kompilieren des Codes

Für dieses Beispiel sind Verweise auf die folgenden Namespaces erforderlich:

Siehe auch

Aufgaben

Gewusst wie: Verwenden von "DataGrid" auf dem Pocket PC

Konzepte

Erstellen stark typisierter 'DataSets' (ADO.NET)

Weitere Ressourcen

Datenzugriff und XML-Unterstützung in .NET Compact Framework