WPF GroupBox 淡入淡出

本次使用动画模块实现GroupBox 区域淡出淡入,还在研究如何实现翻页模式的动画

csharp 复制代码
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" Margin="10,10,0,0">
        <Button Content="Show GroupBox 1" Click="ShowGroup1_Click" Margin="0,0,10,0" x:Name="buttonShowGroup1"/>
        <Button Content="Show GroupBox 2" Click="ShowGroup2_Click" x:Name="buttonShowGroup2"/>
    </StackPanel>

    <Grid Grid.Row="1">
        <GroupBox Name="groupBox1" Header="Group Box 1" Visibility="Visible">
            <TextBlock Text="This is Group Box 1" FontSize="24" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </GroupBox>
        <GroupBox Name="groupBox2" Header="Group Box 2" Visibility="Collapsed">
            <TextBlock Text="This is Group Box 2" FontSize="24" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </GroupBox>
    </Grid>

    <Grid.Triggers>
        <!-- Trigger for showing GroupBox 1 -->
        <EventTrigger RoutedEvent="Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="groupBox1" 
                                 Storyboard.TargetProperty="(UIElement.Opacity)" 
                                 From="0.0" To="1.0" Duration="0:0:0.5"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>

        <EventTrigger RoutedEvent="FrameworkElement.Loaded" SourceName="groupBox1">
            <BeginStoryboard>
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="groupBox1" 
                                             Storyboard.TargetProperty="(UIElement.Visibility)">
                        <!--<DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="Visible"/>-->
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>

        <!-- Trigger for hiding GroupBox 1 and showing GroupBox 2 -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="buttonShowGroup2">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="groupBox1" 
                                 Storyboard.TargetProperty="(UIElement.Opacity)" 
                                 From="1.0" To="0.0" Duration="0:0:0.5"/>
                    <DoubleAnimation Storyboard.TargetName="groupBox2" 
                                 Storyboard.TargetProperty="(UIElement.Opacity)" 
                                 From="0.0" To="1.0" Duration="0:0:0.5"/>

                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="groupBox1" 
                                             Storyboard.TargetProperty="(UIElement.Visibility)">
                        <!--<DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="Collapsed"/>-->
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Collapsed</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="groupBox2" 
                                             Storyboard.TargetProperty="(UIElement.Visibility)">
                        <!--<DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="Visible"/>-->
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>

        <!-- Trigger for hiding GroupBox 2 and showing GroupBox 1 -->
        <EventTrigger RoutedEvent="Button.Click" SourceName="buttonShowGroup1">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="groupBox2" 
                                 Storyboard.TargetProperty="(UIElement.Opacity)" 
                                 From="1.0" To="0.0" Duration="0:0:0.5"/>
                    <DoubleAnimation Storyboard.TargetName="groupBox1" 
                                 Storyboard.TargetProperty="(UIElement.Opacity)" 
                                 From="0.0" To="1.0" Duration="0:0:0.5"/>

                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="groupBox2" 
                                             Storyboard.TargetProperty="(UIElement.Visibility)">
                        <!--<DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="Collapsed"/>-->
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Collapsed</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="groupBox1" 
                                             Storyboard.TargetProperty="(UIElement.Visibility)">
                        <!--<DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="Visible"/>-->
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Grid.Triggers>
</Grid>
相关推荐
绿浪198421 小时前
WPF UI标准流水线
ui·wpf
心平气和量大福大1 天前
C#-WPF-控件-LiveChart图表-线性2(LineSeries)-数据绑定
开发语言·c#·wpf
绿浪19841 天前
WPF 防重入,时序错乱详解
wpf
whn19772 天前
oracle的节点2无法启动asm实例 提示PMON terminating the instance due to error 481
数据库·oracle·wpf
完美火龙篇 四月的友2 天前
WPF 笔迹延迟优化从硬件到软件的全链路分析
wpf
dalong102 天前
WPF:3D立方体
3d·wpf
Xin_ye100864 天前
第三章:内存泄漏的常见“案发现场”
c#·wpf
心平气和量大福大4 天前
C#-WPF-UserControl-生命周期(加载 退出)
开发语言·c#·wpf
czhc11400756634 天前
7.23:Claude code:注册->封表
wpf
心平气和量大福大5 天前
C#-WPF-控件-TextBox 数据绑定
开发语言·c#·wpf