跟着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;}}