- 概述:
因为我要做的是无边框,且系统按钮与图标文字在同一水平背景上,原有的系统按钮太丑了,所以我重新自定义了最小化、最大化、关闭这三个系统按钮,用图片按钮切换来代替原有的:
效果如下图:
App.xaml页面代码:
<Application x:Class="WPF_Client.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WPF_Client"
StartupUri="LoginWindow.xaml">
<Application.Resources>
<!--自定义系统最小化button-->
<Style x:Key="Minbtn" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid Cursor="Hand">
<Border x:Name="_Border" BorderBrush="Transparent" CornerRadius="5" BorderThickness="0">
<Border.Background>
<ImageBrush ImageSource="Images/最小化.png"/>
</Border.Background>
</Border>
<ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Grid>
<!--定义触发器-->
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" TargetName="_Border">
<Setter.Value>
<ImageBrush ImageSource="Images/最小化红.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
<!--定义触发器_End-->
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!--自定义系统最大化button-->
<Style x:Key="Maxbtn" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid Cursor="Hand">
<Border x:Name="_Border" BorderBrush="Transparent" CornerRadius="5" BorderThickness="0" Background="{TemplateBinding Background}">
</Border>
<ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Grid>
<!--定义触发器-->
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" TargetName="_Border">
<Setter.Value>
<ImageBrush ImageSource="Images/标准大小红.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
<!--定义触发器_End-->
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!--自定义系统关闭button-->
<Style x:Key="Closebtn" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid Cursor="Hand">
<Border x:Name="_Border" BorderBrush="Transparent" CornerRadius="5" BorderThickness="0">
<Border.Background>
<ImageBrush ImageSource="Images/关闭.png"/>
</Border.Background>
</Border>
<ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Grid>
<!--定义触发器-->
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" TargetName="_Border">
<Setter.Value>
<ImageBrush ImageSource="Images/关闭红.png"/>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
<!--定义触发器_End-->
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Application.Resources>
</Application>
窗口XAML代码(在相应的button上引用样式):
<Button Style="{StaticResource Minbtn}"
Grid.Column="0"
Width="32"
Height="32"
BorderThickness="0"
HorizontalAlignment="Right"
Margin="100 0"
Click="btn_Min_Click"/>
<Button Style="{StaticResource Maxbtn}"
Name="mb"
Grid.Column="0"
Width="32"
Height="32"
BorderThickness="0"
HorizontalAlignment="Right"
Margin="50 0"
Click="btn_Max_Click">
<Button.Background>
<ImageBrush ImageSource="Images/标准大小.png"/>
</Button.Background>
</Button>
<Button Style="{StaticResource Closebtn}"
Grid.Column="0"
Width="32"
Height="32"
BorderThickness="0"
HorizontalAlignment="Right"
Margin="10 0"
Click="btn_Close_Click"/>
后台.cs代码(因为系统按钮有不同的触发效果,所以在按钮上添加事件来实现):
//关闭按钮点击事件
private void btn_Close_Click(object sender, RoutedEventArgs e)
{
this.Close();
}
//最大化点击事件功能实现
private void btn_Min_Click(object sender, RoutedEventArgs e)
{
this.WindowState = WindowState.Minimized;
}
//最大化点击事件功能实现和切换图片
private void btn_Max_Click(object sender, RoutedEventArgs e)
{
if (WindowState == WindowState.Maximized)
{
WindowState = WindowState.Normal;
//设置图片
ImageBrush brush = new ImageBrush();
//当用到BitmapImage的时候,图片资源必须放到bin文件夹里面,并且设置相对路径UriKind.Relative,不能放到新建的Images文件夹里
brush.ImageSource = new BitmapImage(new Uri("Images/最大化.png",UriKind.Relative));
mb.Background = brush;
}
else if(WindowState == WindowState.Normal)
{
WindowState = WindowState.Maximized;
//设置图片
ImageBrush brush = new ImageBrush();
brush.ImageSource = new BitmapImage(new Uri("Images/标准大小.png", UriKind.Relative));
mb.Background = brush;
}
}