正文
WPF 自定义窗口关闭按钮
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
关闭图标设计主要涉及主要知识点：
1、Path，通过Path来画线。当然一般水平、竖直也是可以用Rectangle/Border之类的替代
一些简单的线条图标用Path来做，还是很方便的。
2、简单的动画，Animation用法
Button样式如下：
<Button x:Name="BtnClose" Click="BtnClose_OnClick">
<Button.Template>
<ControlTemplate TargetType="Button">
<Grid>
<Grid x:Name="Uc_Grid" VerticalAlignment="Center" Height="25" Width="25">
<Path x:Name="Uc_Path1" Stroke="DodgerBlue" StrokeThickness="4" Data="M0,0 L20,20" VerticalAlignment="Center" HorizontalAlignment="Center"></Path>
<Path x:Name="Uc_Path2" Stroke="DodgerBlue" StrokeThickness="4" Data="M20,0 L0,20" VerticalAlignment="Center" HorizontalAlignment="Center"></Path>
<Grid.RenderTransform>
<RotateTransform x:Name="Uc_Transform" Angle="0" CenterY="12.5" CenterX="12.5"></RotateTransform>
</Grid.RenderTransform>
</Grid>
<ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}"></ContentPresenter>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="Uc_Path1" Property="Data" Value="M0,0 L22,22"></Setter>
<Setter TargetName="Uc_Path2" Property="Data" Value="M22,0 L0,22"></Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="Uc_Path1" Property="Data" Value="M0,0 L24,24"></Setter>
<Setter TargetName="Uc_Path2" Property="Data" Value="M24,0 L0,24"></Setter>
</Trigger>
<EventTrigger RoutedEvent="MouseEnter">
<BeginStoryboard HandoffBehavior="SnapshotAndReplace">
<Storyboard TargetName="Uc_Transform" TargetProperty="Angle">
<DoubleAnimation From="0" To="90" Duration="0:0:0.1"></DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
</Button>
