写自己的WPF样式 - 按钮
做一个后台管理小程序,据说WPF的界面比较"炫",于是选择使用WPF来开发。既然用了WPF当然需要做好看点了,于是稍微研究了下WPF的样式,废话不多说下面开始自定义一个按钮样式:
(1)在App.xaml文件里自定义一个按钮样式 ,"MyWpfButton":
<Application x:Class="WPFCustomerStyleStudy.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" StartupUri="MainWindow.xaml"> <Application.Resources> <Style x:Key="MyWpfButton" TargetType="{x:Type Button}" > </Style> </Application.Resources> </Application>
(2)自定义按钮的前景色背景色,个人比较喜欢蓝色大气:
tip1:自定义一些颜色,作为按钮的前景色背景色方便重用
tip2:假如选择渐变颜色选择比较相近的两种颜色渐变起来比较好看
*tip3:使用blend工具编辑
<Application x:Class="WPFCustomerStyleStudy.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" StartupUri="MainWindow.xaml"> <Application.Resources> <!--自定义颜色--> <LinearGradientBrush x:Key="LinearGradientBlueBackground" EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FF377FED" Offset="0" /> <GradientStop Color="#FF074CC0" Offset="1" /> </LinearGradientBrush> <Color x:Key="MyBtnBorderColor">#FF2D78F4</Color> <!--END--> <Style x:Key="MyWpfButton" TargetType="{x:Type Button}" > <Setter Property="Background" Value="{StaticResource LinearGradientBlueBackground}"></Setter> <Setter Property="Foreground" Value="White"></Setter> <Setter Property="BorderBrush" Value="{StaticResource MyBtnBorderColor}"></Setter> </Style> </Application.Resources> </Application>
下面给按钮绑定下样式,我们对比下效果:
是不是顿时高大尚了起来呢,运行看看效果你会发现鼠标经过的时候颜色还是原始的颜色,下面我们继续完善。
(3)自定义模板,给按钮添加圆角,鼠标经过背景:
<Application x:Class="WPFCustomerStyleStudy.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" StartupUri="MainWindow.xaml"> <Application.Resources> <!--自定义颜色--> <LinearGradientBrush x:Key="LinearGradientBlueBackground" EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FF377FED" Offset="0" /> <GradientStop Color="#FF074CC0" Offset="1" /> </LinearGradientBrush> <SolidColorBrush x:Key="MyBtnBorderColor" Color="#FF2D78F4"></SolidColorBrush> <SolidColorBrush x:Key="MyBtnHoverBackgroundColor" Color="#FF317EF3"></SolidColorBrush> <!--END--> <Style x:Key="MyWpfButton" TargetType="{x:Type Button}" > <Setter Property="Background" Value="{StaticResource LinearGradientBlueBackground}"></Setter> <Setter Property="Foreground" Value="White"></Setter> <Setter Property="BorderBrush" Value="{StaticResource MyBtnBorderColor}"></Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true" CornerRadius="3,3,3,3"> <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" /> </Border> <ControlTemplate.Triggers> <Trigger Property="IsMouseOver" Value="true"> <Setter Property="Background" TargetName="border" Value="{StaticResource MyBtnHoverBackgroundColor}"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </Application.Resources> </Application>
简单大气的按钮样式就完成了,下面看效果:
转载请注明出处:http://www.cnblogs.com/xinwang/p/4354182.html