WPF-从下往上动画高度

Question

我正在尝试创建与Skypes通知类似的样式，但是动画存在一些问题。

我希望整个窗口的顶部和底部都带有边框，然后让中间的内容与之一起“推”边框。
我设法创建了几乎可以实现我想要的功能的东西，但是它从上到下随我希望其与底部边框文具一起向上推的方向而增长。

我想在中间部分使用以下动画

<DoubleAnimation 
     Storyboard.TargetName="contentGrid" 
     BeginTime="00:00:0.2" 
     Storyboard.TargetProperty="(FrameworkElement.Height)" 
     From="0" 
     Duration="0:0:0.5"/>

有任何想法吗？
谢谢

XAMl的其余部分:

<Grid Name="notificationPanel">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>        
    <Grid.Triggers>
        <EventTrigger RoutedEvent="FrameworkElement.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="contentGrid" Storyboard.TargetProperty="(FrameworkElement.Height)" From="0" Duration="0:0:0.5"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Grid.Triggers>

    <Grid Grid.Row="0" Background="CornflowerBlue">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>

        <TextBlock Name="notificationTitle" Padding="5" FontSize="14" Foreground="White">
            Call Manager - Incoming Call
        </TextBlock>

        <Path Name="closeButton"  Grid.Column="1" Margin="5,10,10,0" Fill="White" Data="F1 M 2.28484e-007,1.33331L 1.33333,0L 4.00001,2.66669L 6.66667,6.10352e-005L 8,1.33331L 5.33334,4L 8,6.66669L 6.66667,8L 4,5.33331L 1.33333,8L 1.086e-007,6.66669L 2.66667,4L 2.28484e-007,1.33331 Z " />
    </Grid>

    <Grid Name="contentGrid" Grid.Row="1" Background="White" Height="15" VerticalAlignment="Bottom" >  
    </Grid>

    <Rectangle Grid.Row="2" Fill="CornflowerBlue" Height="5" />
</Grid>

Answer 1

您所看到的行为是由包含<Grid Name="notificationPanel">网格的UIElement确定的。

如果将此栅格放置在高度设置为“自动”的元素内，它将从上至下进行动画处理，这不是您想要的。

如果将此Grid放置在具有固定高度或将高度设置为*的容器内，并且您已将'notificationPanel'Grid的VerticalAlignment设置为'Bottom'，那么您将获得正确的动画效果，并且' contentGrid不断成长并向上推顶部边框，而底部边框保持固定。

这是关于WPF的事情之一，我花了很长时间才学会:)包含元素通常控制着其子元素的行为和/或外观。