#395 – 通过数据绑定丰富ListBox 的内容(Rich ListBox Content using Data Binding)

2016-11-09 22:42:53来源:CSDN作者:Libby1984人点击

第七城市

在上一篇讲述SnapsToDevicePixels 属性的文章中,我们使用了一个ListBox 的例子列出了很多电影。里面每一个条目都有包括缩略图在内的若干个数据项组成。

下面我们看一下如何在WPF中建立这样一个项目。首先,我们需要一个Move类来存储每个电影的信息。我们将用数据绑定绑定一个这个类的实例,我们也想在数据发送改变的时候绑定能够更新,所以我们继承INotifyPropertyChanged 接口。

    public class Movie : INotifyPropertyChanged    {        private string title;        public string Title        {            get { return title; }            set            {                if (value != title)                {                    title = value;                    OnPropertyChanged("Title");                }            }        }        public int year;        public int Year        {            get { return year; }            set            {                if (value != year)                {                    year = value;                    OnPropertyChanged("Year");                }            }        }        private Uri image;        public Uri Image        {            get { return image; }            set            {                if (value != image)                {                    image = value;                    OnPropertyChanged("Image");                }            }        }        private string actorLead;        public string ActorLead        {            get { return actorLead; }            set            {                if (value != actorLead)                {                    actorLead = value;                    OnPropertyChanged("ActorLead");                }            }        }        private string actressLead;        public string ActressLead        {            get { return actressLead; }            set            {                if (value != actressLead)                {                    actressLead = value;                    OnPropertyChanged("ActressLead");                }            }        }        private string director;        public string Director        {            get { return director; }            set            {                if (value != director)                {                    director = value;                    OnPropertyChanged("Director");                }            }        }        public event PropertyChangedEventHandler PropertyChanged = delegate { };        private void OnPropertyChanged(string prop)        {            PropertyChanged(this, new PropertyChangedEventArgs(prop));        }        public Movie(string title, int year, Uri image, string actorLead, string actressLead, string director)        {            Title = title;            Year = year;            Image = image;            ActorLead = actorLead;            ActressLead = actressLead;            Director = director;        }    }

下一步我们创建Movie 类的实例,并将它们加入我们要用来绑定的列表中。创建一个包含有电影列表的属性:

public ObservableCollection<Movie> MovieList { get; protected set; }

之后我们在主窗口中添加代码设置数据上下文,将数据和界面显示绑定。

在构造函数中添加代码如下:

public MainWindow(){    this.InitializeComponent();     // Set data context of main window to itself, allowing to bind    // elements in the GUI to properties in the code-behind.    this.DataContext = this;     // Populate movie list    MovieList = new ObservableCollection<Movie>();    MovieList.Add(new Movie("King Kong", 1933, new Uri(@"../Images/KingKong-1933.png", UriKind.Relative), "Bruce Cabot", "Fay Wray", "Merian C. Cooper"));    MovieList.Add(new Movie("The Gay Divorcee", 1934, new Uri(@"../Images/GayDiv-1934.png", UriKind.Relative), "Fred Astaire", "Ginger Rogers", "Mark Sandrich"));    MovieList.Add(new Movie("Captain Blood", 1935, new Uri(@"../Images/CptBlood-1935.png", UriKind.Relative), "Errol Flynn", "Olivia de Havilland", "Michael Curtiz"));    MovieList.Add(new Movie("Modern Times", 1936, new Uri(@"../Images/ModTimes-1936.png", UriKind.Relative), "Charlie Chaplin", "Paulette Goddard", "Charlie Chaplin"));    MovieList.Add(new Movie("Topper", 1937, new Uri(@"../Images/Topper-1937.png", UriKind.Relative), "Cary Grant", "Constance Bennett", "Norman Z. McLeod"));    OnPropertyChanged("MovieList");}

最后在XAML中定义一个ListBox 用来显示所有电影信息。设置这个ListBoxItemTemplate 属性为我们定义好的DataTemplate 。然后使用数据绑定将模板和Movie 类的数据绑定。

<ListBox ItemsSource="{Binding MovieList}" SnapsToDevicePixels="True">    <ListBox.ItemTemplate>        <DataTemplate>            <StackPanel Orientation="Horizontal">                <Image Source="{Binding Image}"/>                <StackPanel Orientation="Vertical">                    <Label Content="{Binding Title}" FontWeight="Bold"/>                    <Label Content="{Binding Year}"/>                </StackPanel>                 <Border BorderBrush="Black" BorderThickness="0.5"/>                 <StackPanel Orientation="Vertical">                    <Label Content="Actors:"/>                    <Label Content="{Binding ActorLead}" Margin="10,0"/>                    <Label Content="{Binding ActressLead}" Margin="10,0"/>                </StackPanel>                 <Border BorderBrush="Black" BorderThickness="0.5"/>                 <StackPanel Orientation="Vertical">                    <Label Content="Director:"/>                    <Label Content="{Binding Director}" Margin="10,0"/>                </StackPanel>            </StackPanel>        </DataTemplate>    </ListBox.ItemTemplate></ListBox>

原文地址:https://wpf.2000things.com/2011/09/27/395-rich-listbox-content-using-data-binding-part-i/


第七城市

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台