为了尝试学习更多关于WPF的内容，我一直在研究一些控件的样式，我希望有人可以帮助我制作一些动画。
我一直试图做的是使用扩展器，使其扩展/折叠动画，并在鼠标悬停时自动执行此操作。
我发现网站也分别说明了这些技术，但我很难将它们结合起来，并希望有人可以帮我完成。目前我无法使动画工作，我不知道为什么。
我已经将大部分动画样式简化为更简单的东西，因为我不需要复杂的学习示例。
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="640" Height="480">
<Page.Resources>
<Style x:Key="ExpanderHeaderFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Border>
<Rectangle SnapsToDevicePixels="true" Margin="0" Stroke="Black" StrokeDashArray="1 2" StrokeThickness="1"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ExpanderStyle1" TargetType="{x:Type Expander}">
<Setter Property="Foreground" Value="Transparent"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Expander}">
<ControlTemplate.Resources>
<Storyboard x:Key="Timeline1">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:0.25" Storyboard.TargetName="ExpandSite" Storyboard.TargetProperty="(FrameworkElement.LayoutTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
<SplineDoubleKeyFrame KeyTime="00:00:0.25" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="Timeline2">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.45" Storyboard.TargetName="ExpandSite" Storyboard.TargetProperty="(FrameworkElement.LayoutTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
<SplineDoubleKeyFrame KeyTime="00:00:0.45" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<Border x:Name="border" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3">
<DockPanel>
<ContentPresenter FocusVisualStyle="{StaticResource ExpanderHeaderFocusVisual}"
Visibility="Visible"
Margin="{TemplateBinding Padding}"
Focusable="False"
x:Name="HeaderSite"
Content="{TemplateBinding Header}"
ContentTemplate="{TemplateBinding HeaderTemplate}"
ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}"
DockPanel.Dock="Top"/>
<ContentPresenter Focusable="false"
Visibility="Collapsed"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
x:Name="ExpandSite"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
DockPanel.Dock="Bottom">
<ContentPresenter.LayoutTransform>
<TransformGroup>
<ScaleTransform ScaleX="1" ScaleY="0"/>
<SkewTransform AngleX="0" AngleY="0"/>
<RotateTransform Angle="0"/>
<TranslateTransform X="0" Y="0"/>
</TransformGroup>
</ContentPresenter.LayoutTransform>
</ContentPresenter>
</DockPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="True">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource Timeline1}"/>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource Timeline2}"/>
</Trigger.ExitActions>
</Trigger>
<Trigger Property="ExpandDirection" Value="Up">
<Setter Property="DockPanel.Dock" TargetName="ExpandSite" Value="Top"/>
<Setter Property="DockPanel.Dock" TargetName="HeaderSite" Value="Bottom"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Visibility" Value="Visible" TargetName="ExpandSite"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Visibility" Value="Visible" TargetName="ExpandSite"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Grid>
<Expander HorizontalAlignment="Left" VerticalAlignment="Top" Background="Red" BorderBrush="Green" Width="100" Header="" x:Name="expander" Style="{DynamicResource ExpanderStyle1}" IsExpanded="True">
<ListBox IsSynchronizedWithCurrentItem="True" x:Name="listBox">
<ListBoxItem Content="ListBoxItem"/>
<ListBoxItem Content="ListBoxItem"/>
<ListBoxItem Content="ListBoxItem"/>
</ListBox>
</Expander>
</Grid>
</Page>
答案 0 :(得分：0)
使用样式触发器。你走了：
<Expander>
<Expander.Style>
<Style>
<Setter Property="Background" Value="Green" />
<Style.Triggers>
<Trigger Property="Expander.IsMouseOver" Value="True">
<Setter Property="Expander.IsExpanded" Value="True" />
</Trigger>
</Style.Triggers>
</Style>
</Expander.Style>
<Rectangle Width="100" Height="100" Fill="Red" Stroke="Black" />
</Expander>
答案 1 :(得分：0)
这是你想要做的一个非常简单的例子：
<Window.Resources>
<BooleanToVisibilityConverter x:Key="boolToVis" />
</Window.Resources>
<Grid>
<Expander Name="theExpander">
<Expander.Header>
<StackPanel Orientation="Vertical" VerticalAlignment="Bottom">
<TextBlock Text="Foo" />
<TextBlock Text="Bar" Visibility="{Binding ElementName=theExpander, Path=IsExpanded, Converter={StaticResource boolToVis}}" VerticalAlignment="Top" />
<TextBlock Text="Baz" />
</StackPanel>
</Expander.Header>
</Expander>
</Grid>
现在显然它并不完美，但我用它来说明如何将对象的可见性绑定到IsExpanded，以便它获得你所追求的“崩溃”效果。问题当然是扩展器按钮没有正确对齐和视觉上我确定它不完全是你所追求的，但你所要做的就是从Microsoft Expander Style and Templates page抓取扩展器模板并覆盖你需要的具体位。
如果您在此处发布后续问题仍有问题，我将自行为您服务。