写自己的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:假如选择渐变颜色选择比较相近的两种颜色渐变起来比较好看)

<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

时间: 2024-11-06 02:25:56

写自己的WPF样式 - 按钮的相关文章

wpf样式绑定 行为绑定 事件关联 路由事件实例

代码说明:我要实现一个这样的功能  有三个window窗口  每个窗体有一个label标签  当我修改三个label标签中任意一个字体颜色的时候  其他的label标签字体颜色也变化 首先三个窗体不用贴代码了  直接添加三个就行了 样式绑定: 先添加数据源  代码如下: (注:为了防止propertyName硬编码写死   可以使用CallerMemberName附加属性来获取默认的属性名称 或者使用表达式目录树Expression<Func<T>>的方式来获取) 1 public

Bootstrap历练实例:链接样式按钮

<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Bootstrap历练实例:链接样式按钮</title> <meta charset="utf-8" /> <meta name="view

Android实现Windows 8磁贴(Tile)样式按钮

<Android实现Windows 8磁贴(Tile)样式按钮> 效果图如下: 我在网上流传的代码基础上精简.整理出一个简单的类,我暂时把它命名为:Windows8TileImageView,即Windows 8磁贴(Tile)样式按钮,Windows8TileImageView其实就是继承于标准Android ImageView,单击该Windows8TileImageView有收缩.侧边收缩等比较有趣的效果.现在把Windows8TileImageView这个类的全部代码贴出来: pack

WPF自定义Button样式(按钮长度随Content长度自适应)

代码如下: 1 <Style x:Key="ButtonStyle" TargetType="Button"> 2 <Setter Property="Template"> 3 <Setter.Value> 4 <ControlTemplate TargetType="Button"> 5 <!--StackPanel是用来控制当Button长度变化时,位置的适应-->

WPF界面按钮美化

在App.xaml里加入全局按钮样式 <Application x:Class="WpfButton.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:WpfButton&quo

WPF 样式(Style)初体验 (一) 作用域

刚刚接触WPF的开发,顿时对样式设计产生了兴趣.因为之前对CSS比较感兴趣,不难发现WPF的Style和CSS的模式很类似.下面我就根据自己初步的理解和CSS样式表对比做下总结,有理解不正确的地方还希望各位前辈指正. (1)全局样式控制 影响的是整个项目的样式,我们可以在App.xaml文件里定义全局的样式(这里就类似于我们在一个web的项目中添加一个全局的CSS文件,然后在每个页面引用CSS样式): <Application.Resources> <Style TargetType=&

WPF样式引用

为了提高样式的重用性,统一配置管理.web将样式写成通用的css,然后在页面中调用css.同样,wpf同样有这样的机制.其中有一个全局控制的地方,那就是在app.xaml中引用样式. 方法如下: <Application x:Class="WpfStudy.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.mic

WPF 样式(定义样式、引用样式、样式作用域、Trigger触发器)

1.定义 资源字典 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">   <RadialGradientBrush x:Key="mybrush">   <GradientStop

WPF样式

<Window x:Class="WpfApplication1.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:UC="clr-namespace:WpfApplication1" xmlns:UC