WPF Databinding- Not your fathers databinding Part 1-3
- by Shervin Shakibi
As Promised here is my advanced databinding presentation from South Florida Code camp and also Orlando Code camp. you can find the demo files here. http://ssccinc.com/wpfdatabinding.zip Here is a quick description of the first demos, there will be 2 other Blogposting in the next few days getting into more advance databinding topics. Example00 Here we have 3 textboxes, The first textbox mySourceElement Second textbox has a binding to mySourceElement and Path= Text <Binding ElementName="mySourceElement" Path="Text" /> Third textbox is also bound to the Text property but we use inline Binding <TextBlock Text="{Binding ElementName=mySourceElement,Path=Text }" Grid.Row="2" /> Here is the entire XAML <Grid > <Grid.RowDefinitions > <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <TextBox Name="mySourceElement" Grid.Row="0" TextChanged="mySourceElement_TextChanged">Hello Orlnado</TextBox> <TextBlock Grid.Row="1"> <TextBlock.Text> <Binding ElementName="mySourceElement" Path="Text" /> </TextBlock.Text> </TextBlock> <TextBlock Text="{Binding ElementName=mySourceElement,Path=Text }" Grid.Row="2" /> </Grid> </Window> Example01 we have a slider control, then we have two textboxes bound to the value property of the slider. one has its text property bound, the second has its fontsize property bound. <Grid> <Grid.RowDefinitions > <RowDefinition Height="40px" /> <RowDefinition Height="40px" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Slider Name="fontSizeSlider" Minimum="5" Maximum="100" Value="10" Grid.Row="0" /> <TextBox Name="SizeTextBox" Text="{Binding ElementName=fontSizeSlider, Path=Value}" Grid.Row="1"/> <TextBlock Text="Example 01" FontSize="{Binding ElementName=SizeTextBox, Path=Text}" Grid.Row="2"/> </Grid> Example02 very much like the previous example but it also has a font dropdown <Grid> <Grid.RowDefinitions > <RowDefinition Height="20px" /> <RowDefinition Height="40px" /> <RowDefinition Height="40px" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <ComboBox Name="FontNameList" SelectedIndex="0" Grid.Row="0"> <ComboBoxItem Content="Arial" /> <ComboBoxItem Content="Calibri" /> <ComboBoxItem Content="Times New Roman" /> <ComboBoxItem Content="Verdana" /> </ComboBox> <Slider Name="fontSizeSlider" Minimum="5" Maximum="100" Value="10" Grid.Row="1" /> <TextBox Name="SizeTextBox" Text="{Binding ElementName=fontSizeSlider, Path=Value}" Grid.Row="2"/> <TextBlock Text="Example 01" FontFamily="{Binding ElementName=FontNameList, Path=Text}" FontSize="{Binding ElementName=SizeTextBox, Path=Text}" Grid.Row="3"/> </Grid> Example03 In this example we bind to an object Employee.cs Notice we added a directive to our xaml which is clr-namespace and the namespace for our employee Class xmlns:local="clr-namespace:Example03" In Our windows Resources we create an instance of our object <Window.Resources> <local:Employee x:Key="MyEmployee" EmployeeNumber="145" FirstName="John" LastName="Doe" Department="Product Development" Title="QA Manager" /> </Window.Resources> then we bind our container to the that instance of the data <Grid DataContext="{StaticResource MyEmployee}"> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions > <ColumnDefinition Width="130px" /> <ColumnDefinition Width="178*" /> </Grid.ColumnDefinitions> </Grid> and Finally we have textboxes that will bind to that textbox <Label Grid.Row="0" Grid.Column="0">Employee Number</Label> <TextBox Grid.Row="0" Grid.Column="1" Text="{Binding Path=EmployeeNumber}"></TextBox> <Label Grid.Row="1" Grid.Column="0">First Name</Label> <TextBox Grid.Row="1" Grid.Column="1" Text="{Binding Path=FirstName}"></TextBox> <Label Grid.Row="2" Grid.Column="0">Last Name</Label> <TextBox Grid.Row="2" Grid.Column="1" Text="{Binding Path=LastName}" /> <Label Grid.Row="3" Grid.Column="0">Title</Label> <TextBox Grid.Row="3" Grid.Column="1" Text="{Binding Path=Title}"></TextBox> <Label Grid.Row="4" Grid.Column="0">Department</Label> <TextBox Grid.Row="4" Grid.Column="1" Text="{Binding Path=Department}" />
