2

我有一个动画,Canvas它通过无限期地将它旋转 360 度(它基本上旋转)来制作动画。我想要的是这个动画在控件显示时开始,然后在控件隐藏时停止。我想我可以以某种方式将它与VisualStateManager. 我在这里看到了一个淡入淡出控件的示例,它可以工作,但我只是不知道如何使用 VSM 来启动和停止情节提要

<Canvas.Resources>
    <Storyboard x:Name="spinnerBoard">
        <DoubleAnimation
            Storyboard.TargetName="SpinnerRotate"
            Storyboard.TargetProperty="Angle"
            From="0" To="360" Duration="0:0:01.3"
            RepeatBehavior="Forever" />
    </Storyboard>
</Canvas.Resources>

<Canvas.RenderTransform>
    <RotateTransform x:Name="SpinnerRotate" Angle="0" />
</Canvas.RenderTransform>

示例 VSM

<VisualState x:Name="Show">
    <Storyboard>
        <!-- Start the story board here -->
    </Storyboard>
</VisualState>
<VisualState x:Name="Hide">
    <Storyboard>
        <!-- Stop the story board here -->
    </Storyboard>
</VisualState>
4

1 回答 1

3

您的不同问题的全球答案: ExtendedVisualStateManager.GoToElementState 在 Silverlight默认绑定到自定义 DP 的 UserControl 中
返回 false

你可以这样做:

  1. 使用扩展ContentControl以播放 IsEnabled内容的模板控件(防止等待期间的操作);
  2. 创建一个 DPIsWaiting来切换你的控制视觉状态;
  3. 在 XAML 中创建两种状态:使用DoubleAnimationwith RepeatBehavior="Forever"

在您可以添加覆盖和等待消息依赖项属性(如忙指示符控件)之后...

我将图片用于等待视觉部分,但您可以使用画布、网格等...

C#

[TemplateVisualState(GroupName = "WaitGroup", Name = WaitSpinner.IsWaitingStateName)]
[TemplateVisualState(GroupName = "WaitGroup", Name = WaitSpinner.NotWaitingStateName)]
public class WaitSpinner : ContentControl
{
    #region States names
    internal const String IsWaitingStateName = "IsWaitingState";
    internal const String NotWaitingStateName = "NotWaitingState";
    #endregion States names

    public bool IsWaiting
    {
        get { return (bool)GetValue(IsWaitingProperty); }
        set { SetValue(IsWaitingProperty, value); }
    }

    public static readonly DependencyProperty IsWaitingProperty =
        DependencyProperty.Register("IsWaiting", typeof(bool), typeof(WaitSpinner), new PropertyMetadata(false, OnIsWaitingPropertyChanged));

    private static void OnIsWaitingPropertyChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
    {
        WaitSpinner waitSpinner = (WaitSpinner)sender;
        waitSpinner.ChangeVisualState(true);
    }

    public WaitSpinner()
    {
        DefaultStyleKey = typeof(WaitSpinner);
    }

    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();
        ChangeVisualState(false);
    }

    protected virtual void ChangeVisualState(bool useTransitions)
    {
        VisualStateManager.GoToState(this, IsWaiting ? IsWaitingStateName : NotWaitingStateName, useTransitions);
    }
}

xml:

<VisualStateGroup x:Name="WaitGroup">
    <VisualState x:Name="NotWaitingState" >
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Control.IsEnabled)" Storyboard.TargetName="content">
                <DiscreteObjectKeyFrame KeyTime="0">
                    <DiscreteObjectKeyFrame.Value>
                        <System:Boolean>True</System:Boolean>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
    <VisualState x:Name="IsWaitingState">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="WaitPart">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.200" Value="Visible"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="WaitPart" To="360" RepeatBehavior="Forever" Duration="0:0:1" />
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Control.IsEnabled)" Storyboard.TargetName="content">
                <DiscreteObjectKeyFrame KeyTime="0">
                    <DiscreteObjectKeyFrame.Value>
                        <System:Boolean>False</System:Boolean>
                    </DiscreteObjectKeyFrame.Value>
                </DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
</VisualStateGroup>
<!-- ............. -->
<ContentControl
    IsTabStop="False"
    x:Name="content"
    Content="{TemplateBinding Content}"
    ContentTemplate="{TemplateBinding ContentTemplate}"
    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
    Foreground="{TemplateBinding Foreground}"
    ScrollViewer.HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
    ScrollViewer.VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"/>
<Image Source="CirclePicture.png"
    x:Name="WaitPart"
    RenderTransformOrigin="0.5,0.5"
    Width="16"
    Height="16"
    Visibility="Collapsed"
    IsHitTestVisible="False">
    <Image.RenderTransform>
        <RotateTransform  />
    </Image.RenderTransform>
</Image>
于 2013-07-19T12:34:34.760 回答