Návod: Připojení k datům v hybridních aplikacích

Článek
11/24/2024

Vytvoření vazby zdroje dat k ovládacímu prvku je nezbytné pro poskytování přístupu uživatelů k podkladovým datům bez ohledu na to, jestli používáte model Windows Forms nebo WPF. Tento návod ukazuje, jak můžete používat datové vazby v hybridních aplikacích, které zahrnují ovládací prvky model Windows Forms i WPF.

Mezi úlohy znázorněné v tomto názorném postupu patří:

Vytvoření projektu
Definování šablony dat
Určení rozložení formuláře
Určení datových vazeb
Zobrazení dat pomocí spolupráce
Přidání zdroje dat do projektu
Vazba ke zdroji dat

Kompletní výpis kódu úloh, které jsou znázorněny v tomto názorném postupu, najdete v části Datové vazby v ukázce hybridních aplikací.

Až budete hotovi, budete mít přehled o funkcích datových vazeb v hybridních aplikacích.

Požadavky

K dokončení tohoto návodu budete potřebovat následující komponenty:

Visual Studio.
Přístup k ukázkové databázi Northwind spuštěné na Microsoft SQL Serveru

Vytvoření projektu

Vytvoření a nastavení projektu

Vytvořte projekt aplikace WPF s názvem WPFWithWFAndDatabinding.
V Průzkumník řešení přidejte odkazy na následující sestavení.
- WindowsFormsIntegration
- System.Windows.Forms
Otevřete MainWindow.xaml v Návrháři WPF.
Do elementu Window přidejte následující mapování oborů názvů model Windows Forms.
```
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
```
Pojmenujte výchozí Grid prvek mainGrid přiřazením Name vlastnosti.
```
<Grid x:Name="mainGrid">
```

Definování šablony dat

Hlavní seznam zákazníků se zobrazí v ovládacím ListBox prvku. Následující příklad kódu definuje DataTemplate objekt s názvem ListItemsTemplate , který řídí vizuální strom ListBox ovládacího prvku. Toto DataTemplate je přiřazeno vlastnosti ListBox ovládacího prvku ItemTemplate .

Definování šablony dat

Zkopírujte následující kód XAML do deklarace elementu Grid .

<Grid.Resources>
    <DataTemplate x:Key="ListItemsTemplate">
        <TextBlock Text="{Binding Path=ContactName}"/>
    </DataTemplate>
</Grid.Resources>

Určení rozložení formuláře

Rozložení formuláře je definováno mřížkou se třemi řádky a třemi sloupci. Label Jsou k dispozici ovládací prvky pro identifikaci jednotlivých sloupců v tabulce Zákazníci.

Nastavení rozložení mřížky

Zkopírujte následující kód XAML do deklarace elementu Grid .

<Grid.RowDefinitions>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="Auto"/>
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto"/>
    <ColumnDefinition Width="Auto"/>
    <ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>

Nastavení ovládacích prvků Popisek

Zkopírujte následující kód XAML do deklarace elementu Grid .

<StackPanel Orientation="Vertical" Grid.Row="0" Grid.Column="1">
    <Label Margin="20,38,5,2">First Name:</Label>
    <Label Margin="20,0,5,2">Company Name:</Label>
    <Label Margin="20,0,5,2">Phone:</Label>
    <Label Margin="20,0,5,2">Address:</Label>
    <Label Margin="20,0,5,2">City:</Label>
    <Label Margin="20,0,5,2">Region:</Label>
    <Label Margin="20,0,5,2">Postal Code:</Label>
</StackPanel>

Určení datových vazeb

Hlavní seznam zákazníků se zobrazí v ovládacím ListBox prvku. Připojená ListItemsTemplate vazba TextBlock ovládacího prvku na ContactName pole z databáze.

Podrobnosti o každém záznamu zákazníka se zobrazují v několika TextBox ovládacích prvcích.

Určení datových vazeb

Zkopírujte následující kód XAML do deklarace elementu Grid .

Třída Binding sváže TextBox ovládací prvky s příslušnými poli v databázi.

<StackPanel Orientation="Vertical" Grid.Row="0" Grid.Column="0">
    <Label Margin="20,5,5,0">List of Customers:</Label>
    <ListBox x:Name="listBox1" Height="200" Width="200" HorizontalAlignment="Left" 
       ItemTemplate="{StaticResource ListItemsTemplate}" IsSynchronizedWithCurrentItem="True" Margin="20,5,5,5"/>
