如何使用Action.Invoke()觸發一個Storyboard

    通常在咱們的項目中，最好是將Storyboard放在前臺，而後設置Storyboard的x:key值，經過咱們的TryFindResource來查找到當前的Storyboard來啓動Stroyboard,這樣程序顯得比較合理，另外在咱們的下面這個例子中，咱們經過命令綁定的方式來將2個Storyboard綁定到兩個Button上面，當咱們點擊這兩個Storyboard的時候，咱們會啓動相應的動畫，首先來看一下前臺設計的xaml代碼。

<Window x:Class="ActionInvoke.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/ActionInvoke;component/Themes/Colors.xaml"></ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
            <Storyboard x:Key="ChangeColor" FillBehavior="Stop">
                <ColorAnimation  Storyboard.TargetName="ColorEllipseBrush" Storyboard.TargetProperty="Color"  To="Red" Duration="0:0:1">
                    <ColorAnimation.EasingFunction>
                        <CircleEase EasingMode="EaseIn"></CircleEase>
                    </ColorAnimation.EasingFunction>
                </ColorAnimation>                
            </Storyboard>
            <Storyboard x:Key="ChangeSize" FillBehavior="Stop">
                <DoubleAnimation Storyboard.TargetName="SizeEllipse" Storyboard.TargetProperty="Width" Duration="0:0:1" To="220">
                    <DoubleAnimation.EasingFunction>
                        <CircleEase EasingMode="EaseIn"></CircleEase>
                    </DoubleAnimation.EasingFunction>
                </DoubleAnimation>
                <DoubleAnimation Storyboard.TargetName="SizeEllipse" Storyboard.TargetProperty="Height" Duration="0:0:1" To="220">
                    <DoubleAnimation.EasingFunction>
                        <CircleEase EasingMode="EaseIn"></CircleEase>
                    </DoubleAnimation.EasingFunction>
                </DoubleAnimation>
            </Storyboard> 
        </ResourceDictionary>        
    </Window.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="10*"></RowDefinition>
            <RowDefinition Height="80*"></RowDefinition>
            <RowDefinition Height="10*"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid Grid.Row="1">
            <Grid.RowDefinitions>
                <RowDefinition Height="70*"></RowDefinition>
                <RowDefinition Height="30*"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="50*"></ColumnDefinition>
                <ColumnDefinition Width="50*"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Border Grid.Row="0" Grid.Column="0" BorderBrush="Black" BorderThickness="1">
                <Button  x:Name="ColorEllipse" Width="100" Height="100">
                    <Button.Background>
                        <!--<LinearGradientBrush x:Name="ColorEllipseBrush" StartPoint="0,0" EndPoint="1,1">
                            <GradientStop Offset="0" Color="#557ff2"></GradientStop>
                            <GradientStop Offset="0.44" Color="#557ff2"></GradientStop>
                            <GradientStop Offset="0.44" Color="#4d71d9"></GradientStop>
                            <GradientStop Offset="1" Color="#4d71d9"></GradientStop>
                        </LinearGradientBrush>-->
                        <SolidColorBrush x:Name="ColorEllipseBrush" Color="Blue" Opacity="0.75" ></SolidColorBrush>
                    </Button.Background>

                </Button>
            </Border>
            <Border Grid.Row="0" Grid.Column="1" BorderBrush="Black" BorderThickness="1">
                <Ellipse  x:Name="SizeEllipse" Width="100" Height="100" Fill="{StaticResource Decorative}"></Ellipse>
            </Border>
            <Border Grid.Row="1" Grid.Column="0" BorderBrush="Black" BorderThickness="1">
                <Button  x:Name="btn_changeColor" Background="Teal" Width="100" Height="50"  Opacity="0.75" Content="ChangeColor" Command="{Binding ChangeColor}"></Button>
            </Border>
            <Border Grid.Row="1" Grid.Column="1" BorderBrush="Black" BorderThickness="1">
                <Button  x:Name="btn_changeSize" Background="Teal" Width="100" Height="50"  Opacity="0.75" Content="ChangeSize" Command="{Binding ChangeSize}"></Button>
            </Border>  
        </Grid>
    </Grid>
