WPF Learning 09: Binding Binding to List data

Learning 03:element binding from WPF we can implement the binding of a control property to a control property.

Learning 07:MVVM data binding from WPF we can implement binding of control properties to custom object properties.

While the above two functions are not enough in practical applications, we often need to bind the list data to the control properties.

Example

ListBox switch characters, following two text boxes follow the switch, very common functions.

XAML Code:

<Windowx:class= "Datatemplate.mainwindow"xmlns= "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml"Title= "MainWindow"Height= " the"Width= "525">    <StackPanel>        <ListBoxIsSynchronizedWithCurrentItem= "True"ItemsSource="{Binding}"DisplayMemberPath= "Name"/>        <StackPanelHorizontalAlignment= "Center"Orientation= "Horizontal">            <TextBlockText= "Gender:"></TextBlock>            <TextBlockText="{Binding Gender}"Margin= "0 0 0"></TextBlock>            <TextBlockText= "Age:"></TextBlock>            <TextBlockText="{Binding Age}"Margin= "0 0 0"></TextBlock>        </StackPanel>    </StackPanel></Window>

Background code:

 Public classperson:inotifypropertychanged{ Public EventPropertyChangedEventHandler propertychanged; Private voidNotify (String PropertyName) {if(PropertyChanged! =NULL) Propertychanged.invoke ( This,NewPropertyChangedEventArgs (PropertyName)); }    PrivateInt32 age;  PublicInt32 Age {Get{returnAge ;} Set{ Age=value; Notify (" Age"); }    }    PrivateString Gender;  PublicString Gender {Get{returngender;} Set{Gender=value; Notify ("Gender"); }    }    PrivateString name;  PublicString Name {Get{returnname;} Set{Name=value; Notify ("Name"); }    }}classPeople:list<person>{     Publicpeople () { This. ADD (NewPerson () {Name ="John", age = -, Gender ="Male" });  This. ADD (NewPerson () {Name ="Jake", age = -, Gender ="Male" });  This. ADD (NewPerson () {Name ="Kate", age = -, Gender ="Female" }); }} PublicMainWindow () {InitializeComponent (); DataContext=Newpeople ();}

Collection View

Make some changes to the example:

Just changed the XAML. Deleted the original ListBox, added a TextBlock with two buttons

<StackPanelHorizontalAlignment= "Center"Orientation= "Horizontal">    <TextBlockText= "Name:"></TextBlock>    <TextBlockText="{Binding Name}"Margin= "0 0 0"></TextBlock>    <TextBlockText= "Gender:"></TextBlock>    <TextBlockText="{Binding Gender}"Margin= "0 0 0"></TextBlock>    <TextBlockText= "Age:"></TextBlock>    <TextBlockText="{Binding Age}"></TextBlock></StackPanel>

The path to the data binding setting is Name Gender age and the current data context is a list. When this occurs, WPF attempts to view the current Item of the data list as the binding source. Thus having the effect on the picture.

With the Getdefaultview method provided by CollectionViewSource we can get a list view, and the list view allows us to include but not limit the operation of changing the current item to the list.

We can add handler to two buttons to switch the function of a character:

Private voidBtntoright_click (Objectsender, RoutedEventArgs e) {    varView =Collectionviewsource.getdefaultview (DataContext); View.    Movecurrenttonext (); //Out of bounds, back    if(view. Iscurrentafterlast) view. Movecurrenttoprevious ();}Private voidBtntoleft_click (Objectsender, RoutedEventArgs e) {    varView =Collectionviewsource.getdefaultview (DataContext); View.    Movecurrenttoprevious (); //Out of bounds, back    if(view. Iscurrentbeforefirst) view. Movecurrenttonext ();}

After we get the list view, we can also filter, sort, and so on the list of data.  The example is omitted here. IsSynchronizedWithCurrentItem

Go back to the first example of the article. There are two reasons why you can switch between two text box contents by clicking an element in Listvox:

1. Their data binding, the source is the same (current data context).

2. Configure IsSynchronizedWithCurrentItem to Ture.

This allows the ListControl to automatically toggle the CurrentItem of the current binding list when the SelectedItem is switched.

DataTemplate Introduction

Because the data template is too many things to say at once, let's give an example of a data template here.

With the data template, we are free to define what the data is displayed.

Continue to modify the example at the beginning of this article. The first step is to remove the element's DisplayMemberPath property, which specifies which property of the bound object is the display binding object for item. Conflict with the data template function.

Effects after the change:

The modified XAML code:

<Windowx:class= "Datatemplate.mainwindow"xmlns= "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml"Title= "MainWindow"Height= " the"Width= "525">    <ListBoxIsSynchronizedWithCurrentItem= "True"ItemsSource="{Binding}">        <listbox.itemtemplate>            <DataTemplate>                <StackPanelHorizontalAlignment= "Center"Orientation= "Horizontal">                    <TextBlockText= "Name:"></TextBlock>                    <TextBlockText="{Binding Name}"Margin= "0 0 0"></TextBlock>                    <TextBlockText= "Gender:"></TextBlock>                    <TextBlockText="{Binding Gender}"Margin= "0 0 0"></TextBlock>                    <TextBlockText= "Age:"></TextBlock>                    <TextBlockText="{Binding Age}"></TextBlock>                </StackPanel>            </DataTemplate>        </listbox.itemtemplate>    </ListBox></Window>

WPF Learning 09: Binding Binding to List data