В WPF кто-нибудь анимировал сетку?

Не должно быть слишком сложно. Вам нужно будет создать EventTrigger с BeginStoryboard, который нацелен на сетку и использует DoubleAnimation для уменьшения ширины столбца. Пример здесь имеет аналогичную настройку. EventTrigger будет находиться на кнопке, а StoryBoard.Target DoubleAnimation будет указывать на ColumnDefinition, который вы хотите сжать.

Ладно, это не так хорошо работает. Вы не можете уменьшить столбец напрямую, но вы МОЖЕТЕ установить для столбца сжатия значение заполнения (width = "*"), установить ширину сетки и столбца без сжатия, а затем сжать всю сетку. Это действительно работает. Приведенный ниже пример работает:

<Page xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
      WindowTitle = "Opacity Animation Example" 
      Background = "White">
   <StackPanel Margin = "20">
      <Grid Name = "MyGrid" Width = "200" HorizontalAlignment = "Left">
         <Grid.RowDefinitions>
            <RowDefinition Height = "100"/>
         </Grid.RowDefinitions>
         <Grid.ColumnDefinitions>
            <ColumnDefinition Width = "*"/>
            <ColumnDefinition Width = "100"/>
         </Grid.ColumnDefinitions>
         <Rectangle HorizontalAlignment = "Stretch"  
                    VerticalAlignment = "Stretch" 
                    Grid.Column = "0" Fill = "Red"/>
         <Rectangle HorizontalAlignment = "Stretch"  
                    VerticalAlignment = "Stretch" 
                    Grid.Column = "1" Fill = "Blue"/>
      </Grid>

      <Button Name = "hideButton">
         <Button.Triggers>
            <EventTrigger RoutedEvent = "Button.Click">
               <BeginStoryboard>
                  <Storyboard>
                     <DoubleAnimation 
                         Storyboard.TargetName = "MyGrid"
                         Storyboard.TargetProperty = "(Grid.Width)" 
                         From = "200" To = "100" 
                         Duration = "0:0:2" 
                         AutoReverse = "True"  /> 
                  </Storyboard>
               </BeginStoryboard>
            </EventTrigger>
         </Button.Triggers>
      </Button>
   </StackPanel>
</Page>

Еще вы можете сделать анимацию содержимого и настроить сетку на автоматическое изменение размера содержимого, что будет происходить плавно по мере изменения размера содержимого.

Вы также можете добиться этого с помощью анимации GridLength, см. Пример здесь http://marlongrech.wordpress.com/2007/08/20/gridlength-animation/ Используя этот подход, вы можете управлять любым заданным размером Grid.Column или Grid.Row.

Для вашей особой потребности просто поместите первый столбец с Width = "Auto", а второй с *, анимируйте содержание внутри первого столбца - это поможет.

Вы также можете использовать элемент управления Reveal из трюков Кевина, http://j832.com/bagotricks/

Посмотрите ссылку на обучающее видео это от Тодда Миранды, в которой показано, как анимировать высоту элемента управления сеткой. Я думаю, вы могли бы легко заставить его работать в вашем случае.

Я взял исходный код C# Тодда Миранды и изменил его, чтобы продемонстрировать, как анимировать уменьшение и расширение ширины столбцов DataGrid.

Вот исходный код ...

http://www.pocketpctoolkit.com/WPF/DataGridColumnWidthAnimation.zip

Обычно вы нажимаете CheckBox, и для столбцов DataGrid, для которых установлено значение MinWidth, равное 0, ширина будет уменьшена до нулевой. Щелкните флажок еще раз, столбцы вернутся к исходной ширине.

Этот код WPF также демонстрирует, как создавать анимацию / раскадровку в коде.

Вам необходимо создать класс GridLengthAnimation (код из: http://windowsclient.net/learn/video.aspx?v=70654)

public class GridLengthAnimation : AnimationTimeline
{
    public GridLengthAnimation()
    {
        // no-op
    }

    public GridLength From
    {
        get { return (GridLength)GetValue(FromProperty); }
        set { SetValue(FromProperty, value); }
    }

    public static readonly DependencyProperty FromProperty =
      DependencyProperty.Register("From", typeof(GridLength), typeof(GridLengthAnimation));

    public GridLength To
    {
        get { return (GridLength)GetValue(ToProperty); }
        set { SetValue(ToProperty, value); }
    }

    public static readonly DependencyProperty ToProperty =
        DependencyProperty.Register("To", typeof(GridLength), typeof(GridLengthAnimation));

    public override Type TargetPropertyType
    {
        get { return typeof(GridLength); }
    }

    protected override Freezable CreateInstanceCore()
    {
        return new GridLengthAnimation();
    }

    public override object GetCurrentValue(object defaultOriginValue, object defaultDestinationValue, AnimationClock animationClock)
    {
        double fromValue = this.From.Value;
        double toValue = this.To.Value;

        if (fromValue > toValue)
        {
            return new GridLength((1 - animationClock.CurrentProgress.Value) * (fromValue - toValue) + toValue, this.To.IsStar ? GridUnitType.Star : GridUnitType.Pixel);
        }
        else
        {
            return new GridLength((animationClock.CurrentProgress.Value) * (toValue - fromValue) + fromValue, this.To.IsStar ? GridUnitType.Star : GridUnitType.Pixel);
        }
    }
}

И раскадровка для RowDefinition / ColumnDefinition.

<Window.Resources>
    <Storyboard x:Key = "ColumnAnimation">
        <Animations:GridLengthAnimation
            BeginTime = "0:0:0"
            Duration = "0:0:0.1"
            From = "0*"
            Storyboard.TargetName = "ColumnToAnimate"
            Storyboard.TargetProperty = "Width"
            To = "10*" />
    </Storyboard>

</Window.Resources>

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width = "10*" />
        <ColumnDefinition Width = "Auto" />
        <ColumnDefinition x:Name = "ColumnToAnimate" Width = "0*" />
    </Grid.ColumnDefinitions>
</Grid>