</Window>

　　這個程序是一個很典型的MVVM的設計方式，首先看一下咱們的ViewModel文件夾下面，記住在使用Microsoft.Practices.Prism.Commands.DelegateCommand的時候請先添加對Microsoft.Practices.Prism.Mvvm的引用，在這個類中咱們添加了一個靜態的實例Instance,這個靜態的實例會做爲一個DataContext綁定到前臺，在這裏咱們添加了兩個Action類型的委託的屬性， public Action ChangeColorAction  { get; set; }       public Action ChangeSizeAction { get; set; }，在綁定的兩個命令的回調函數中，咱們來經過ChangeColorAction的Invoke方法來加載Stroyboard,因爲ChangeColorAction  是一種委託類型，至於委託的是哪一個方法，這個須要咱們來指定，下面我在貼出具體的指定的方法。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;

namespace ActionInvoke.ViewModel
{
   public class ActionInvokeViewModel:Microsoft.Practices.Prism.Mvvm.BindableBase
    {
       public ActionInvokeViewModel()
       {
           ChangeColor = new Microsoft.Practices.Prism.Commands.DelegateCommand(DoChangeColor);
           ChangeSize = new Microsoft.Practices.Prism.Commands.DelegateCommand(DoChangeSize);
       }

       public static ActionInvokeViewModel _instance;
       public static ActionInvokeViewModel Instance
       {
           get 
           {
               if (null == _instance)
               {
                   _instance = new ActionInvokeViewModel();
               }               
               return _instance;             
           }
           set
           {
               _instance = value;           
           }
       }

       private ICommand changeColor;
       public ICommand ChangeColor
       {
           get { return changeColor; }
           set
           {
               if (value != changeColor)
               {
                   changeColor = value;
                   OnPropertyChanged("ChangeColor");
               }
           
           }
       
       }

       private ICommand changeSize;
       public ICommand ChangeSize
       {
           get { return changeSize; }
           set
           {
               if (value != changeSize)
               {
                   changeSize = value;
                   OnPropertyChanged("ChangeSize");
               }

           }
       }

       public Action ChangeColorAction { get; set; }

       public Action ChangeSizeAction { get; set; }

       private void DoChangeColor()
       {
           if (null != ChangeColorAction)
           {
               ChangeColorAction.Invoke();
           }
       
       }

       private void DoChangeSize()
       {
           if (null != ChangeSizeAction)
           {
               ChangeSizeAction.Invoke();
           }
       
       }

    }

}

下面貼出view.xaml.cs文件，看究竟是如何進行數據綁定的。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using ActionInvoke.ViewModel;

namespace ActionInvoke
{
    /// <summary>
    /// MainWindow.xaml 的交互邏輯
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            ActionInvokeViewModel aivm = ActionInvokeViewModel.Instance;
            DataContext = aivm;
            aivm.ChangeColorAction = CurrentChangeColor;
            aivm.ChangeSizeAction = CurrentChangeSize;
        }

        private void CurrentChangeSize()
        {
            Dispatcher.Invoke(() =>
                {
                    (TryFindResource("ChangeSize") as Storyboard).Begin();
                });
        }

        private void CurrentChangeColor()
        {
            Dispatcher.Invoke(() =>
            {
                (TryFindResource("ChangeColor") as Storyboard).Begin();
            });
        }
    }
}

　　在該部分，咱們具體指定了兩個委託的回調函數，這裏咱們通過 (TryFindResource("ChangeColor") as Storyboard).Begin();來找到前臺的Stroyboard而後再啓動Storyboard來進行Storyboard的啓動，整個設計是很是完善的，很是符合MVVM的設計思路；