【桌面开发】WPF listview界面实时更新

一、前言

WPF listview界面实时更新，由浅入深，分别用到ObservableCollection、INotifyPropertyChanged、DataContext，替换Bean类，替换Bean类中的一个属性，替换存储整个Bean的集合框架。

二、ObservableCollection绑定，改变类

2.1 前端代码

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication2"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <StackPanel Height="295" HorizontalAlignment="Left" Margin="10,10,0,0" Name="stackPanel1" VerticalAlignment="Top" Width="427">
            <TextBlock Height="23" Name="textBlock1" Text="学员编号:" />
            <TextBox Height="23" Name="txtStudentId" Width="301" HorizontalAlignment="Left"/>
            <TextBlock Height="23" Name="textBlock2" Text="学员列表:" />
            <ListBox Height="156" Name="lbStudent" Width="305" HorizontalAlignment="Left">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Name="stackPanel2" Orientation="Horizontal">
                            <TextBlock  Text="{Binding Id,Mode=TwoWay}" Margin="5" Background="Beige"/>
                            <TextBlock Text="{Binding Name,Mode=TwoWay}" Margin="5"/>
                            <TextBlock  Text="{Binding Age,Mode=TwoWay}" Margin="5"/>
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
            <Button Content="Button" Height="23" Name="button1" Width="75" HorizontalAlignment="Left" Click="button1_Click" />
        </StackPanel>
    </Grid>
</Window>

2.2 cs代码

    public partial class MainWindow : Window
    {
        ObservableCollection<Students> infos = new ObservableCollection<Students>() {
            new Students(){ Id=1, Age=11, Name="Tom"},
            new Students(){ Id=2, Age=12, Name="Darren"},
            new Students(){ Id=3, Age=13, Name="Jacky"},
            new Students(){ Id=4, Age=14, Name="Andy"}
            };

        public MainWindow()
        {
            InitializeComponent();

            this.lbStudent.ItemsSource = infos;

            this.txtStudentId.SetBinding(TextBox.TextProperty, new Binding("SelectedItem.Id") { Source = lbStudent });
        }
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            infos[1] = new Students() { Id = 4, Age = 14, Name = "这是一个集合改变" };
            infos[2].Name = "这是一个属性改变";
        }

        public class Students
        {
            public int Id { get; set; }
            public string Name
            {
                get;set;
            }
            public int Age { get; set; }
        }
    }

2.3 运行结果

2.4 小结

对于ObservableCollection类操作的改变反应到了前端界面，但是对于其单一属性的改变没有反应到前端界面，要想改变其单一属性，需要在Students类（ObservableCollection的泛型类）上实现INotifyPropertyChanged接口。

三、INotifyPropertyChanged接口来助力，改变单一属性

3.1 前端代码

不变，和上面一样，略。

3.2 cs代码

    public partial class Window1 : Window
    {
        ObservableCollection<Students> infos = new ObservableCollection<Students>() {
            new Students(){ Id=1, Age=11, Name="Tom"},
            new Students(){ Id=2, Age=12, Name="Darren"},
            new Students(){ Id=3, Age=13, Name="Jacky"},
            new Students(){ Id=4, Age=14, Name="Andy"}
            };

        public Window1()
        {
            InitializeComponent();

            this.lbStudent.ItemsSource = infos;

            this.txtStudentId.SetBinding(TextBox.TextProperty, new Binding("SelectedItem.Id") { Source = lbStudent });
        }
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            infos[1] = new Students() { Id = 4, Age = 14, Name = "这是一个集合改变" };
            infos[2].Name = "这是一个属性改变";
        }

        public class Students : INotifyPropertyChanged
        {
            string _name;
            public int Id { get; set; }
            public string Name
            {
                get { return _name; }
                set
                {
                    _name = value; OnPropertyChanged("Name");
                }
            }

            protected internal virtual void OnPropertyChanged(string propertyName)
            {
                if (PropertyChanged != null)
                    PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
            public event PropertyChangedEventHandler PropertyChanged;

            public int Age { get; set; }
        }
    }

3.3 运行结果

3.4 小结

通过让Students类实现INotifyPropertyChanged接口，让前端可以显示其单一属性的改变。

四、DataContext设置上下文，直接换掉整个list的数据

4.1 前端代码

4.2 cs代码

4.3 运行结果

4.4 小结

通过让存储Students类的集合框架实现INotifyPropertyChanged接口，让前端可以显示整个数据的替换。

五、小结

WPF listview界面实时更新，cs代码改变，前端响应变化，完成了。

源工程代码：https://download.csdn.net/download/qq_36963950/12500813