做一个后台管理小程序,据说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

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

  1. 写自己的WPF样式 - 窗体

    初试WPF样式,感觉还不错.上篇写完了按钮的样式下面写窗体,废话不多说直接上代码: (1)定义一个窗体样式"MyWpfWindow" <Style x:Key="M ...

  2. Bootstrap WPF Style,Bootstrap风格的WPF样式

    简介 GitHub地址:https://github.com/ptddqr/bootstrap-wpf-style 此样式基于bootstrap-3.3.0,样式文件里的源码行数都是指的这个版本.CS ...

  3. C#工具:Bootstrap WPF Style,Bootstrap风格的WPF样式

    简介 GitHub地址:https://github.com/ptddqr/bootstrap-wpf-style 此样式基于bootstrap-3.3.0,样式文件里的源码行数都是指的这个版本.CS ...

  4. WPF样式(Style)入门

    原文:WPF样式(Style)入门 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/qq_34802416/article/details/78231 ...

  5. WPF - 样式 (转)

    本文目录 1.引言 2.怎样使用样式? 3.内联样式 4.已命名样式 5.元素类型样式 6.编程控制样式 7.触发器 1.引言 样式(Style),主要是用来让元素或内容呈现一定外观的属性.WPF中的 ...

  6. wpf 样式继承

    当定义的wpf多个样式,其样式内容(属性.触发器等)有较多的重复时,可以考虑将其抽象成父样式,来提升样式代码的可维护性以及减少代码冗余. wpf 进行样式继承时,需要使用style的BasedOn属性 ...

  7. WPF样式与触发器(3)

    WPF中的各类控件元素, 都可以自由的设置其样式. 诸如: 字体(FontFamily) 字体大小(FontSize) 背景颜色(Background) 字体颜色(Foreground) 边距(Mar ...

  8. 我的前端故事----来聊聊怎么写react-native上的样式吧

    我遇到了什么问题? 不久之前我重构了一个古老的项目,总结了一些js方面的想法,不过对于一个前端项目而言不仅仅只由js组成的嘛,上学的时候老师和我说HTML+CSS+JS对应的是页面的骨架.皮肤和肌肉. ...

  9. WPF解决按钮上被透明控件遮盖时无法点击问题

    原文:WPF解决按钮上被透明控件遮盖时无法点击问题 IsHitTestVisible="False" 在控件上设置如上属性即可,即可让透明控件不触发点击效果

随机推荐

  1. 使用WMI控制Windows进程 和服务

    1.使用WMI控制Windows进程 本文主要介绍两种WMI的进行操作:检查进程是否存在.创建新进行 代码如下: using System; using System.Collections.Gene ...

  2. asp.net Request.ServerVariables[] 读解

    获取客户端的IP地址,代码如下: /// <summary> /// 获取客户端IP地址 /// </summary> /// <returns></retu ...

  3. Dialog式的Activity(AndroidActivity生命周期)

    概述 和普通的Activity跳转稍微不同的是,当第1个Activity跳转到第二个Activity后,如果点击'back'按钮(即Android键盘的按钮,则不会调用调用第一个Activity的on ...

  4. cxf WebService整理 (基于注解)

    http://blog.csdn.net/zjw10wei321/article/details/39889823

  5. 用 javascript 判断 IE 版本号

    原文地址: http://julying.com/blog/determine-the-version-number-of-ie-with-javascript/ var _IE = (functio ...

  6. linux的du和df命令

    今天也有同学问我Linux下查看目录大小的命令,现在也将前阵子学习到du/df两个命令总结一下吧.前阵子测试工作中有遇到过由于磁盘空间满导致程序无法执行到情况,所以使用了df和du两个命令. du查看 ...

  7. Extjs中grid表格中去掉红三角

    在编辑Extjs的gridpanel的时候,数据有错误或是修改在每个单元格上都会出现红色的小三角,在每个列上面可以配置allowBlank: false来标识这个不可以为空 有的时候在保存数据时如果不 ...

  8. PL/SQL设置关键字大写

    Tools->Preferences->User Interface->Keyword case = Uppercase,就设置为大写了.

  9. CSS实现table td中文字的省略与显示

    所谓省略就是把多余的字以“...”显示出来,而显示则是当鼠标移动到td上时,把省略的字重新显示出来.对于一个table,兼容IE与FF.Chrome的省略方式CSS写法: table{ width:2 ...

  10. C语言笔记(数组地址一些细节)

     一.数组的a+1和&a+1的区别 先看看测试代码: ]={}; printf(" sizeof(data) = %d.\n", sizeof(data)); printf ...