其他分享
首页 > 其他分享> > WPF自定义系统按钮

WPF自定义系统按钮

作者:互联网

  1. 概述:

因为我要做的是无边框,且系统按钮与图标文字在同一水平背景上,原有的系统按钮太丑了,所以我重新自定义了最小化、最大化、关闭这三个系统按钮,用图片按钮切换来代替原有的:

效果如下图:

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;
            }  
        }

 

标签:ImageBrush,自定义,void,WindowState,brush,按钮,new,WPF
来源: https://blog.csdn.net/weixin_42535339/article/details/96424866