</StackPanel>

<StackPanel Orientation="Vertical" Grid.Row="0" Grid.Column="2">
    <TextBox Margin="5,38,5,2" Width="200" Text="{Binding Path=ContactName}"/>
    <TextBox Margin="5,0,5,2" Width="200" Text="{Binding Path=CompanyName}"/>
    <TextBox Margin="5,0,5,2" Width="200" Text="{Binding Path=Phone}"/>
    <TextBox Margin="5,0,5,2" Width="200" Text="{Binding Path=Address}"/>
    <TextBox Margin="5,0,5,2" Width="200" Text="{Binding Path=City}"/>
    <TextBox Margin="5,0,5,2" Width="30" HorizontalAlignment="Left" Text="{Binding Path=Region}"/>
    <TextBox Margin="5,0,5,2" Width="50" HorizontalAlignment="Left" Text="{Binding Path=PostalCode}"/>
</StackPanel>

Zobrazení dat pomocí spolupráce

Objednávky odpovídající vybranému zákazníkovi se zobrazí v ovládacím System.Windows.Forms.DataGridView prvku s názvem dataGridView1. Ovládací dataGridView1 prvek je vázán na zdroj dat v souboru kódu za kódem. Ovládací WindowsFormsHost prvek je nadřazený tento ovládací prvek model Windows Forms.

Zobrazení dat v ovládacím prvku DataGridView

Zkopírujte následující kód XAML do deklarace elementu Grid .

<WindowsFormsHost Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3" Margin="20,5,5,5" Height="300">
    <wf:DataGridView x:Name="dataGridView1"/>
</WindowsFormsHost>

Přidání zdroje dat do projektu

V sadě Visual Studio můžete do projektu snadno přidat zdroj dat. Tento postup přidá do projektu sadu dat silného typu. Přidá se také několik dalších tříd podpory, jako jsou adaptéry tabulek pro každou z vybraných tabulek.

Přidání zdroje dat

V nabídce Data vyberte Přidat nový zdroj dat.
V Průvodci konfigurací zdroje dat vytvořte připojení k databázi Northwind pomocí datové sady. Další informace naleznete v tématu Postupy: Připojení k datům v databázi.
Po zobrazení výzvy Průvodce konfigurací zdroje dat uložte připojovací řetězec jako NorthwindConnectionString.

Důležité

Ukládání citlivých informací, například hesla, v rámci připojovací řetězec může ovlivnit zabezpečení vaší aplikace. Ověřování systému Windows, označované také jako integrované zabezpečení, je bezpečnější způsob řízení přístupu k databázi. Další informace naleznete v tématu Ochrana informací o připojení.
Po zobrazení výzvy k výběru databázových objektů vyberte Customers objekty a Orders tabulky a pojmenujte vygenerovanou sadu NorthwindDataSetdat .

Vazba ke zdroji dat

Komponenta System.Windows.Forms.BindingSource poskytuje jednotné rozhraní pro zdroj dat aplikace. Vazba ke zdroji dat se implementuje v souboru kódu za kódem.

Vytvoření vazby ke zdroji dat

Otevřete soubor kódu, který má název MainWindow.xaml.vb nebo MainWindow.xaml.cs.

Do definice třídy zkopírujte následující kód MainWindow .

Tento kód deklaruje komponentu BindingSource a přidružené pomocné třídy, které se připojují k databázi.

private System.Windows.Forms.BindingSource nwBindingSource;
private NorthwindDataSet nwDataSet;
private NorthwindDataSetTableAdapters.CustomersTableAdapter customersTableAdapter =
    new NorthwindDataSetTableAdapters.CustomersTableAdapter();
private NorthwindDataSetTableAdapters.OrdersTableAdapter ordersTableAdapter =
    new NorthwindDataSetTableAdapters.OrdersTableAdapter();

Private nwBindingSource As System.Windows.Forms.BindingSource
Private nwDataSet As NorthwindDataSet
Private customersTableAdapter As New NorthwindDataSetTableAdapters.CustomersTableAdapter()
Private ordersTableAdapter As New NorthwindDataSetTableAdapters.OrdersTableAdapter()

Zkopírujte následující kód do konstruktoru.

Tento kód vytvoří a inicializuje komponentu BindingSource .

