MSDN Magazine - December 2007 - (Page 29) Data Binding in WPF JOHN PAPA B y now, many of you know that Windows® Presentation Foundation (WPF) makes it easy to design robust user interfaces. But what you probably didn’t know is that it also provides powerful data-binding capabilities. With WPF, you can perform data manipulation using Microsoft® .NET Framework code, XAML, or a combination of both. You can bind to controls, public properties, XML, or objects, making data binding quick, flexible, and easier than ever. So let’s take a look at how you can get started binding your controls to the data sources of your choice. Figure 1 Basic but Verbose Binding to a Control Data Binding Specifics To use WPF data binding, you must always have a target and a source. The target of the binding can be any accessible property or element that is derived from DependencyProperty—an example is a TextBox control’s Text property. The source of the binding can be any public property, including properties of other controls, common language runtime (CLR) objects, XAML elements, ADO.NET DataSets, XML Fragments, and so forth. To help you get the binding right, WPF includes two special providers—the XmlDataProvider and the ObjectDataProvider. Now let’s take a look at how the WPF data-binding techniques work and I’ll present practical examples that illustrate their use. shorthand syntax for data binding. For example, let’s replace the TextBlock’s tag with the following code snippet: Creating a Simple Binding This syntax, called the attribute syntax, condenses the data binding code inside of the Text attribute of the TextBlock. Basically, the Binding tag gets pulled inside of the curly braces along with its attributes. Let’s start with a simple example that illustrates how to bind a TextBlock’s Text propBinding Modes erty to a ListBox’s selected item. The code I can take the previous example further, displayed in Figure 1 shows a ListBox that binding the background color of the TextBlock has six ListBoxItems declared. The second to the color that is selected in the ListBox. The Figure 2 Binding a Source to Two Targets TextBlock in the code example has a properfollowing code adds a Background property ty called Text (specified in XAML property-element syntax with to the TextBlock and uses the attribute binding syntax to bind to the XML child element ), which will contain the the value of the selected item in the ListBox: text for the TextBlock. The Text property declares a binding to the <TextBlock Width=”248” Height=”24” ListBox’s selected item with the tag. The ElementName Text=”{Binding ElementName=lbColor, Path=SelectedItem.Content, Mode=OneWay}” attribute of the Binding tag indicates the name of the control that x:Name=”tbSelectedColor” the TextBlock’s Text property is bound to. The Path attribute inBackground=”{Binding ElementName=lbColor, Path=SelectedItem.Content, Mode=OneWay}”/> dicates the property of the element (in this case the ListBox) that we will be binding to. The result of this code is that when a color When the user selects a color in the ListBox, the name of that colis selected from the ListBox, the name of that color is shown in or will appear in the TextBlock and the background color of the the TextBlock. TextBlock will change to the selected color (see Figure 2). The code listed in Figure 1 can be modified slightly to use a Notice the statement in the previous example that sets the Mode december2007 29
For optimal viewing of this digital publication, please enable JavaScript and then refresh the page. If you would like to try to load the digital publication without using Flash Player detection, please click here.