title | ms.date | dev_langs | helpviewer_keywords | ms.assetid | description | ||||
---|---|---|---|---|---|---|---|---|---|
Walkthrough: Binding to Data in Hybrid Applications |
03/30/2017 |
|
|
18997e71-745a-4425-9c69-2cbce1d8669e |
Learn how to use data binding in hybrid applications that include both Windows Forms and WPF controls. |
Binding a data source to a control is essential for providing users with access to underlying data, whether you are using Windows Forms or WPF. This walkthrough shows how you can use data binding in hybrid applications that include both Windows Forms and WPF controls.
Tasks illustrated in this walkthrough include:
-
Creating the project.
-
Defining the data template.
-
Specifying the form layout.
-
Specifying data bindings.
-
Displaying data by using interoperation.
-
Adding the data source to the project.
-
Binding to the data source.
For a complete code listing of the tasks illustrated in this walkthrough, see Data Binding in Hybrid Applications Sample.
When you are finished, you will have an understanding of data binding features in hybrid applications.
You need the following components to complete this walkthrough:
-
Visual Studio.
-
Access to the Northwind sample database running on Microsoft SQL Server.
-
Create a WPF Application project named
WPFWithWFAndDatabinding
. -
In Solution Explorer, add references to the following assemblies.
-
WindowsFormsIntegration
-
System.Windows.Forms
-
-
Open MainWindow.xaml in the WPF Designer.
-
In the xref:System.Windows.Window element, add the following Windows Forms namespaces mapping.
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
-
Name the default xref:System.Windows.Controls.Grid element
mainGrid
by assigning the xref:System.Windows.FrameworkElement.Name%2A property.[!code-xamlWPFWithWFAndDatabinding#8]
The master list of customers is displayed in a xref:System.Windows.Controls.ListBox control. The following code example defines a xref:System.Windows.DataTemplate object named ListItemsTemplate
that controls the visual tree of the xref:System.Windows.Controls.ListBox control. This xref:System.Windows.DataTemplate is assigned to the xref:System.Windows.Controls.ListBox control's xref:System.Windows.Controls.ItemsControl.ItemTemplate%2A property.
-
Copy the following XAML into the xref:System.Windows.Controls.Grid element's declaration.
[!code-xamlWPFWithWFAndDatabinding#3]
The layout of the form is defined by a grid with three rows and three columns. xref:System.Windows.Controls.Label controls are provided to identify each column in the Customers table.
-
Copy the following XAML into the xref:System.Windows.Controls.Grid element's declaration.
[!code-xamlWPFWithWFAndDatabinding#4]
-
Copy the following XAML into the xref:System.Windows.Controls.Grid element's declaration.
[!code-xamlWPFWithWFAndDatabinding#5]
The master list of customers is displayed in a xref:System.Windows.Controls.ListBox control. The attached ListItemsTemplate
binds a xref:System.Windows.Controls.TextBlock control to the ContactName
field from the database.
The details of each customer record are displayed in several xref:System.Windows.Controls.TextBox controls.
-
Copy the following XAML into the xref:System.Windows.Controls.Grid element's declaration.
The xref:System.Windows.Data.Binding class binds the xref:System.Windows.Controls.TextBox controls to the appropriate fields in the database.
[!code-xamlWPFWithWFAndDatabinding#6]
The orders corresponding to the selected customer are displayed in a xref:System.Windows.Forms.DataGridView?displayProperty=nameWithType control named dataGridView1
. The dataGridView1
control is bound to the data source in the code-behind file. A xref:System.Windows.Forms.Integration.WindowsFormsHost control is the parent of this Windows Forms control.
-
Copy the following XAML into the xref:System.Windows.Controls.Grid element's declaration.
[!code-xamlWPFWithWFAndDatabinding#7]
With Visual Studio, you can easily add a data source to your project. This procedure adds a strongly typed data set to your project. Several other support classes, such as table adapters for each of the chosen tables, are also added.
-
From the Data menu, select Add New Data Source.
-
In the Data Source Configuration Wizard, create a connection to the Northwind database by using a dataset. For more information, see How to: Connect to Data in a Database.
-
When you are prompted by the Data Source Configuration Wizard, save the connection string as
NorthwindConnectionString
. -
When you are prompted to choose your database objects, select the
Customers
andOrders
tables, and name the generated data setNorthwindDataSet
.
The xref:System.Windows.Forms.BindingSource?displayProperty=nameWithType component provides a uniform interface for the application's data source. Binding to the data source is implemented in the code-behind file.
-
Open the code-behind file, which is named MainWindow.xaml.vb or MainWindow.xaml.cs.
-
Copy the following code into the
MainWindow
class definition.This code declares the xref:System.Windows.Forms.BindingSource component and associated helper classes that connect to the database.
[!code-csharpWPFWithWFAndDatabinding#11] [!code-vbWPFWithWFAndDatabinding#11]
-
Copy the following code into the constructor.
This code creates and initializes the xref:System.Windows.Forms.BindingSource component.
[!code-csharpWPFWithWFAndDatabinding#12] [!code-vbWPFWithWFAndDatabinding#12]
-
Open MainWindow.xaml.
-
In Design view or XAML view, select the xref:System.Windows.Window element.
-
In the Properties window, click the Events tab.
-
Double-click the xref:System.Windows.FrameworkElement.Loaded event.
-
Copy the following code into the xref:System.Windows.FrameworkElement.Loaded event handler.
This code assigns the xref:System.Windows.Forms.BindingSource component as the data context and populates the
Customers
andOrders
adapter objects.[!code-csharpWPFWithWFAndDatabinding#13] [!code-vbWPFWithWFAndDatabinding#13]
-
Copy the following code into the
MainWindow
class definition.This method handles the xref:System.Windows.Data.CollectionView.CurrentChanged event and updates the current item of the data binding.
[!code-csharpWPFWithWFAndDatabinding#14] [!code-vbWPFWithWFAndDatabinding#14]
-
Press F5 to build and run the application.
- xref:System.Windows.Forms.Integration.ElementHost
- xref:System.Windows.Forms.Integration.WindowsFormsHost
- Design XAML in Visual Studio
- Data Binding in Hybrid Applications Sample
- Walkthrough: Hosting a Windows Forms Composite Control in WPF
- Walkthrough: Hosting a WPF Composite Control in Windows Forms