Complex Data Binding

Binding Lists in WPF ,[object Object],[object Object],[object Object],[object Object],[object Object]

Table of Contents ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Table of Contents (2) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Complex Data Binding Binding to a Collection of Items

Complex B inding ,[object Object],// Create an alias for a generic type so that we // can create a list of Person objects in XAML class People : List<Person> { }  <local:People x:Key="Family"> <local:Person Name="Tom" Age="11" /> <local:Person Name="John" Age="12" /> <local:Person Name="Melissa" Age="38" /> </local:People>

Complex B inding (2) ,[object Object],[object Object],<Grid DataContext="{StaticResource Family}"> … <TextBlock …>Name:</TextBlock> <TextBox Text="{Binding Path=Name}" … /> <TextBox Text="{Binding Path=Age}" Foreground="{Binding Path=Age, Converter=…}" … />

Complex Data Binding Live Demo

Accessing the "Current Item"

Accessing the "Current Item" ,[object Object],[object Object]

Accessing the "Current Item" (3) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Accessing the "Current Item" (2) ,[object Object],public partial class MainWindow : Window { … private void birthdayButton_Click(object sender, RoutedEventArgs e) { People people = (People)this.FindResource("Family"); ICollectionView view = CollectionViewSource.GetDefaultView(people); Person person = (Person) view.CurrentItem ; ++person.Age; MessageBox.Show(person.Age.ToString()); } }

Navigating Between Items ,[object Object],[object Object],ICollectionView GetFamilyView() { People people =(People)this.FindResource("Family"); return CollectionViewSource.GetDefaultView(people); } private void buttonBack_Click(object sender, RoutedEventArgs e) { ICollectionView view = GetFamilyView(); view.MoveCurrentToPrevious(); if (view.IsCurrentBeforeFirst) view.MoveCurrentToFirst(); }

Navigating Between Items Live Demo

Binding List Controls DisplayMemberPath and SelectedValuePath

Binding List Controls ,[object Object],[object Object],[object Object],[object Object],[object Object]

DisplayMemberPath ,[object Object],[object Object],<ListBox ItemsSource="{Binding}" DisplayMemberPath="Name" IsSynchronizedWithCurrentItem="True" />

SelectedValuePath ,[object Object],[object Object],<ListBox Name="ListBoxPeople" ItemsSource="{Binding}" DisplayMemberPath="Name" SelectedValuePath="Age" /> private void ListBoxPeople_SelectionChanged( object sender, SelectionChangedEventArgs e) { int index = ListBoxPerson.SelectedIndex; if (index < 0) { return; } Person item = (Person) ListBoxPerson.SelectedItem; int value = (int) ListBoxPerson.SelectedValue; … }

DisplayMemberPath and SelectedValuePath Live Demo

Using Look-up Bindings ,[object Object],[object Object],public class NamedAge { public string NameForAge { get; set; } public int AgeId { get; set; } } class NamedAges : List<NamedAge> { }

Using Look-up Bindings (2) ,[object Object],[object Object],<local:NamedAges x:Key="NamedAgeLookup"> <local:NamedAge NameForAge="zero" AgeId="0" /> <local:NamedAge NameForAge="one" AgeId="1" /> </local:NamedAges> <ComboBox Name="ComboBoxNumbers" ItemsSource= "{Binding Source={StaticResource NamedAgeLookup}}" DisplayMemberPath="NameForAge" SelectedValuePath="AgeId" SelectedValue="{Binding Path=Age}" />

Using Look-up Bindings Live Demo

Using Data Templates ,[object Object],[object Object],[object Object],[object Object],[object Object]

Using Data Templates (2) ,[object Object],<ListBox ItemsSource="{Binding}"> <ListBox.ItemTemplate> <DataTemplate> <TextBlock> <TextBlock Text="{Binding Path=Name}" /> (age: <TextBlock Text="{Binding Path=Age}" Foreground="{Binding Path=Age, Converter={StaticResource ageConverter}}" />) </TextBlock> </DataTemplate> </ListBox.ItemTemplate> </ListBox>

Using Data Templates (2) ,[object Object],[object Object],[object Object]

Sorting Items ,[object Object],[object Object],[object Object],[object Object]

