滑入&滑出动画

本文关键字:动画 滑入 | 更新日期: 2023-09-27 18:17:29

我想用&用c# &WPF .

到目前为止,我已经成功地编写了下面几行代码: XAML:

<Grid Name="grid" Grid.Column="0" Grid.Row="1">
       <Border Name="border" Background="Red"></Border>
</Grid>
c#:

private void Button_Click(object sender, RoutedEventArgs e) {
            border.Height = grid.ActualHeight;
            if (!isOpen) {
                isOpen = true;
                DoubleAnimation db = new DoubleAnimation();
                db.From = 0;
                db.To = grid.ActualHeight;
                db.Duration = TimeSpan.FromSeconds(0.5);
                border.BeginAnimation(Grid.HeightProperty, db);
            } else {
                isOpen = false;
                DoubleAnimation db = new DoubleAnimation();
                db.From = grid.ActualHeight;
                db.To = 0;
                db.Duration = TimeSpan.FromSeconds(0.5);
                border.BeginAnimation(Grid.HeightProperty, db);
            }
        }

好在动画被执行了。糟糕的是这个动画有错误的效果,我的意思是动画从上到中,从下到中(就像它在收缩)…

我如何制作(或在我的实际代码中修改)幻灯片效果(从上到下&从下到上)?

必须是c#代码

滑入&滑出动画

您正在尝试翻译您的UI控件,所以使用TranslateTransform (Canvas.Top是可能的,如果你是在画布上,但效率低下)。

修改你的XAML以包含一个渲染转换集到一个TranslateTransform对象:

<Grid Name="grid" Grid.Column="0" Grid.Row="1" ClipToBounds="true">
    <Border Name="border" Background="Red">
       <Border.RenderTransform>
           <TranslateTransform x:Name="borderTransform"/>
       </Border.RenderTransform>
    </Border>
</Grid>

和动画的Y属性的变换:

DoubleAnimation db = new DoubleAnimation();
db.From = 0;
db.To = grid.ActualHeight;
db.Duration = TimeSpan.FromSeconds(0.5);
borderTransform.BeginAnimation(TranslateTransform.YProperty, db);

就像你知道的那样,这样做是使用Storyboard对象(另外你可以在XAML中设置它!)

整个 lot cleaner