Animate 如何更改 wpf 中的 ColumnDefinition 宽度？

Question

我需要通过单击按钮来更改列的宽度，并且这种更改应该是缓慢且动画的。

  <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" x:Name="Col1"/>
            <ColumnDefinition Width="2*" />
        </Grid.ColumnDefinitions>

        <Button >change Width Col1</Button>
  </Grid>

Answer 1

尝试这个：

Xml：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" x:Name="Col1"/>
        <ColumnDefinition Width="2*" />
    </Grid.ColumnDefinitions>

    <Button Click="Button_Click">change Width Col1</Button>
</Grid>

背后的代码：

  private void Button_Click(object sender, RoutedEventArgs e)
  {
        Storyboard storyboard = new Storyboard();

        Duration duration = new Duration(TimeSpan.FromMilliseconds(2000));
        CubicEase ease = new CubicEase { EasingMode = EasingMode.EaseOut };

        DoubleAnimation animation = new DoubleAnimation();
        animation.EasingFunction = ease;
        animation.Duration = duration;
        storyboard.Children.Add(animation);
        animation.From = 1000;
        animation.To = 0;            
        Storyboard.SetTarget(animation, Col1);
        Storyboard.SetTargetProperty(animation, new PropertyPath("(ColumnDefinition.MaxWidth)"));

        storyboard.Begin();
  }