WPF 全局样式(滚动条)
对整个WPF项目进行样式修改时,采用全局样式的方法。
首先,建一个xaml文件为存放样式的资源文件。写入想修改的控件样式,以滚动条样式为例。
1 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 2 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 3 xmlns:sys="clr-namespace:System;assembly=mscorlib"> 4 <!-- ScrollViewer 滚动条 --> 5 <Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}"> 6 <Setter Property="OverridesDefaultStyle" Value="true"/> 7 <Setter Property="IsTabStop" Value="false"/> 8 <Setter Property="Template"> 9 <Setter.Value> 10 <ControlTemplate TargetType="{x:Type Thumb}"> 11 <Grid> 12 <!--滚动条颜色--> 13 <Border Background="#646465" CornerRadius="3"/> 14 </Grid> 15 </ControlTemplate> 16 </Setter.Value> 17 </Setter> 18 </Style> 19 <Style x:Key="HorizontalScrollBarPageButton" TargetType="{x:Type RepeatButton}"> 20 <Setter Property="OverridesDefaultStyle" Value="true"/> 21 <Setter Property="Background" Value="Transparent"/> 22 <Setter Property="Focusable" Value="false"/> 23 <Setter Property="IsTabStop" Value="false"/> 24 <Setter Property="Opacity" Value="0.2"/> 25 <Setter Property="Template"> 26 <Setter.Value> 27 <ControlTemplate TargetType="{x:Type RepeatButton}"> 28 <Rectangle Fill="{TemplateBinding Background}" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}"/> 29 </ControlTemplate> 30 </Setter.Value> 31 </Setter> 32 </Style> 33 <Style x:Key="VerticalScrollBarPageButton" TargetType="{x:Type RepeatButton}"> 34 <Setter Property="OverridesDefaultStyle" Value="true"/> 35 <Setter Property="Background" Value="Transparent"/> 36 <Setter Property="Focusable" Value="false"/> 37 <Setter Property="IsTabStop" Value="false"/> 38 <Setter Property="Opacity" Value="0.2"/> 39 <Setter Property="Template"> 40 <Setter.Value> 41 <ControlTemplate TargetType="{x:Type RepeatButton}"> 42 <Rectangle Fill="{TemplateBinding Background}" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}"/> 43 </ControlTemplate> 44 </Setter.Value> 45 </Setter> 46 </Style> 47 48 <!--滚动条上下按钮--> 49 <Style x:Key="VerticalScrollBarPageButton2" TargetType="{x:Type RepeatButton}"> 50 <Setter Property="OverridesDefaultStyle" Value="true"/> 51 <Setter Property="Background" Value="Transparent"/> 52 <Setter Property="Focusable" Value="false"/> 53 <Setter Property="IsTabStop" Value="false"/> 54 <Setter Property="Opacity" Value="0"/> 55 <Setter Property="Template"> 56 <Setter.Value> 57 <ControlTemplate TargetType="{x:Type RepeatButton}"> 58 <Rectangle Fill="#90000000" Width="0" Height="0"/> 59 </ControlTemplate> 60 </Setter.Value> 61 </Setter> 62 </Style> 63 <Style x:Key="for_scrollbar" TargetType="{x:Type ScrollBar}"> 64 <Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/> 65 <Setter Property="Stylus.IsFlicksEnabled" Value="false"/> 66 <Setter Property="Background" Value="Transparent"/> 67 <Setter Property="Margin" Value="0,1,1,6"/> 68 <Setter Property="Width" Value="10"/> 69 <Setter Property="MinWidth" Value="5"/> 70 <Setter Property="Opacity" Value="0.2"/> 71 <Setter Property="Template"> 72 <Setter.Value> 73 <ControlTemplate TargetType="{x:Type ScrollBar}"> 74 <Grid x:Name="Bg" SnapsToDevicePixels="true"> 75 <Grid.RowDefinitions> 76 <RowDefinition Height="auto"></RowDefinition> 77 <RowDefinition Height="*"></RowDefinition> 78 <RowDefinition Height="auto"></RowDefinition> 79 </Grid.RowDefinitions> 80 <RepeatButton Grid.Row="0" Style="{StaticResource VerticalScrollBarPageButton2}" Command="{x:Static ScrollBar.PageUpCommand}"/> 81 <Track x:Name="PART_Track" Grid.Row="1" IsEnabled="{TemplateBinding IsMouseOver}" IsDirectionReversed="true"> 82 <Track.DecreaseRepeatButton> 83 <RepeatButton Style="{StaticResource VerticalScrollBarPageButton}" Command="{x:Static ScrollBar.PageUpCommand}"/> 84 </Track.DecreaseRepeatButton> 85 <Track.IncreaseRepeatButton> 86 <RepeatButton Style="{StaticResource VerticalScrollBarPageButton}" Command="{x:Static ScrollBar.PageDownCommand}"/> 87 </Track.IncreaseRepeatButton> 88 <Track.Thumb> 89 <Thumb Style="{StaticResource ScrollBarThumb}"/> 90 </Track.Thumb> 91 </Track> 92 <RepeatButton Grid.Row="2" Style="{StaticResource VerticalScrollBarPageButton2}" Command="{x:Static ScrollBar.PageDownCommand}"/> 93 </Grid> 94 </ControlTemplate> 95 </Setter.Value> 96 </Setter> 97 <Style.Triggers> 98 <Trigger Property="Orientation" Value="Horizontal"> 99 <Setter Property="Background" Value="Transparent"/> 100 <Setter Property="Margin" Value="1,0,6,1"/> 101 <Setter Property="Height" Value="5"/> 102 <Setter Property="MinHeight" Value="5"/> 103 <Setter Property="Width" Value="Auto"/> 104 <Setter Property="Opacity" Value="0.2"/> 105 <Setter Property="Template"> 106 <Setter.Value> 107 <ControlTemplate TargetType="{x:Type ScrollBar}"> 108 <Grid x:Name="Bg" SnapsToDevicePixels="true"> 109 <Track x:Name="PART_Track" IsEnabled="{TemplateBinding IsMouseOver}"> 110 <Track.DecreaseRepeatButton> 111 <RepeatButton Style="{StaticResource HorizontalScrollBarPageButton}" Command="{x:Static ScrollBar.PageLeftCommand}"/> 112 </Track.DecreaseRepeatButton> 113 <Track.IncreaseRepeatButton> 114 <RepeatButton Style="{StaticResource HorizontalScrollBarPageButton}" Command="{x:Static ScrollBar.PageRightCommand}"/> 115 </Track.IncreaseRepeatButton> 116 <Track.Thumb> 117 <Thumb Style="{StaticResource ScrollBarThumb}"/> 118 </Track.Thumb> 119 </Track> 120 </Grid> 121 </ControlTemplate> 122 </Setter.Value> 123 </Setter> 124 </Trigger> 125 </Style.Triggers> 126 </Style> 127 <Style x:Key="for_scrollviewer" 128 TargetType="{x:Type ScrollViewer}"> 129 <Setter Property="BorderBrush" Value="LightGray"/> 130 <Setter Property="BorderThickness" Value="0"/> 131 <Setter Property="Template"> 132 <Setter.Value> 133 <ControlTemplate TargetType="{x:Type ScrollViewer}"> 134 <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True"> 135 <Grid Background="{TemplateBinding Background}"> 136 <ScrollContentPresenter Cursor="{TemplateBinding Cursor}" Margin="{TemplateBinding Padding}" ContentTemplate="{TemplateBinding ContentTemplate}"/> 137 <ScrollBar x:Name="PART_VerticalScrollBar" 138 HorizontalAlignment="Right" 139 Maximum="{TemplateBinding ScrollableHeight}" 140 Orientation="Vertical" 141 Style="{StaticResource for_scrollbar}" 142 ViewportSize="{TemplateBinding ViewportHeight}" 143 Value="{TemplateBinding VerticalOffset}" 144 Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"/> 145 <ScrollBar x:Name="PART_HorizontalScrollBar" 146 Maximum="{TemplateBinding ScrollableWidth}" 147 Orientation="Horizontal" 148 Style="{StaticResource for_scrollbar}" 149 VerticalAlignment="Bottom" 150 Value="{TemplateBinding HorizontalOffset}" 151 ViewportSize="{TemplateBinding ViewportWidth}" 152 Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/> 153 </Grid> 154 </Border> 155 <ControlTemplate.Triggers> 156 <EventTrigger RoutedEvent="ScrollChanged" > 157 <BeginStoryboard> 158 <Storyboard> 159 <DoubleAnimation 160 Storyboard.TargetName="PART_VerticalScrollBar" 161 Storyboard.TargetProperty="Opacity" 162 To="0.8" 163 Duration="0:0:1"/> 164 <DoubleAnimation 165 Storyboard.TargetName="PART_VerticalScrollBar" 166 Storyboard.TargetProperty="Opacity" 167 To="0.2" 168 Duration="0:0:1" 169 BeginTime="0:0:1"/> 170 <DoubleAnimation 171 Storyboard.TargetName="PART_HorizontalScrollBar" 172 Storyboard.TargetProperty="Opacity" 173 To="0.8" 174 Duration="0:0:1"/> 175 <DoubleAnimation 176 Storyboard.TargetName="PART_HorizontalScrollBar" 177 Storyboard.TargetProperty="Opacity" 178 To="0.2" 179 Duration="0:0:1" 180 BeginTime="0:0:1"/> 181 </Storyboard> 182 </BeginStoryboard> 183 </EventTrigger> 184 <EventTrigger RoutedEvent="MouseEnter" 185 SourceName="PART_VerticalScrollBar"> 186 <BeginStoryboard> 187 <Storyboard> 188 <DoubleAnimation 189 Storyboard.TargetName="PART_VerticalScrollBar" 190 Storyboard.TargetProperty="Opacity" 191 To="0.8" 192 Duration="0:0:0.7"/> 193 </Storyboard> 194 </BeginStoryboard> 195 </EventTrigger> 196 <EventTrigger RoutedEvent="MouseLeave" 197 SourceName="PART_VerticalScrollBar"> 198 <BeginStoryboard> 199 <Storyboard> 200 <DoubleAnimation 201 Storyboard.TargetName="PART_VerticalScrollBar" 202 Storyboard.TargetProperty="Opacity" 203 To="0.2" 204 Duration="0:0:0.7"/> 205 </Storyboard> 206 </BeginStoryboard> 207 </EventTrigger> 208 <EventTrigger RoutedEvent="MouseEnter" 209 SourceName="PART_HorizontalScrollBar"> 210 <BeginStoryboard> 211 <Storyboard> 212 <DoubleAnimation 213 Storyboard.TargetName="PART_HorizontalScrollBar" 214 Storyboard.TargetProperty="Opacity" 215 To="0.8" 216 Duration="0:0:0.7"/> 217 </Storyboard> 218 </BeginStoryboard> 219 </EventTrigger> 220 <EventTrigger RoutedEvent="MouseLeave" 221 SourceName="PART_HorizontalScrollBar"> 222 <BeginStoryboard> 223 <Storyboard> 224 <DoubleAnimation 225 Storyboard.TargetName="PART_HorizontalScrollBar" 226 Storyboard.TargetProperty="Opacity" 227 To="0.2" 228 Duration="0:0:0.7"/> 229 </Storyboard> 230 </BeginStoryboard> 231 </EventTrigger> 232 </ControlTemplate.Triggers> 233 </ControlTemplate> 234 </Setter.Value> 235 </Setter> 236 </Style> 237 238 239 </ResourceDictionary>
然后,在App.xaml里添加对资源文件的引用,<ResourceDictionary Source="pack://application:,,,/Resource/Scroll.xaml"/>。
最后,将控件样式修改为自定义样式, <Style TargetType="ScrollBar" BasedOn="{StaticResource for_scrollbar}"/>
<Style TargetType="ScrollViewer" BasedOn="{StaticResource for_scrollviewer}"/>。
这样整个项目中的控件就会都变成自己想要的样式了。