Question

我正在尝试根据绑定值延迟自定义控件的动画。在下面的示例中，我希望动画在选择“SelectedAndHit”视觉状态后5秒开始。但是，似乎无法在VisualStateManage中使用模板绑定。

VisualStateManager中是否支持TemplateBinding？有没有解决方法？

<local:ButtonEx x:Name="Button01" AnimationBeginTime="00:00:05" />

public TimeSpan AnimationBeginTime
{
    get { return (TimeSpan)base.GetValue(ButtonEx.AnimationBeginTimeProperty); }
    set { base.SetValue(ButtonEx.AnimationBeginTimeProperty, value); }
}

public static readonly DependencyProperty AnimationBeginTimeProperty =
   DependencyProperty.Register("AnimationBeginTime", typeof(TimeSpan), typeof(ButtonEx), new PropertyMetadata(TimeSpan.Zero));

<Style TargetType="local:ButtonEx">
    <!-- ... -->

    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:ButtonEx">
                <Grid x:Name="Container" RenderTransformOrigin="0.5, 0.5">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="SelectedAndHit">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" 
                                                                   Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBackgroundColorSelectedAndHit}" />
                                    </ObjectAnimationUsingKeyFrames>

                                    <Storyboard>
                                        <DoubleAnimation
                                            Storyboard.TargetName="GridScaleTransform"
                                            Storyboard.TargetProperty="(ScaleTransform.ScaleX)"
                                            To="1.2" BeginTime="{TemplateBinding AnimationBeginTime}" Duration="00:00:00.300" AutoReverse="True">
                                            <DoubleAnimation.EasingFunction>
                                                <ExponentialEase EasingMode="EaseIn" />
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>

                                        <DoubleAnimation
                                            Storyboard.TargetName="GridScaleTransform"
                                            Storyboard.TargetProperty="(ScaleTransform.ScaleY)"
                                            To="1.2" BeginTime="{TemplateBinding AnimationBeginTime}" Duration="00:00:00.300" AutoReverse="True">
                                            <DoubleAnimation.EasingFunction>
                                                <ExponentialEase EasingMode="EaseIn" />
                                            </DoubleAnimation.EasingFunction>
                                       </DoubleAnimation>
                                    </Storyboard>
                                </Storyboard>
                            </VisualState>

                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>

                    <Grid.RenderTransform>
                        <ScaleTransform x:Name="GridScaleTransform" />
                    </Grid.RenderTransform>

                    <!-- ... -->
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

我确认WinRT不支持样式中的Binding / TemplateBinding。为了解决这个问题，我编写了代码来手动更新Storyboard的BeginTime。这样我就可以完全控制故事板何时开始。

Answer 2

我会看Interactivity。我个人使用了GoToStateAction的EventTrigger，这对我来说已经足够了。从查看MSDN看起来您可以使用TimerTrigger和GoToStateAction来创建您正在寻找的效果。 TimerTrigger具有依赖项属性，用于设置要触发的操作的延迟。

VisualStateManager中是否支持数据绑定或TemplateBinding？

2 个答案: