[WPF 知识总结系列] —— 基本控件的简单样式集合

一、ScrollBar

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <SolidColorBrush x:Key="StandardBrush" Color="LightGray" />

    <SolidColorBrush x:Key="PressedBrush" Color="DimGray" />

    <SolidColorBrush x:Key="HoverBrush" Color="DimGray" />

    <SolidColorBrush x:Key="GlyphBrush" Color="#333333" />

    <Style x:Key="LineUpButtonStyle" TargetType="{x:Type RepeatButton}">

        <Setter Property="Focusable" Value="False" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type RepeatButton}">

                    <Grid Height="18" Margin="1">

                        <Path Name="Path"

                              HorizontalAlignment="Center"

                              VerticalAlignment="Center"

                              Data="M 4 0 L 8 8 L 0 8 Z"

                              Fill="{StaticResource StandardBrush}"

                              Stretch="None" />

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource HoverBrush}" />

                        </Trigger>

                        <Trigger Property="IsPressed" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource PressedBrush}" />

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

    <Style x:Key="LineDownButtonStyle" TargetType="{x:Type RepeatButton}">

        <Setter Property="Focusable" Value="False" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type RepeatButton}">

                    <Grid Height="18" Margin="1">

                        <Path Name="Path"

                              HorizontalAlignment="Center"

                              VerticalAlignment="Center"

                              Data="M 0 0 L 4 8 L 8 0 Z"

                              Fill="{StaticResource StandardBrush}"

                              Stretch="None" />

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource HoverBrush}" />

                        </Trigger>

                        <Trigger Property="IsPressed" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource PressedBrush}" />

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

    <Style x:Key="LineLeftButtonStyle" TargetType="{x:Type RepeatButton}">

        <Setter Property="Focusable" Value="False" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type RepeatButton}">

                    <Grid Width="18" Margin="1">

                        <Path Name="Path"

                              HorizontalAlignment="Center"

                              VerticalAlignment="Center"

                              Data="M 0 4 L 8 8 L 8 0 Z"

                              Fill="{StaticResource StandardBrush}"

                              Stretch="None" />

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource HoverBrush}" />

                        </Trigger>

                        <Trigger Property="IsPressed" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource PressedBrush}" />

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

    <Style x:Key="LineRightButtonStyle" TargetType="{x:Type RepeatButton}">

        <Setter Property="Focusable" Value="False" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type RepeatButton}">

                    <Grid Width="18" Margin="1">

                        <Path Name="Path"

                              HorizontalAlignment="Center"

                              VerticalAlignment="Center"

                              Data="M 0 0 L 0 8 L 8 4 Z"

                              Fill="{StaticResource StandardBrush}"

                              Stretch="None" />

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource HoverBrush}" />

                        </Trigger>

                        <Trigger Property="IsPressed" Value="true">

                            <Setter TargetName="Path" Property="Fill" Value="{StaticResource PressedBrush}" />

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

    <Style x:Key="ScrollBarPageButtonStyle" TargetType="{x:Type RepeatButton}">

        <Setter Property="IsTabStop" Value="False" />

        <Setter Property="Focusable" Value="False" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type RepeatButton}">

                    <Border Background="Transparent" />

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

    <Style x:Key="VerticalScrollBarThumbStyle" TargetType="{x:Type Thumb}">

        <Setter Property="IsTabStop" Value="False" />

        <Setter Property="Focusable" Value="False" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate>

                    <Rectangle x:Name="ThumbRectangle"

                               Width="8"

                               Fill="{StaticResource StandardBrush}"

                               RadiusX="4"

                               RadiusY="4" />

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="True">

                            <Setter TargetName="ThumbRectangle" Property="Fill" Value="{StaticResource HoverBrush}" />

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

    <Style x:Key="HorizontalScrollBarThumbStyle" TargetType="{x:Type Thumb}">

        <Setter Property="IsTabStop" Value="False" />

        <Setter Property="Focusable" Value="False" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate>

                    <Rectangle x:Name="ThumbRectangle"

                               Height="8"

                               Fill="{StaticResource StandardBrush}"

                               RadiusX="4"

                               RadiusY="4" />

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="True">

                            <Setter TargetName="ThumbRectangle" Property="Fill" Value="{StaticResource HoverBrush}" />

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

    <ControlTemplate x:Key="VerticalScrollBarTemplate" TargetType="ScrollBar">

        <Grid>

            <Grid.RowDefinitions>

                <RowDefinition MaxHeight="18" />

                <RowDefinition Height="*" />

                <RowDefinition MaxHeight="18" />

            </Grid.RowDefinitions>

            <RepeatButton Command="{x:Static ScrollBar.LineUpCommand}" Style="{StaticResource LineUpButtonStyle}" />

            <Border Grid.Row="1">

                <Track Name="PART_Track" IsDirectionReversed="True">

                    <Track.DecreaseRepeatButton>

                        <RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource ScrollBarPageButtonStyle}" />

                    </Track.DecreaseRepeatButton>

                    <Track.IncreaseRepeatButton>

                        <RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource ScrollBarPageButtonStyle}" />

                    </Track.IncreaseRepeatButton>

                    <Track.Thumb>

                        <Thumb Style="{StaticResource VerticalScrollBarThumbStyle}" />

                    </Track.Thumb>

                </Track>

            </Border>

            <RepeatButton Grid.Row="2"

                          Command="{x:Static ScrollBar.LineDownCommand}"

                          Style="{StaticResource LineDownButtonStyle}" />

        </Grid>

    </ControlTemplate>

    <ControlTemplate x:Key="HorizontalScrollBarTemplate" TargetType="ScrollBar">

        <Grid>

            <Grid.ColumnDefinitions>

                <ColumnDefinition Width="18" />

                <ColumnDefinition Width="*" />

                <ColumnDefinition Width="18" />

            </Grid.ColumnDefinitions>

            <RepeatButton Command="{x:Static ScrollBar.LineLeftCommand}" Style="{StaticResource LineLeftButtonStyle}" />

            <Border Grid.Column="1">

                <Track Name="PART_Track" IsDirectionReversed="True">

                    <Track.DecreaseRepeatButton>

                        <RepeatButton Command="{x:Static ScrollBar.PageLeftCommand}" Style="{StaticResource ScrollBarPageButtonStyle}" />

                    </Track.DecreaseRepeatButton>

                    <Track.Thumb>

                        <Thumb Style="{StaticResource HorizontalScrollBarThumbStyle}" />

                    </Track.Thumb>

                    <Track.IncreaseRepeatButton>

                        <RepeatButton Command="{x:Static ScrollBar.PageRightCommand}" Style="{StaticResource ScrollBarPageButtonStyle}" />

                    </Track.IncreaseRepeatButton>

                </Track>

            </Border>

            <RepeatButton Grid.Column="2"

                          Command="{x:Static ScrollBar.LineRightCommand}"

                          Style="{StaticResource LineRightButtonStyle}" />

        </Grid>

    </ControlTemplate>

    <Style TargetType="ScrollBar">

        <Setter Property="Background" Value="Red" />

        <Style.Triggers>

            <Trigger Property="Orientation" Value="Vertical">

                <Setter Property="Template" Value="{StaticResource VerticalScrollBarTemplate}" />

            </Trigger>

            <Trigger Property="Orientation" Value="Horizontal">

                <Setter Property="Template" Value="{StaticResource HorizontalScrollBarTemplate}" />

            </Trigger>

        </Style.Triggers>

    </Style>

</ResourceDictionary>

二、TextButton

<ResourceDictionary

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions">

    <Style x:Key="TextButtonStyle" TargetType="{x:Type Button}">

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type Button}">

                    <Grid>

                        <ContentControl x:Name="contentControl"

                         Content="{TemplateBinding Content}"

                          Cursor="Hand"    >

                        </ContentControl>

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="True">

                            <Setter Property="Foreground" TargetName="contentControl" Value="#FF8AB936"/>

                        </Trigger>

                        <Trigger Property="IsPressed" Value="True">

                            <Setter Property="RenderTransform" TargetName="contentControl">

                                <Setter.Value>

                                        <TranslateTransform X="1" Y="1"/>

                                </Setter.Value>

                            </Setter>

                            <Setter Property="Cursor" Value="Hand"></Setter>

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

</ResourceDictionary>

三、PathButton1

You must set the button content with a path. But you can't change it's color.

<ResourceDictionary

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Style x:Key="PathButtonStyle" TargetType="{x:Type Button}">

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type Button}">

                    <Grid Background="#00000000" Cursor="Hand">

                        <ContentControl x:Name="contentControl"

                            Content="{TemplateBinding Content}"/>

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="True">

                            <Setter Property="Foreground" TargetName="contentControl" Value="#FF8AB936"/>

                        </Trigger>

                        <Trigger Property="IsPressed" Value="True">

                            <Setter Property="RenderTransform" TargetName="contentControl">

                                <Setter.Value>

                                    <TranslateTransform X="1" Y="1"/>

                                </Setter.Value>

                            </Setter>

                            <Setter Property="Cursor" Value="Hand"/>

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

