转变“Visibility"在混合使用视觉状态

本文关键字：混合 视觉 状态 Visibility quot 转变 | 更新日期: 2023-09-27 18:13:16

所以我有一个加载控件，它实际上是一个用户控件，在我的主用户控件的顶部显示" loading "，阻止用户与我的程序交互，直到它被加载。

我想使用视觉状态来转换"Loading"控件的可见性，使其慢慢淡出到折叠状态，并在程序中的任何其他状态下保持折叠状态。

我现在有我的加载控制:

    <ContentControl x:Name="contentControl" Content="{StaticResource loadingAnimation}">
        <i:Interaction.Triggers>
            <ei:DataTrigger Value="false" Binding="{Binding IsLoadingAnimationVisible}">
                <ei:GoToStateAction StateName="Loaded"/>
            </ei:DataTrigger>
        </i:Interaction.Triggers>
    </ContentControl>

地点:

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0:0:0.5" To="Collapsed">
                    <VisualTransition.GeneratedEasingFunction>
                        <CubicEase EasingMode="EaseInOut"/>
                    </VisualTransition.GeneratedEasingFunction>
                </VisualTransition>
                <VisualTransition GeneratedDuration="0:0:0.5" To="Expanded">
                    <VisualTransition.GeneratedEasingFunction>
                        <CubicEase EasingMode="EaseInOut"/>
                    </VisualTransition.GeneratedEasingFunction>
                </VisualTransition>
                <VisualTransition GeneratedDuration="0:0:0.5" To="Loaded">
                    <VisualTransition.GeneratedEasingFunction>
                        <CubicEase EasingMode="EaseInOut"/>
                    </VisualTransition.GeneratedEasingFunction>
                </VisualTransition>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Expanded">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="contentControl">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Collapsed}"/>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="Collapsed">
                <Storyboard>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="metaGrid">
                        <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                    </DoubleAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="contentControl">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Collapsed}"/>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="Loaded">
                <Storyboard>
                    <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" Storyboard.TargetName="contentControl">
                        <DiscreteBooleanKeyFrame KeyTime="0" Value="False"/>
                    </BooleanAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="contentControl">
                        <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

现在的问题是，当我触发扩展和折叠状态的"加载"内容控制变得可见，然后淡出折叠超过0.5秒。如何在触发加载状态后将加载控件永久设置为折叠?

编辑

我不确定这是正确的方式来过渡可见性在混合(即设置ishittestvisible = false和不透明度= 0)，但这是唯一的方法，我可以认为设置可见性。当我尝试它的时候，它似乎没有过渡，它会迅速崩溃)

转变“Visibility"在混合使用视觉状态

听起来你想使用Timeline.BeginTime属性。使用此属性，可以延迟Visibility.Collapsed Animation的启动。理想情况下，您也应该在DoubleAnimationUsingKeyFrames对象上设置Duration属性。试试这个:

<VisualState x:Name="Collapsed">
    <Storyboard>
        <DoubleAnimationUsingKeyFrames Duration="0:0:5" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="metaGrid">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
        <ObjectAnimationUsingKeyFrames BeginTime="0:0:5" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="contentControl">
            <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Collapsed}"/>
        </ObjectAnimationUsingKeyFrames>
    </Storyboard>
</VisualState>
相关文章：