Xaml Windows 10-视觉状态更改的转换

我试图让我的Windows 10应用程序通过使用视觉状态触发器来改变网格的宽度，从而利用响应式设计。当状态更改时，宽度跳到下一个宽度

有没有办法用某种过渡或动画来平滑这种变化

<VisualStateManager.VisualStateGroups>
     <VisualStateGroup>
         <VisualState x:Name="DesktopWideState">
             <VisualState.StateTriggers>
                 <AdaptiveTrigger MinWindowWidth="1280" />
             </VisualState.StateTriggers>

             <VisualState.Setters>
                 <Setter Target="ContentPanel.Width"
                    Value="1000" />
             </VisualState.Setters>
         </VisualState>

        <VisualState x:Name="DefaultState">
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="0" />
            </VisualState.StateTriggers>
         </VisualState>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

---

VisualState

确实包含属性

情节提要

，因此确实可以基于状态触发器创建基于情节提要的动画

VisualState.Setters

已被引入，以消除

ObjectAnimationUsingKeyFrames

在情节提要中创建的噪音

要将动画添加到示例中，请使用以下命令：

<VisualStateManager.VisualStateGroups>
  <VisualStateGroup>
    <VisualState x:Name="DesktopWideState">
      <VisualState.StateTriggers>
        <AdaptiveTrigger MinWindowWidth="1280" />
      </VisualState.StateTriggers>
      <VisualState.Storyboard>
        <Storyboard>
          <DoubleAnimation Storyboard.TargetName="ContentPanel" Storyboard.TargetProperty="Width" Duration="0:0:0.5" To="1000" EnableDependentAnimation="True" />
        </Storyboard>
      </VisualState.Storyboard>
    </VisualState>
</VisualStateManager.VisualStateGroups>

不要使用此示例为什么

因为通过设置

宽度的动画，可以影响布局。这就是为什么动画在默认情况下被禁用，并且仅通过将
enabledDependentianimation
设置为true才能工作。你会看到，这个动画会结巴很多

尽量避免依赖动画，并在AdaptiveTriggers中仅对独立动画（如变换）使用情节提要。
您能否提供演示项目或其他我们可以使用的代码？