</ResourceDictionary>

四、PathButton

Make it as a Custom Control.

五、ImageButton

Simple way to implement an imageButton, but you also need to set a Image into the button.

<ResourceDictionary

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Style x:Key="ImageButtonStyle" TargetType="{x:Type Button}">

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type Button}">

                    <Grid x:Name="grid">

                        <Grid.RowDefinitions>

                            <RowDefinition Height="Auto"/>

                            <RowDefinition Height="Auto"/>

                        </Grid.RowDefinitions>

                        <ContentPresenter RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>

                        <TextBlock Text="{TemplateBinding Tag}" VerticalAlignment="Center" Grid.Row="1" HorizontalAlignment="Center"/>

                    </Grid>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="True">

                            <Setter Property="Background" TargetName="grid" Value="#FF42B892"/>

                        </Trigger>

                        <Trigger Property="IsPressed" Value="True">

                            <Setter Property="RenderTransform" TargetName="grid">

                                <Setter.Value>

                                    <TransformGroup>

                                        <TranslateTransform X="1" Y="1"/>

                                    </TransformGroup>

                                </Setter.Value>

                            </Setter>

                        </Trigger>

                    </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

</ResourceDictionary>

六、ListBox

    <Style x:Key="StatusListBoxItemStyle" TargetType="{x:Type ListBoxItem}">

        <Setter Property="Background" Value="{StaticResource StatusBackground}" />

        <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />

        <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />

        <Setter Property="Padding" Value="2,0,0,0" />

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="{x:Type ListBoxItem}">

                    <Border x:Name="Bd"

                            Background="{TemplateBinding Background}"

                            BorderBrush="{TemplateBinding BorderBrush}"

                            BorderThickness="{TemplateBinding BorderThickness}"

                            Padding="{TemplateBinding Padding}"

                            SnapsToDevicePixels="true">

                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"

                                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />

                    </Border>

                        <ControlTemplate.Triggers>

                        <Trigger Property="IsSelected" Value="true">

                        <Setter TargetName="Bd" Property="Background" Value="{DynamicResource Background}" />

                        <Setter Property="Foreground" Value="{DynamicResource SelectedItemForeground}" />

                        </Trigger>

                        <MultiTrigger>

                        <MultiTrigger.Conditions>

                        <Condition Property="IsSelected" Value="true" />

                        <Condition Property="Selector.IsSelectionActive" Value="false" />

                        </MultiTrigger.Conditions>

                        <Setter TargetName="Bd" Property="Background" Value="{DynamicResource SelectedItemDeactiveBackground}" />

                        <Setter Property="Foreground" Value="{DynamicResource SelectedItemDeactiveForeground}" />

                        </MultiTrigger>

                        <Trigger Property="IsEnabled" Value="false">

                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />

                        </Trigger>

                        </ControlTemplate.Triggers>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

[WPF 知识总结系列] —— 基本控件的简单样式集合的更多相关文章

WPF自定义控件（一）の控件分类
一.什么是控件(Controls) 控件是指对数据和方法的封装.控件可以有自己的属性和方法,其中属性是控件数据的简单访问者,方法则是控件的一些简单而可见的功能.控件创建过程包括设计.开发.调试(就是所 ...
Map工具系列-08-map控件查看器
所有cs端工具集成了一个工具面板 -打开(IE) Map工具系列-01-Map代码生成工具说明 Map工具系列-02-数据迁移工具使用说明 Map工具系列-03-代码生成BySQl工具使用说明 Map ...
Winform开发框架之客户关系管理系统(CRM)的开发总结系列4-Tab控件页面的动态加载
在前面介绍的几篇关于CRM系统的开发随笔中,里面都整合了多个页面的功能,包括多文档界面,以及客户相关信息的页面展示,这个模块就是利用DevExpress控件的XtraTabPage控件的动态加载实现的 ...
WPF：DataTemplateSelector设置控件不同的样式
原文 WPF:DataTemplateSelector设置控件不同的样式最近想实现这么个东西,一个ListBox, 里面的ListBoxItem可能是文本框.下拉框.日期选择控件等等. 很自然的想到 ...
Swing系列之控件一
Swing系列之控件 JTextArea JTextArea是一个实现多行文本的控件构造函数 JTextArea() 构造新的TextArea. JTextArea(Document doc) 构造 ...
基于 WPF 平台的 ActiveReports Viewer控件
ActiveReports 报表控件致力于为组织和个人提供最出色的报表解决方案,多年来ActiveReports已经提供了 Windows Forms.Web.Silverlight和Flash平台的 ...
WPF不同线程之间的控件的访问
原文:WPF不同线程之间的控件的访问 WPF不同线程之间的控件是不同访问的,为了能够访问其他线程之间的控件,需要用Dispatcher.Invoke执行一个新的活动即可. 例如: public voi ...
WindowsXamlHost：在 WPF 中使用 UWP 的控件（Windows Community Toolkit）
Windows Community Toolkit 再次更新到 5.0.以前可以在 WPF 中使用有限的 UWP 控件,而现在有了 WindowsXamlHost,则可以使用更多 UWP 原生控件了. ...
WPF 动画：同为控件不同命 - 简书
原文:WPF 动画:同为控件不同命 - 简书 1. 及格与优秀读大学的时候,有一门课的作业是用 PPT 展示. 但是我们很多同学都把 PPT 当做 Word 来用,就单纯地往里面堆文字. 大家都单纯 ...

随机推荐

(转) lsof 一切皆文件
原文:https://linuxtools-rst.readthedocs.io/zh_CN/latest/tool/lsof.html lsof(list open files)是一个查看当前系统文 ...
StreamSets学习系列之StreamSets是什么？
不多说,直接上干货! StreamSets是一个侧重数据集成.数据加工流程构建的平台,也是一个开源的产品.通过StreamSets,用户可以方便的接入不同的数据源,并且完成数据加工流程的构建.Stea ...
执行bin/hdfs haadmin -transitionToActive nn1时出现，Automatic failover is enabled for NameNode at bigdata-pro02.kfk.com/192.168.80.152:8020 Refusing to manually manage HA state的解决办法（图文详解）
不多说,直接上干货! 首先, 那么,你也许,第一感觉,是想到的是全网最详细的Hadoop HA集群启动后,两个namenode都是standby的解决办法(图文详解) 这里,nn1,不多赘述了.很简 ...
Attr类中进行类型推断
涉及到重要的类的继承关系如下图所示. 关于抛出的异常继承体系:
windwos平台安装phpredis模块
要求必备知识熟悉基本编程环境搭建. 运行环境 windows 7(64位);php-5.3 redis64-2.8.17 下载地址环境下载什么是PHP Redis PHP Redis 是一个用 ...
mysql建立索引的一些小规则
1.表的主键.外键必须有索引: 2.数据量超过300的表应该有索引: 3.经常与其他表进行连接的表,在连接字段上应该建立索引: 4.经常出现在Where子句中的字段,特别是大表的字段,应该建立索引: ...
mac 安装 python mysqlclient 遇到的问题及解决方法
在 mac 上安装 mysqlclient 遇到了一些问题,查找资料很多人都遇到了同样的问题.通过资料和试验,成功了.这里记录一下,希望帮到遇到同样问题的人. 本人使用python3, 安装步骤如下: ...
前端自动构建工具Gulp入门
基于nodeJs:通过不同插件能自动完成一系列动作,比如压缩js/css/img.解析模版标签.解析less等: 一.安装gulp 安装nodeJs 打开Node.js command prompt ...
MyBatis JavaType JdbcType
MyBatis 通过包含的jdbcType类型 BIT FLOAT CHAR TIMESTAMP OTHER UNDEFINED TINYINT REAL VARCHAR BINARY BLOB NV ...
防止 IE 自动跳兼容模式
在HTML <head> 中增加如下: <meta http-equiv="x-ua-compatible" content="IE=edge" ...

[WPF 知识总结系列] —— 基本控件的简单样式集合

一、ScrollBar

二、TextButton

三、PathButton1

四、PathButton

五、ImageButton

六、ListBox

[WPF 知识总结系列] —— 基本控件的简单样式集合的更多相关文章

随机推荐

热门专题