Sorting Items (2) ,[object Object],private void buttonSort_Click (object sender, RoutedEventArgs e) { ICollectionView view = GetFamilyView(); if (view.SortDescriptions.Count == 0) { view.SortDescriptions.Add( new SortDescription("Name", ListSortDirection.Ascending)); view.SortDescriptions.Add( new SortDescription("Age", ListSortDirection.Descending)); } else view.SortDescriptions.Clear(); }

Filtering ,[object Object],[object Object],[object Object],private void buttonFilter_Click(object sender, RoutedEventArgs e) { ICollectionView view = GetFamilyView(); // the example continues

Filtering (2) if (view.Filter == null) { view.Filter = delegate(object item) { return ((Person)item).Age >= 25; }; } else { view.Filter = null; } } // The result is:

Grouping ,[object Object],[object Object],[object Object],if (view.GroupDescriptions.Count == 0) { view.GroupDescriptions.Add( new PropertyGroupDescription("Age")); } else { view.GroupDescriptions.Clear(); }

Grouping (2) ,[object Object],[object Object],[object Object],[object Object],<ListBox … ItemsSource="{Binding}" > <ListBox.GroupStyle> <x:Static Member="GroupStyle.Default" /> </ListBox.GroupStyle> </ListBox>

Filtering and Grouping Live Demo

Declarative Sorting and Grouping

Declarative Sorting and Grouping ,[object Object],[object Object],[object Object],[object Object],xmlns:compModel="clr-namespace:System.ComponentModel; assembly=WindowsBase" xmlns:data="clr-namespace:System.Windows.Data;assembly= PresentationFramework">

Declarative Sorting and Grouping (2) <CollectionViewSource x:Key="SortedGroupedFamily" Source="{StaticResource Family}"> <CollectionViewSource.SortDescriptions> <compModel:SortDescription PropertyName="Name" Direction="Ascending" /> <compModel:SortDescription PropertyName="Age" Direction="Descending" /> </CollectionViewSource.SortDescriptions> <CollectionViewSource.GroupDescriptions> <data:PropertyGroupDescription PropertyName="Age" Converter="{StaticResource ageConverter}" /> <data:PropertyGroupDescription PropertyName="Age" /> </CollectionViewSource.GroupDescriptions> </CollectionViewSource>

Declarative Sorting and Grouping Live Demo

Object Data Provider ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Object Data Provider – Example ,[object Object],[object Object],public class Person : INotifyPropertyChanged { … } public class People : ObservableCollection<Person> {} public class RemotePeopleLoader { public People LoadPeople() { // Load people from somewhere People people = new People( ); … return people; } … }

Object Data Provider – Example (2) ,[object Object],[object Object],[object Object],<Window.Resources> ... <ObjectDataProvider x:Key="Family" ObjectType="{x:Type local:RemotePeopleLoader}" MethodName="LoadPeople" /> </Window.Resources>

Binding to Relational Data ,[object Object],[object Object],[object Object],[object Object],DataClassesPeopleDataContext dataContextPeople = new DataClassesPeopleDataContext();

Binding to Relational Data (2) ,[object Object],<Window.Resources> <DataTemplate x:Key="DataTemplatePersonName"> <TextBlock Text="{Binding Path=PersonName}"/> </DataTemplate> </Window.Resources> ... <ListBox Name="ListBoxPeople" ItemTemplate= "{StaticResource DataTemplatePersonName }"/>

Binding to Relational Data (3) ,[object Object],[object Object],People newPerson = new People(); newPerson.PersonName = TextBoxAdd.Text; dataContexPeople.Peoples.InsertOnSubmit(newPerson); dataContexPeople.SubmitChanges();

Binding to Relational Data Live Demo

XML Data Source Provider ,[object Object],[object Object],<Window.Resources> <XmlDataProvider x:Key="Family" Source="family.xml" XPath="/sb:Family/sb:Person"> <XmlDataProvider.XmlNamespaceManager> <XmlNamespaceMappingCollection> <XmlNamespaceMapping Prefix="sb" Uri="http://sellsbrothers.com" /> </XmlNamespaceMappingCollection> </XmlDataProvider.XmlNamespaceManager> </XmlDataProvider>

XML Data Source Provider (2) ,[object Object],[object Object],… <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding XPath=@Name}" /> <TextBlock Text=" (age: " /> <TextBlock Text="{Binding XPath=@Age}" Foreground="{Binding XPath=@Age, Converter= {StaticResource ageConverter}}" /> <TextBlock Text=")" /> </StackPanel> …

XML Data Source Provider (3) ,[object Object],[object Object],[object Object],void birthdayButton_Click(object sender, RoutedEventArgs e) { ICollectionView view = GetFamilyView( ); XmlElement person = (XmlElement)view.CurrentItem; // the example continues

XML Data Source Provider (4) person.SetAttribute("Age", (int.Parse( person.Attributes["Age"].Value) + 1).ToString( )); MessageBox.Show( string.Format("Happy Birthday, {0}, age {1}!", person.Attributes["Name"].Value, person.Attributes["Age"].Value), "Birthday"); } … void groupButton_Click(object sender, RoutedEventArgs e) { ICollectionView view = GetFamilyView( ); if( view.GroupDescriptions.Count == 0 ) { view.GroupDescriptions.Add(new PropertyGroupDescription("@Age")); } else { view.GroupDescriptions.Clear(); } }

XML Data Source Provider Live Demo

Master-Details Binding ,[object Object],[object Object],[object Object],[object Object],[object Object]

Master-Details Binding (2) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Master-Details Binding – Example ,[object Object],<Window.Resources> <local:Families x:Key="Families"> <local:Family FamilyName="Piyandetata"> <local:Family.Members> <local:People> <local:Person Name="Joro Vodkata" Age="21" /> … </local:People> </local:Family.Members> </local:Family> <local:Family FamilyName="Addams"> <local:Family.Members> <local:People> <local:Person Name="Uncle Fester" Age="135" /> … </local:Families> </Window.Resources>

Master-Details Binding – Example (2) ,[object Object],<Window.Resources> <local:Families x:Key="Families">…</local:Families> </Window.Resources> <Grid DataContext="{StaticResource Families}"> …  <TextBlock Grid.Row="0" Grid.Column="0">Families:</TextBlock> <ListBox Grid.Row="1" Grid.Column="0" IsSynchronizedWithCurrentItem="True" ItemsSource="{Binding}"> <ListBox.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding Path=FamilyName}" /> </DataTemplate> </ListBox.ItemTemplate> </ListBox>

