İzlenecek yol: Karma Uygulamalarda Veriye Bağlama

Bir veri kaynağını denetime bağlama, kullanıcıların temel verilere erişim sağlaması için Windows Forms veya kullanıyor olmanız durumunda gereklidir WPF . Bu izlenecek yol, hem Windows Forms hem de denetimleri içeren karma uygulamalarda veri bağlamayı nasıl kullanabileceğinizi gösterir WPF .

Bu izlenecek yolda gösterilen görevler şunlardır:

  • Proje oluşturuluyor.

  • Veri şablonunu tanımlama.

  • Form düzeni belirtiliyor.

  • Veri bağlamalarını belirtme.

  • Birlikte çalışabilirlik kullanarak verileri görüntüleme.

  • Veri kaynağı projeye ekleniyor.

  • Veri kaynağına bağlanıyor.

Bu izlenecek yolda gösterilen görevlerin tüm kod listesi için bkz. karma uygulamalar Için veri bağlama örneği.

İşiniz bittiğinde, karma uygulamalardaki veri bağlama özelliklerinin anlaşılmasına sahip olacaksınız.

Önkoşullar

Bu izlenecek yolu tamamlamak için aşağıdaki bileşenlere ihtiyacınız vardır:

  • Visual Studio.

  • Microsoft SQL Server üzerinde çalışan Northwind örnek veritabanına erişim.

Projeyi Oluşturma

Projeyi oluşturmak ve ayarlamak için

  1. Adlı bir WPF uygulaması projesi oluşturun WPFWithWFAndDatabinding .

  2. Çözüm Gezgini, aşağıdaki derlemelere başvurular ekleyin.

    • WindowsFormsIntegration

    • System. Windows. Forms

  3. WPF Tasarımcısında MainWindow. xaml ' i açın.

  4. WindowÖğesinde, aşağıdaki Windows Forms ad alanları eşlemesini ekleyin.

    xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
    
  5. GridÖzelliği atayarak varsayılan öğeyi adlandırın mainGrid Name .

    <Grid x:Name="mainGrid">
    

Veri şablonunu tanımlama

Müşterilerin ana listesi bir ListBox denetimde görüntülenir. Aşağıdaki kod örneği, DataTemplate ListItemsTemplate denetimin görsel ağacını denetleyen adlı bir nesneyi tanımlar ListBox . Bu DataTemplate , ListBox denetimin ItemTemplate özelliğine atanır.

Veri şablonunu tanımlamak için

  • Aşağıdaki XAML 'yi Grid öğenin bildirimine kopyalayın.

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

Form düzeni belirtme

Formun düzeni üç satır ve üç sütunlu bir kılavuz tarafından tanımlanır. Label Müşteriler tablosundaki her bir sütunu tanımlamak için denetimler sağlanır.

Kılavuz yerleşimini ayarlamak için

  • Aşağıdaki XAML 'yi Grid öğenin bildirimine kopyalayın.

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

Etiket denetimlerini ayarlamak için

  • Aşağıdaki XAML 'yi Grid öğenin bildirimine kopyalayın.

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

Veri bağlamalarını belirtme

Müşterilerin ana listesi bir ListBox denetimde görüntülenir. Ekli ListItemsTemplate bir denetimi, TextBlock ContactName veritabanından alana bağlar.

Her müşteri kaydının ayrıntıları çeşitli TextBox denetimlerde görüntülenir.

Veri bağlamalarını belirtmek için

  • Aşağıdaki XAML 'yi Grid öğenin bildirimine kopyalayın.

    BindingSınıfı, TextBox denetimleri veritabanındaki uygun alanlara bağlar.

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

Birlikte çalışabilirlik kullanarak verileri görüntüleme

Seçilen müşteriye karşılık gelen siparişler System.Windows.Forms.DataGridView adlı bir denetimde görüntülenir dataGridView1 . dataGridView1Denetim, arka plan kod dosyasındaki veri kaynağına bağlanır. WindowsFormsHostDenetim, bu Windows Forms denetiminin üst öğesidir.

DataGridView denetiminde verileri görüntüleme

  • Aşağıdaki XAML 'yi Grid öğenin bildirimine kopyalayın.

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

Veri kaynağı projeye ekleniyor

Visual Studio ile projenize kolayca veri kaynağı ekleyebilirsiniz. Bu yordam, projenize kesin olarak belirlenmiş bir veri kümesi ekler. Seçili tabloların her biri için tablo bağdaştırıcıları gibi diğer çeşitli destek sınıfları da eklenir.

Veri kaynağını eklemek için

  1. Veri menüsünde Yeni veri kaynağı Ekle' yi seçin.

  2. Veri kaynağı Yapılandırma sihirbazında, bir veri kümesi kullanarak Northwind veritabanına bir bağlantı oluşturun. Daha fazla bilgi için bkz. nasıl yapılır: veritabanındaki verilere bağlanma.

  3. Veri kaynağı Yapılandırma Sihirbazı sorulduğunda, bağlantı dizesini olarak kaydedin NorthwindConnectionString .

  4. Veritabanı nesnelerinizi seçmeniz istendiğinde, Customers ve Orders tablolarını seçip oluşturulan veri kümesini adlandırın NorthwindDataSet .

Veri kaynağına bağlama

System.Windows.Forms.BindingSourceBileşen, uygulamanın veri kaynağı için tekdüzen arabirimi sağlar. Veri kaynağına bağlama, arka plan kod dosyasında uygulanır.

Veri kaynağına bağlamak için

  1. MainWindow. xaml. vb veya MainWindow. xaml. cs adlı arka plan kod dosyasını açın.

  2. Aşağıdaki kodu MainWindow sınıf tanımına kopyalayın.

    Bu kod, BindingSource bileşeni ve veritabanına bağlanan ilişkili yardımcı sınıfları bildirir.

    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()
    
  3. Oluşturucuya aşağıdaki kodu kopyalayın.

    Bu kod bileşeni oluşturur ve başlatır 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
    
  4. MainWindow. xaml ' i açın.

  5. Tasarım görünümü veya XAML görünümünde Window öğesini seçin.

  6. Özellikler penceresi, Olaylar sekmesine tıklayın.

  7. Olaya çift tıklayın Loaded .

  8. Aşağıdaki kodu Loaded olay işleyicisine kopyalayın.

    Bu kod, BindingSource bileşeni veri bağlamı olarak atar ve Customers ve Orders Bağdaştırıcı nesnelerini doldurur.

    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
    
  9. Aşağıdaki kodu MainWindow sınıf tanımına kopyalayın.

    Bu yöntem, CurrentChanged olayı işler ve veri bağlamasının geçerli öğesini güncelleştirir.

    // 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
    
  10. Uygulamayı derleyip çalıştırmak için F5'e basın.

Ayrıca bkz.