5.4.2 MVVM例2-用户控件的使用（水在水管中流动的实例）

        本文以一个例子介绍用户控件的使用(UserControl)，下图所示：       

一、主要技术点

        1.MainViewModel使用CommunityToolkit.Mvvm 这个Nuget包

        2.LinearGradientBrush使用，下面代码可以产生如下的效果

           <LinearGradientBrush x:Key="HorizontalBackground"
                      StartPoint="0.5 0" EndPoint="0.5 1">
                     <GradientStop Color="SkyBlue" Offset="0.1"/>
                    <GradientStop Color="Transparent" Offset="0.1"/>
                     <GradientStop Color="Transparent" Offset="0.9"/>
                     <GradientStop Color="SkyBlue" Offset="0.9"/>
           </LinearGradientBrush>

        3.类的代码使用对应的xaml中资源可以直接这样使用：

privateLinearGradientBrush HorizontalBackground => (LinearGradientBrush)Resources["HorizontalBackground"];

 4.依赖属性如果不变化，就不会自动调用其回调函数，

   如果需要窗口打开后需要自动调用下某属性的回调函数以完成初始化，可以自己写代码调用。

       public PipeLine(){InitializeComponent();Loaded += PipeLine_Loaded;}private void PipeLine_Loaded(object sender, RoutedEventArgs e){OnDirectionChanged(this, new DependencyPropertyChangedEventArgs(DirectionProperty, Orientation.Horizontal, Orientation.Horizontal));}

5.Line的虚线产生

        StrokeDashArray可以产生虚线。

    StrokeDashOffset 的变化可以产生动画效果。

    <Line Width="200" Height="50" Stroke="Red" StrokeThickness="10"  X1="0" Y1="0"X2="200" Y2="0" Margin="0 20"              StrokeDashArray="1 2"/>

6.动画效果，通过StrokeDashOffset 产生动画效果。 使用基于帧的动画。

        构建基于帧的动画的基本技术很容易。只需要为静态的CompositionTarget.Rendering事件关联事件处理程序。一旦关联事件处理程序，WPF就开始不断地调用这个事件处理程序(只要渲染代码的执行速度足够快，WPF每秒将调用60次)。

        因为这个是UI中的事件，通过调用viewModel中的函数来实现虚线的移动。

       注意：StrokeDashOffset减少视觉效果是水平方向向右移动。

 public MainWindow()
 {
     InitializeComponent();
     this.DataContext = new MainViewModel(this);
     CompositionTarget.Rendering += OnRendering;
 }
 private void OnRendering(object sender, EventArgs e)
 {
     // 将事件转发到 ViewModel