WPF实时时间显示demo(MVVM)

跟着b站的视频学习做一个界面,它里面的时间不能实时刷新,因此自己研究写一个,同时加深一下自己对MVVM的理解.

运行结果:

实现步骤:

1.界面

界面设计就是放置了一个TextBlock,它的text绑定了ViewModel层里面的公告属性CurrentTime.

复制代码
<Grid>
        <TextBlock Text="{Binding CurrentTime}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24"></TextBlock>
    </Grid>

2.ViewModel层构建

新建了一个TimeViewModel.cs的文件

在这个文件中,我首先让文件继承了INotifyPropertyChanged类,随机实现接口用于发放改变通知.然后我定义私有字段_currentTime和公有属性CurrtTime(与前端界面绑定的属性),在其set中设置监听,当属性改变时触发 PropertyChanged 事件,通知界面进行改变.之后,进行定时器的配置,在构造函数之中进行配置,设置为1s一变,并且将Time_Tick添加为Tric时间处理程序,Time_Trick里面绑定的是时间更新函数,至此实现整个流程成功.

复制代码
 /// <summary>
    /// 管理时间和通知UI更新
    /// </summary>
    class TimeViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        private string _currentTime;
        private DispatcherTimer _timer;

        //构造函数
        public TimeViewModel()
        {
            _timer = new DispatcherTimer();
            _timer.Interval = TimeSpan.FromSeconds(1);//更新频率设为每秒
            _timer.Tick += Time_Tick;
            _timer.Start();
            /*
             *从这一刻开始,_timer 开始计数。
             *每当 _timer 的时间间隔(1秒)到达时,它都会触发 Tick 事件。
             *由于 Timer_Tick 方法被添加为 Tick 事件的事件处理程序,因此每次 Tick 事件被触发时,Timer_Tick 方法都会被调用。
             *在 Timer_Tick 方法内部,调用了 UpdateTime 方法来更新 _currentTime 字段,
             *并由于 _currentTime 字段的 set 访问器内部调用了 OnPropertyChanged 方法,
             *这会导致 PropertyChanged 事件被触发,
             *通知任何监听这个事件的UI组件或其他对象,CurrentTime 属性的值已经改变。
             */

            updateTime();//初始化
        }

        private void Time_Tick(object sender, EventArgs e)
        {
            updateTime();
        }

        private void updateTime()
        {
            CurrentTime = DateTime.Now.ToString("HH:mm:ss");
        }

        public string CurrentTime
        {
            get { return _currentTime; }
            set {
                _currentTime = value;
                OnPropertyChanged(nameof(CurrentTime));
            }
        }

        private void OnPropertyChanged(string v)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this,new PropertyChangedEventArgs(v));
            }
        }

       
    }

3.实例化TimeViewModel,并且设计数据上下文,让界面和ViewModel层完成最后的绑定

复制代码
    public partial class MainWindow : Window
    {
        private TimeViewModel _viewModel;
        public MainWindow()
        {
            InitializeComponent();
            _viewModel = new TimeViewModel();
            this.DataContext = _viewModel;
        }
    }
相关推荐
快来卷java1 小时前
JVM虚拟机篇(五):深入理解Java类加载器与类加载机制
java·jvm·mysql
禾小西3 小时前
Java 逐梦力扣之旅_[204. 计数质数]
java·算法·leetcode
ゞ 正在缓冲99%…3 小时前
leetcode295.数据流的中位数
java·数据结构·算法·leetcode·
xy_optics4 小时前
用matlab探索卷积神经网络(Convolutional Neural Networks)-3
开发语言·matlab·cnn
有梦想的攻城狮4 小时前
spring-cloud-alibaba-nacos-config使用说明
java·spring·nacos·springcloud·配置中心
独好紫罗兰4 小时前
洛谷题单3-P1720 月落乌啼算钱(斐波那契数列)-python-流程图重构
开发语言·算法·leetcode
慕容莞青6 小时前
MATLAB语言的进程管理
开发语言·后端·golang
Yan-英杰6 小时前
【百日精通JAVA | SQL篇 | 第三篇】 MYSQL增删改查
java·数据库·sql
jimin_callon6 小时前
VBA第三十八期 VBA自贡分把表格图表生成PPT
开发语言·python·powerpoint·编程·vba·deepseek
矛取矛求7 小时前
C++ 标准库参考手册深度解析
java·开发语言·c++