一、用户控件介绍
定义：
- 用户控件是由一组现有的WPF控件组成，并在一个XAML文件中定义的可重用的控件。
- 它可以包含多个控件、布局和行为，形成一个独立的、可在应用程序中多次使用的模块。
特点：
- 可重用性：用户控件的设计目的是提高代码的重用性，使得界面元素的组合和布局能够在应用程序中重复利用。
- 模块化：通过将界面划分为多个独立的用户控件，可以实现更好的模块化设计，有助于代码的维护和管理。
- 易于扩展：用户控件可以根据需要轻松地进行扩展，包括添加新的控件、更改布局或修改逻辑等。
二、效果展示
通过数据绑定添加相关的逻辑，实现能量条的动态显示。
三、实现过程
1.创建用户控件
根据下图在项目中创建用户控件
2.编辑用户控件
在用户控件的Xaml文件中编辑添加所需要的元素
<StackPanel Orientation="Vertical"><ProgressBar Orientation="Vertical" Maximum="{Binding Max}" Minimum="0" Value="{Binding Value}" Height="300" Width="100"/>
</StackPanel>3.把用户控件放入主窗口
在用户控件编辑完成后，注意需要对项目进行重新生成，然后打开工具箱，就可将用户控件拖入主窗口
<Grid Background="White"><local:UserControl1 HorizontalAlignment="Left" Margin="300,60,0,0" VerticalAlignment="Top" DataContext="{Binding Page4Model.Count[0]}"/>
</Grid>4.在model中创建数据类型数据
public class Page4Model : NotifyBase{private Dictionary<int, Detail> _count = new Dictionary<int, Detail>();public Dictionary<int, Detail> Count{get { return _count; }set { _count = value; OnPropertyChanged(nameof(Count)); }}}public class Detail : NotifyBase{private int value;public int Value { get => value; set {this.value = value; OnPropertyChanged(nameof(value));}}private int max;public int Max { get => max; set {max = value; OnPropertyChanged(nameof(Max)); } }}你如果没有INotifyPropertyChanged接口，可以用这个
public class NotifyBase:INotifyPropertyChanged{//数值更改进行界面的同时public event PropertyChangedEventHandler? PropertyChanged;public void OnPropertyChanged(string propertyName){if (PropertyChanged != null){PropertyChanged(this, new PropertyChangedEventArgs(propertyName));}}}5.创建ViewModel，对数据进行赋值更新
public class Page4ViewModel
{ public Page4Model Page4Model { get; set; } = new Page4Model();bool a=false;public Page4ViewModel() {Page4Model.Count.Add(0,new Detail() {Max=100, Value=0 });Task.Run(async () =>{while (true){await Task.Delay(500);if (a){Page4Model.Count[0].Value++;if (Page4Model.Count[0].Value > 99) { a= false; }}else { Page4Model.Count[0].Value--;if (Page4Model.Count[0].Value < 1) { a = true; }}//因为Conut是个字典 是属于引用类型 更改引用类型，则需要new 盏内存是不会改变到的Page4Model.Count = new Dictionary<int, Detail>(Page4Model.Count);}});}}最后不要忘记在xaml.cs调用Viewmodel