Master-Details Binding – Example (3) ,[object Object],<Grid DataContext="{StaticResource Families}"> ... …  <StackPanel Grid.Row="0" Grid.Column="1" Orientation="Horizontal"> <TextBlock Text="{Binding Path=FamilyName}" /> <TextBlock Text=" Family Members:" /> </StackPanel> <ListBox Grid.Row="1" Grid.Column="1" IsSynchronizedWithCurrentItem="True" ItemsSource="{Binding Path=Members}" > <ListBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding Path=Name}" /> <TextBlock Text=" (age: " /> <TextBlock Text="{Binding Path=Age}" /> <TextBlock Text=" )" /> …

Master-Details Binding Live Demo

Hierarchical Binding ,[object Object],[object Object],[object Object],[object Object],[object Object]

Hierarchical Binding (2) ,[object Object],[object Object],<DataTemplate DataType="{x:Type local:Family}"> <TextBlock Text="{Binding Path=FamilyName}" /> </DataTemplate> </Window.Resources> … <TreeView DataContext="{StaticResource Families}"> <TreeViewItem ItemsSource="{Binding}" Header="Families" /> </TreeView>

Hierarchical Binding (3) ,[object Object],[object Object],<HierarchicalDataTemplate DataType="{x:Type local:Family}" ItemsSource="{Binding Path=Members}"> <TextBlock Text="{Binding Path=FamilyName}" /> </HierarchicalDataTemplate> <HierarchicalDataTemplate DataType="{x:Type local:Person}" ItemsSource="{Binding Path=Traits}"> <TextBlock> <TextBlock Text="{Binding Path=Name}" /> (age: <TextBlock Text="{Binding Path=Age}" />) </TextBlock> </HierarchicalDataTemplate>

Binding Lists ,[object Object],http://academy.telerik.com

Exercises ,[object Object],[object Object]

Exercises (2) ,[object Object],Design a form to view products by ID and bind all controls to their relevant columns from the database tables.

Exercises (3) ,[object Object],[object Object]

Complex Data Binding

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (13)

Similar to Complex Data Binding

Similar to Complex Data Binding (20)

More from Doncho Minkov

More from Doncho Minkov (18)

Recently uploaded

Recently uploaded (20)

Complex Data Binding

Editor's Notes