启动折叠的VisualState干扰WPF .NET 4中的其他动画

时间:2010-10-15 19:10:25

标签: wpf visualstatemanager .net-4.0

我正在使用.net 4,vs2010并创建了一个用户控件,需要启动折叠和透明(不透明度为0),并在响应按钮点击时变为可见和不透明。

<UserControl x:Class="Ihi.LeadRetrieval.Client.Views.HelpView"
                     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
                     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                     xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" 
                     xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
                     mc:Ignorable="d" 
                     d:DesignHeight="300" d:DesignWidth="300">
<Grid x:Name="HelpGrid" Visibility="Collapsed" Opacity="0">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="HelpStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0:0:0.5">
                    <VisualTransition.GeneratedEasingFunction>
                        <CircleEase EasingMode="EaseInOut"/>
                    </VisualTransition.GeneratedEasingFunction>
                </VisualTransition>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="HelpOpen">
            <Storyboard>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="HelpGrid">
                    <EasingDoubleKeyFrame KeyTime="0" Value="0.95"/>
                </DoubleAnimationUsingKeyFrames>
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="HelpGrid">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
                </ObjectAnimationUsingKeyFrames>
            </Storyboard>
            </VisualState>
            <VisualState x:Name="HelpClosed">
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Border Background="#00427A" CornerRadius="3">
        <DockPanel Margin="5">
            <ContentPresenter DockPanel.Dock="Bottom" Margin="12,10,0,0" Content="{Binding Path=Detail}" Style="{StaticResource HelpText}"/>
            <Label Style="{StaticResource HelpHeaderText}" Content="{Binding Path=Header}" DockPanel.Dock="Left" MaxHeight="50"/>
            <Button x:Name="CloseHelpButton" Style="{StaticResource HelpButtonStyle}" Content="X" HorizontalAlignment="Right" VerticalAlignment="Top" DockPanel.Dock="Right" MaxHeight="50">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <ei:GoToStateAction x:Name="CloseAction" StateName="HelpClosed"/>
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Button>
        </DockPanel>
    </Border>
</Grid>

但是,当我从父用户控件中定位此控件并触发HelpOpen可视状态时,我注意到动画完成后,帮助控件突然显示 - 它不会按预期淡入。

<view:HelpView x:Name="helpView" />
<Button x:Name="ButtonOpen" Margin="0,0,25,0" VerticalAlignment="Top" Content="Open">
   <i:Interaction.Triggers>
        <i:EventTrigger EventName="Click">
            <ei:GoToStateAction TargetObject="{Binding ElementName=helpView}" StateName="HelpOpen"/>
        </i:EventTrigger>
   </i:Interaction.Triggers>
</Button>

我认为这是因为帮助控件仅在动画结束时变得可见,因此不会渲染增加不透明度的过渡。

有没有办法在调整不透明度值之前指定visibility属性设置为visible?

1 个答案:

答案 0 :(得分:0)

我不确定您是否找到了问题的答案,但可能有助于了解转换和视觉状态是两个不同的时间轴。

最简单的方法是在混合中编辑转换和状态。事件的顺序如下:

  1. 从州A开始
  2. 某些触发器会导致“转到状态”B
  3. 从状态A到B的转换(0.5秒)。 过渡
  4. 中的不透明度或可见性没有变化
  5. 应用/播放状态B.这是您的不透明度和可见性更改的位置,并且由于状态B的持续时间为0秒,因此会立即发生
  6. 我通常做的是在混合中明确创建转换( - &gt; stateB,stateA-&gt; 或stateA-&gt; stateB等)。然后,您可以调整应用可见性更改的时间以及不透明度更改开始/结束的时间。