ListView示例（二） - (十九)

【勘误】

       博客园原文中实际上是使用了EntityFramework去操作了数据库，将数据库中的数据读取出来并进行页面显示，但是在原文中并没有提起数据库相关的操作说明，导致博客园原文中的代码并不完整，这里我推荐大家按站长的方法自己建个数据库，这里站长自己用的是MySql用来练习，MySql在一些操作上会比SqlServer方便。

       数据表的具体操作和建立可以参考如下教程:

      《C#环境下使用EF操作MySql 》：/Course?Id=4§ion=2

       由于我采用的是.net 4.7.2框架，所以安装的是MySql.EntityFrameworkCore 3.1.10版本的库，我的视频中也是安装的这个版本，版本太高会出现不兼容问题。如下：

第四步、WPF后台逻辑代码编写

       安装好MySql数据库操作所必要的第三方库之后。在“Refresh”按钮的方法中进行数据绑定。操作步骤如下：

       1）在“Refresh”按钮上使用鼠标右键，单击，会弹出“属性”窗口。在“属性”窗口中点击右上角的闪电图标按钮，会出现事件窗口。在Click事件的文本框中进行双击，就会把按钮的Click事件添加到后台代码中。

       2）具体代码如下：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using WpfApp.MySql;

namespace WpfApp
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        MyDbContext MyDb = new MyDbContext();
        public MainWindow()
        {
            InitializeComponent();
            InitMySql();
        }

        /// <summary>
        /// 初始化数据库
        /// </summary>
        private void InitMySql()
        {
            MyDb.Database.EnsureCreated();

            // 新建的数据库没有数据，这里添加一些
            if(MyDb.S_City.Count() == 0)
            {
                MyDbContext db = new MyDbContext();
                for (int i = 0; i< 10;i++)
                {
                    d_City d = new d_City();
                    d.CityName = $"AAA{i}";
                    d.ZipCode = $"100{i}";
                    d.ProvinceID = i;
                    d.DateCreated = DateTime.Now;
                    d.DateUpdated = DateTime.Now.AddDays(i);
                    db.S_City.Add(d);
                    db.SaveChanges();
                }
                db.Dispose();
            }
        }

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            GetData();
        }
        protected void GetData()
        {
            List<d_City> list = MyDb.S_City.ToList();
            listView1.ItemsSource = list;
        }
    }
}

数据库表对象实体类，代码如下：

数据库表的建立请参考，这里不具体讲了：

《C#环境下使用EF操作MySql 》：/Course?Id=4§ion=2

using System;
using System.ComponentModel.DataAnnotations;

namespace WpfApp.MySql
{
    public class d_City
    {
        [Key]
        public long CityID { get; set; }
        public string CityName { get; set; }
        public string ZipCode { get; set; }
        public long ProvinceID { get; set; }
        public DateTime DateCreated { get; set; }
        public DateTime DateUpdated { get; set; }
    }
}

第五步、WPF前台界面与后台数据的Binding

        写完了上面的代码之后，按F5，程序运行了起来，点“Refresh”按钮却没有任何数据显示。这是由于后台数据与前面界面没有进行“绑定”，所以无法显示数据，接下来跟着我做。

        1）给GridViewColumn指明当前列对应于数据源的哪一项，可以通过DisplayMemberBinding属性来实现。其中Path后面的值便是上一步中所写的类d_City中指明属性名称。具体代码如下：

<ListView Name="listView1" MinWidth="280">
    <ListView.View>
        <GridView x:Name="gridView1">
            <GridViewColumn Header="CityID" DisplayMemberBinding="{Binding Path=CityID}"></GridViewColumn>
            <GridViewColumn Header="CityName" DisplayMemberBinding="{Binding Path=CityName}"></GridViewColumn>
            <GridViewColumn Header="ZipCode" DisplayMemberBinding="{Binding Path=ZipCode}"></GridViewColumn>
            <GridViewColumn Header="ProvinceID" DisplayMemberBinding="{Binding Path=ProvinceID}"></GridViewColumn>
            <GridViewColumn Header="DateCreated" DisplayMemberBinding="{Binding Path=DateCreated}"></GridViewColumn>
            <GridViewColumn Header="DateUpdated" DisplayMemberBinding="{Binding Path=DateUpdated}"></GridViewColumn>
        </GridView>
    </ListView.View>
</ListView>

        2）在Visual Studio 2019中按F5运行WPF程序，在程序运行起来之后，鼠标左键点击“刷新”按钮。你就可以看到如下图这样的画面了。

        3）当我们使用鼠标左键点击ListView中的记录时，里面的城市信息并没有同步映射到下面的文本框中。这个功能应该如何实现呢？。

        3）首先在WrapPanel元素中指明一个公共的上下文，可以通过增加属性 DataContext="{Binding ElementName=listView1,Path=SelectedItem}来实现。

        5）其次，对于需要显示相应信息的文本框，需要通过绑定TextBox元素中的Text属性实现，实现代码如下：

<WrapPanel Grid.Row="1" Orientation="Horizontal" DataContext="{Binding ElementName=listView1,Path=SelectedItem}">
    <StackPanel Orientation="Horizontal" Margin="5,2,5,2">
        <TextBlock Name="textBlock_CityID" Text="CityID:" />
        <TextBox Name="textBox_CityID" MinWidth="100" Text="{Binding CityID}" />
    </StackPanel>
    <StackPanel Orientation="Horizontal" Margin="5,2,5,2">
        <TextBlock Name="textBlock_CityName" Text="CityName:" />
        <TextBox Name="textBox_CityName" MinWidth="100" Text="{Binding CityName}" />
    </StackPanel>
    <StackPanel Orientation="Horizontal" Margin="5,2,5,2">
        <TextBlock Name="textBlock_ZipCode" Text="ZipCode:" />
        <TextBox Name="textBox_ZipCode" MinWidth="100" Text="{Binding ZipCode}" />
    </StackPanel>
    <StackPanel Orientation="Horizontal" Margin="5,2,5,2">
        <TextBlock Name="textBlock_ProvinceID" Text="ProvinceID:" />
        <TextBox Name="textBox_ProvinceID" MinWidth="100" Text="{Binding ProvinceID}"  />
    </StackPanel>
    <StackPanel Orientation="Horizontal" Margin="5,2,5,2">
        <TextBlock Name="textBlock_DateCreated" Text="DateCreated:" />
        <TextBox Name="textBox_DateCreated" MinWidth="100" Text="{Binding DateCreated}"  />
    </StackPanel>
    <StackPanel Orientation="Horizontal" Margin="5,2,5,2">
        <TextBlock Name="textBlock_DateUpdated" Text="DateUpdated:" />
        <TextBox Name="textBox_DateUpdated" MinWidth="100" Text="{Binding DateUpdated}" />
    </StackPanel>
</WrapPanel>

        在Visual Studio 2019中按F5运行WPF程序，在程序运行起来之后，鼠标左键点击“Refresh”按钮。在出现数据之后，使用鼠标左键点击ListView中的记录，你会发现文本框与ListView实现了联动。如下图。

第六步、数据更新 

        1）在原来只放一个按钮的地方，需要要多放一个按钮，如果只是简单的放一个按钮，就会如下图，所示，两个按钮重叠在一起。

        2）我们需要在XAML窗口中加个一个面板窗口。代码如下。

<WrapPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right">
    <Button Grid.Row="2" HorizontalAlignment="Right" Name="button1" Height="22" VerticalAlignment="Top" Width="65" Click="button1_Click">Refresh</Button>
    <Button Grid.Row="3" HorizontalAlignment="Right" Name="button2" Height="22" VerticalAlignment="Top" Width="65" >更新</Button>
</WrapPanel>

        3）给按钮button2添加一个Click事件，在Click事件中实现更新代码。代码如下。

private void button2_Click(object sender, RoutedEventArgs e)
{
    long id = long.Parse(textBox_CityID.Text);
    var city = MyDb.S_City.Where(c => c.CityID == id).OrderBy(c => c.CityID).FirstOrDefault();
    city.CityID = id;
    city.CityName = textBox_CityName.Text;
    city.DateCreated = DateTime.Parse(textBox_DateCreated.Text);
    city.DateUpdated = DateTime.Parse(textBox_DateUpdated.Text);
    city.ProvinceID = long.Parse(textBox_ProvinceID.Text);
    city.ZipCode = textBox_ZipCode.Text;
    MyDb.SaveChanges();
}

        4）选中一条记录，然后进行修改，更改之后，点击“更新”按钮。就可以把数据保存到数据库了，我们查询一下数据库，看一下数据是否已经更新到数据库里面了。

源码下载：

Wpf学习（ListView示例源码）.zip