从视图模型(行为)触发视觉状态

我试图在Behavior SDK的帮助下触发一个视觉状态。弹出(显示/隐藏)的当前状态应该取决于ViewModel中FlyoutIsVisible的值。所有的绑定都很好，除了动画，一切都像预期的那样工作。飞出框没有出现。当我通过背后的代码触发视觉状态时，它就会工作。DataTriggerBehavior也可以工作(例如，调用命令而不是状态动作)。

<interactivity:Interaction.Behaviors>
    <core:DataTriggerBehavior Binding="{Binding FlyoutIsVisible}" ComparisonCondition="Equal" Value="True">
        <core:GoToStateAction StateName="ShowFlyout" TargetObject="{Binding ElementName=Flyout}" />
    </core:DataTriggerBehavior>
    <core:DataTriggerBehavior Binding="{Binding FlyoutIsVisible}" ComparisonCondition="Equal" Value="False">
        <core:GoToStateAction StateName="HideFlyout" TargetObject="{Binding ElementName=Flyout}" />
    </core:DataTriggerBehavior>
</interactivity:Interaction.Behaviors>

视觉:

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup>
        <VisualState x:Name="ShowFlyout">
            <Storyboard>
                <DoubleAnimation Storyboard.TargetName="Flyout"
                            Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)"
                            From="380" To="0" Duration="0:0:0.5" EnableDependentAnimation="True"
                            d:IsOptimized="True">
                    <DoubleAnimation.EasingFunction>
                        <CubicEase EasingMode="EaseOut" />
                    </DoubleAnimation.EasingFunction>
                </DoubleAnimation>
            </Storyboard>
        </VisualState>
        ...
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

飞出:

<Border x:Name="Flyout">
    <Border.RenderTransform>
        <CompositeTransform TranslateX="380" />
    </Border.RenderTransform>
    ...
</Border>

所以我认为视觉状态的范围/背景存在问题。我不确定在哪里放置视觉状态和行为。如果两者都在Flyout(并省略TargetObject属性)内，我得到一个异常，表示控件上没有可视状态。否则(在外部声明并使用属性)什么都不会发生。那么，如何正确使用进入状态行为呢?

更新:

Page
-Grid
--Grid (Header)
--Grid (Content)
---Grid
----Some Element
----The Flyout
----Some Element
----Some Element
--VisualStateManager
--DataTriggerBehavior

TargetObject="{Binding ElementName=Flyout}"