public MainWindow()
{
    InitializeComponent();

    // Create a DataSet for the Customers data.
    this.nwDataSet = new NorthwindDataSet();
    this.nwDataSet.DataSetName = "nwDataSet";

    // Create a BindingSource for the Customers data.
    this.nwBindingSource = new System.Windows.Forms.BindingSource();
    this.nwBindingSource.DataMember = "Customers";
    this.nwBindingSource.DataSource = this.nwDataSet;
}

Public Sub New()
    InitializeComponent()

    ' Create a DataSet for the Customers data.
    Me.nwDataSet = New NorthwindDataSet()
    Me.nwDataSet.DataSetName = "nwDataSet"

    ' Create a BindingSource for the Customers data.
    Me.nwBindingSource = New System.Windows.Forms.BindingSource()
    Me.nwBindingSource.DataMember = "Customers"
    Me.nwBindingSource.DataSource = Me.nwDataSet

End Sub

Otevřete MainWindow.xaml.
V návrhovém zobrazení nebo v zobrazení XAML vyberte Window prvek.
V okno Vlastnosti klikněte na kartu Události.
Poklikejte na Loaded událost.

Zkopírujte následující kód do obslužné rutiny Loaded události.

Tento kód přiřadí komponentu BindingSource jako kontext dat a naplní objekty adaptéru CustomersOrders .

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    // Fill the Customers table adapter with data.
    this.customersTableAdapter.ClearBeforeFill = true;
    this.customersTableAdapter.Fill(this.nwDataSet.Customers);

    // Fill the Orders table adapter with data.
    this.ordersTableAdapter.Fill(this.nwDataSet.Orders);

    // Assign the BindingSource to
    // the data context of the main grid.
    this.mainGrid.DataContext = this.nwBindingSource;

    // Assign the BindingSource to
    // the data source of the list box.
    this.listBox1.ItemsSource = this.nwBindingSource;

    // Because this is a master/details form, the DataGridView
    // requires the foreign key relating the tables.
    this.dataGridView1.DataSource = this.nwBindingSource;
    this.dataGridView1.DataMember = "FK_Orders_Customers";

    // Handle the currency management aspect of the data models.
    // Attach an event handler to detect when the current item
    // changes via the WPF ListBox. This event handler synchronizes
    // the list collection with the BindingSource.
    //

    BindingListCollectionView cv = CollectionViewSource.GetDefaultView(
        this.nwBindingSource) as BindingListCollectionView;

    cv.CurrentChanged += new EventHandler(WPF_CurrentChanged);
}

Private Sub Window_Loaded( _
ByVal sender As Object, _
ByVal e As RoutedEventArgs)

    ' Fill the Customers table adapter with data.
    Me.customersTableAdapter.ClearBeforeFill = True
    Me.customersTableAdapter.Fill(Me.nwDataSet.Customers)

    ' Fill the Orders table adapter with data.
    Me.ordersTableAdapter.Fill(Me.nwDataSet.Orders)

    ' Assign the BindingSource to 
    ' the data context of the main grid.
    Me.mainGrid.DataContext = Me.nwBindingSource

    ' Assign the BindingSource to 
    ' the data source of the list box.
    Me.listBox1.ItemsSource = Me.nwBindingSource

    ' Because this is a master/details form, the DataGridView
    ' requires the foreign key relating the tables.
    Me.dataGridView1.DataSource = Me.nwBindingSource
    Me.dataGridView1.DataMember = "FK_Orders_Customers"

    ' Handle the currency management aspect of the data models.
    ' Attach an event handler to detect when the current item 
    ' changes via the WPF ListBox. This event handler synchronizes
    ' the list collection with the BindingSource.
    '

    Dim cv As BindingListCollectionView = _
        CollectionViewSource.GetDefaultView(Me.nwBindingSource)

    AddHandler cv.CurrentChanged, AddressOf WPF_CurrentChanged

End Sub

Do definice třídy zkopírujte následující kód MainWindow .

Tato metoda zpracovává CurrentChanged událost a aktualizuje aktuální položku datové vazby.

// This event handler updates the current item
// of the data binding.
void WPF_CurrentChanged(object sender, EventArgs e)
{
    BindingListCollectionView cv = sender as BindingListCollectionView;
    this.nwBindingSource.Position = cv.CurrentPosition;
}

' This event handler updates the current item 
' of the data binding.
Private Sub WPF_CurrentChanged(ByVal sender As Object, ByVal e As EventArgs)
    Dim cv As BindingListCollectionView = sender
    Me.nwBindingSource.Position = cv.CurrentPosition
End Sub

Stiskněte F5, aby se aplikace sestavila a spustila.

Viz také