Útmutató: Kötés az adatokhoz hibrid alkalmazásokban

Az adatforrások vezérlőkhöz való kötése elengedhetetlen ahhoz, hogy a felhasználók hozzáférhessenek a mögöttes adatokhoz, függetlenül attól, hogy Windows Formst vagy WPF-et használnak. Ez az útmutató bemutatja, hogyan használhat adatkötést olyan hibrid alkalmazásokban, amelyek windowsos űrlapokat és WPF-vezérlőket is tartalmaznak.

Az ebben az útmutatóban bemutatott feladatok a következők:

A projekt létrehozása.
Az adatsablon meghatározása.
Az űrlap elrendezésének megadása.
Adatkötések megadása.
Adatok megjelenítése interoperációval.
Adatforrás hozzáadása a projekthez.
Kötés az adatforráshoz.

Az ebben az útmutatóban bemutatott feladatok teljes kódlistájáért tekintse meg hibridalkalmazás-mintaadatkötést.

Ha végzett, megismerheti a hibrid alkalmazások adatkötési funkcióit.

Előfeltételek

Az útmutató elvégzéséhez a következő összetevőkre van szüksége:

Visual Studio.
Hozzáférés a Microsoft SQL Serveren futó Northwind mintaadatbázishoz.

A projekt létrehozása

A projekt létrehozása és beállítása

Hozzon létre egy WPFWithWFAndDatabindingnevű WPF-alkalmazásprojektet.
A Megoldáskezelőben adjon hozzá hivatkozásokat az alábbi szerelvényekhez.
- WindowsFormsIntegration
- System.Windows.Forms
Nyissa meg a MainWindow.xaml fájlt a WPF Designerben.
A Window elemben adja hozzá a következő Windows Forms névterek társítását.
```
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
```
Nevezze el az alapértelmezett Grid elemet mainGrid a Name tulajdonság hozzárendelésével.
```
<Grid x:Name="mainGrid">
```

Az adatsablon meghatározása

Az ügyfelek fő listája megjelenik egy ListBox vezérlőelemben. Az alábbi példakód egy DataTemplate nevű ListItemsTemplate objektumot határoz meg, amely a ListBox vezérlőelem vizualizációfáját vezérli. Ez a DataTemplate a ListBox vezérlőelem ItemTemplate tulajdonságához van rendelve.

Az adatsablon definiálása

Másolja a következő XAML-t a Grid elem deklarációjába.

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

Az űrlapelrendezés megadása

Az űrlap elrendezését egy három sorból és három oszlopból álló rács határozza meg. Label vezérlők a Vevők tábla egyes oszlopainak azonosítására szolgálnak.

A rács elrendezésének beállítása

Másolja a következő XAML-t a Grid elem deklarációjába.

<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>

A Címkevezérlők beállítása

Másolja a következő XAML-t a Grid elem deklarációjába.

<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>

Adatkötések megadása

Az ügyfelek fő listája megjelenik egy ListBox vezérlőelemben. A csatolt ListItemsTemplate egy TextBlock vezérlőelemet köt az adatbázis ContactName mezőjéhez.

Az egyes ügyfélrekordok részletei több TextBox vezérlőelemben is megjelennek.

Adatkötések megadása

Másolja a következő XAML-t a Grid elem deklarációjába.

A Binding osztály az TextBox vezérlőket az adatbázis megfelelő mezőihez köti.

<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>

Adatok megjelenítése interoperation használatával

A kiválasztott ügyfélnek megfelelő rendelések System.Windows.Forms.DataGridViewdataGridView1nevű vezérlőelemben jelennek meg. A dataGridView1 vezérlőelem a kód mögötti fájl adatforrásához van kötve. Ennek a Windows Forms-vezérlőnek a szülője egy WindowsFormsHost vezérlőelem.

Adatok megjelenítése a DataGridView vezérlőben

Másolja a következő XAML-t a Grid elem deklarációjába.

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

Adatforrás hozzáadása a projekthez

A Visual Studióval egyszerűen hozzáadhat adatforrást a projekthez. Ez az eljárás egy szigorúan típusos adatkészletet ad hozzá a projekthez. A rendszer számos más támogatási osztályt is hozzáad, például a kiválasztott táblákhoz tartozó táblaadaptereket.

Az adatforrás hozzáadása

Az Adatok menüben válassza Új adatforrás hozzáadásalehetőséget.
Az Adatforrás-konfiguráló varázslósegítségével hozzon létre egy kapcsolatot a Northwind adatbázissal, adatkészletet használva. További információért lásd: Hogyan csatlakozzunk az adatokhoz egy adatbázisban.
Amikor a Adatforrás-konfigurációs varázslókéri, mentse a kapcsolati karakterláncot NorthwindConnectionString.

Fontos

A bizalmas adatok, például a jelszó a kapcsolati sztringen belül történő tárolása hatással lehet az alkalmazás biztonságára. A Windows-hitelesítés, más néven integrált biztonság használata biztonságosabb módszer az adatbázisokhoz való hozzáférés szabályozására. További információ: Kapcsolati adatok védelme.
Amikor a rendszer kéri az adatbázis-objektumok kiválasztását, jelölje ki a Customers és Orders táblákat, és nevezze el a létrehozott adatkészletet NorthwindDataSet.

Kötés az adatforráshoz

A System.Windows.Forms.BindingSource összetevő egységes felületet biztosít az alkalmazás adatforrásához. Az adatforráshoz való kötés a kód mögötti fájlban van implementálva.

Az adatforráshoz való kötéshez

Nyissa meg a MainWindow.xaml.vb vagy MainWindow.xaml.cs nevű kód mögötti fájlt.

Másolja a következő kódot a MainWindow osztálydefinícióba.

Ez a kód deklarálja az adatbázishoz csatlakozó BindingSource összetevőt és a kapcsolódó segédosztályokat.

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

Másolja a következő kódot a konstruktorba.

Ez a kód létrehozza és inicializálja a BindingSource összetevőt.

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

Nyissa meg a MainWindow.xaml fájlt.
Tervező vagy XAML nézetben válassza ki a Window elemet.
A Tulajdonságok ablakban kattintson az Események fülre.
Kattintson duplán a Loaded eseményre.

Másolja a következő kódot az Loaded eseménykezelőbe.

Ez a kód az adatkörnyezetként hozzárendeli a BindingSource összetevőt, és feltölti a Customers és Orders adapterobjektumokat.

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

Másolja a következő kódot a MainWindow osztálydefinícióba.

Ez a metódus kezeli a CurrentChanged eseményt, és frissíti az adatkötés aktuális elemét.

// 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

Nyomja le az F5 billentyűt az alkalmazás létrehozásához és futtatásához.

Lásd még

Visszajelzés

Hasznosnak találta ezt az oldalt?

Last updated on 2025-05-07