ControlTemplate in WPF ——ScrollBar

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

  <ResourceDictionary.MergedDictionaries>
    <ResourceDictionary Source="Shared.xaml" />
  </ResourceDictionary.MergedDictionaries>

  <!--<SnippetScrollBar>-->
  <!--<SnippetRepeatButton>-->
  <Style x:Key="ScrollBarLineButton"
         TargetType="{x:Type RepeatButton}">
    <Setter Property="SnapsToDevicePixels"
            Value="True" />
    <Setter Property="OverridesDefaultStyle"
            Value="true" />
    <Setter Property="Focusable"
            Value="false" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type RepeatButton}">
          <Border x:Name="Border"
                  Margin="1"
                  CornerRadius="2"
                  BorderThickness="1">
            <Border.BorderBrush>
              <LinearGradientBrush StartPoint="0,0"
                                   EndPoint="0,1">
                <LinearGradientBrush.GradientStops>
                  <GradientStopCollection>
                    <GradientStop Color="{DynamicResource BorderMediumColor}"
                                  Offset="0.0" />
                    <GradientStop Color="{DynamicResource BorderDarkColor}"
                                  Offset="1.0" />
                  </GradientStopCollection>
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>
            </Border.BorderBrush>
            <Border.Background>
              <LinearGradientBrush StartPoint="0,0"
                                   EndPoint="0,1">
                <LinearGradientBrush.GradientStops>
                  <GradientStopCollection>
                    <GradientStop Color="{DynamicResource ControlLightColor}"/>
                    <GradientStop Color="{DynamicResource ControlMediumColor}"
                                  Offset="1.0" />
                  </GradientStopCollection>
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>
            </Border.Background>
            <VisualStateManager.VisualStateGroups>
              <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal" />
                <VisualState x:Name="MouseOver" />
                <VisualState x:Name="Pressed">
                  <Storyboard>
                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                                  Storyboard.TargetProperty="(Panel.Background).
                      (GradientBrush.GradientStops)[1].(GradientStop.Color)">
                      <EasingColorKeyFrame KeyTime="0"
                                           Value="{StaticResource ControlPressedColor}" />
                    </ColorAnimationUsingKeyFrames>
                  </Storyboard>
                </VisualState>
                <VisualState x:Name="Disabled">
                  <Storyboard>
                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="Arrow"
                                                  Storyboard.TargetProperty="(Shape.Fill).
                      (SolidColorBrush.Color)">
                      <EasingColorKeyFrame KeyTime="0"
                                           Value="{StaticResource DisabledForegroundColor}" />
                    </ColorAnimationUsingKeyFrames>
                  </Storyboard>
                </VisualState>
              </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Path x:Name="Arrow"
                  HorizontalAlignment="Center"
                  VerticalAlignment="Center"
                  Data="{Binding Content, 
              RelativeSource={RelativeSource TemplatedParent}}" >
                <Path.Fill>
                    <SolidColorBrush Color="{DynamicResource GlyphColor}"/>
                </Path.Fill>
            </Path>
          </Border>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
  <!--</SnippetRepeatButton>-->

  <Style x:Key="ScrollBarPageButton"
         TargetType="{x:Type RepeatButton}">
    <Setter Property="SnapsToDevicePixels"
            Value="True" />
    <Setter Property="OverridesDefaultStyle"
            Value="true" />
    <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="ScrollBarThumb"
         TargetType="{x:Type Thumb}">
    <Setter Property="SnapsToDevicePixels"
            Value="True" />
    <Setter Property="OverridesDefaultStyle"
            Value="true" />
    <Setter Property="IsTabStop"
            Value="false" />
    <Setter Property="Focusable"
            Value="false" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Thumb}">
          <Border CornerRadius="2"
                  Background="{TemplateBinding Background}"
                  BorderBrush="{TemplateBinding BorderBrush}"
                  BorderThickness="1" />
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <ControlTemplate x:Key="VerticalScrollBar"
                   TargetType="{x:Type ScrollBar}">
    <Grid>
      <Grid.RowDefinitions>
        <RowDefinition MaxHeight="18" />
        <RowDefinition Height="0.00001*" />
        <RowDefinition MaxHeight="18" />
      </Grid.RowDefinitions>
      <Border Grid.RowSpan="3"
              CornerRadius="2"
              Background="#F0F0F0" />
      <RepeatButton Grid.Row="0"
                    Style="{StaticResource ScrollBarLineButton}"
                    Height="18"
                    Command="ScrollBar.LineUpCommand"
                    Content="M 0 4 L 8 4 L 4 0 Z" />
      <Track x:Name="PART_Track"
             Grid.Row="1"
             IsDirectionReversed="true">
        <Track.DecreaseRepeatButton>
          <RepeatButton Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageUpCommand" />
        </Track.DecreaseRepeatButton>
        <Track.Thumb>
          <Thumb Style="{StaticResource ScrollBarThumb}"
                 Margin="1,0,1,0">
            <Thumb.BorderBrush>

              <LinearGradientBrush StartPoint="0,0"
                                   EndPoint="1,0">
                <LinearGradientBrush.GradientStops>
                  <GradientStopCollection>
                    <GradientStop Color="{DynamicResource BorderLightColor}"
                                  Offset="0.0" />
                    <GradientStop Color="{DynamicResource BorderDarkColor}"
                                  Offset="1.0" />
                  </GradientStopCollection>
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>

            </Thumb.BorderBrush>
            <Thumb.Background>

              <LinearGradientBrush StartPoint="0,0"
                                   EndPoint="1,0">
                <LinearGradientBrush.GradientStops>
                  <GradientStopCollection>
                    <GradientStop Color="{DynamicResource ControlLightColor}"
                                  Offset="0.0" />
                    <GradientStop Color="{DynamicResource ControlMediumColor}"
                                  Offset="1.0" />
                  </GradientStopCollection>
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>

            </Thumb.Background>
          </Thumb>
        </Track.Thumb>
        <Track.IncreaseRepeatButton>
          <RepeatButton Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageDownCommand" />
        </Track.IncreaseRepeatButton>
      </Track>
      <RepeatButton Grid.Row="3"
                    Style="{StaticResource ScrollBarLineButton}"
                    Height="18"
                    Command="ScrollBar.LineDownCommand"
                    Content="M 0 0 L 4 4 L 8 0 Z" />
    </Grid>
  </ControlTemplate>

  <ControlTemplate x:Key="HorizontalScrollBar"
                   TargetType="{x:Type ScrollBar}">
    <Grid>
      <Grid.ColumnDefinitions>
        <ColumnDefinition MaxWidth="18" />
        <ColumnDefinition Width="0.00001*" />
        <ColumnDefinition MaxWidth="18" />
      </Grid.ColumnDefinitions>
      <Border Grid.ColumnSpan="3"
              CornerRadius="2"
              Background="#F0F0F0" />
      <RepeatButton Grid.Column="0"
                    Style="{StaticResource ScrollBarLineButton}"
                    Width="18"
                    Command="ScrollBar.LineLeftCommand"
                    Content="M 4 0 L 4 8 L 0 4 Z" />
      <!--<SnippetRepeatButtonStyle_a_lileib>-->
      <Track x:Name="PART_Track"
             Grid.Column="1"
             IsDirectionReversed="False">
        <Track.DecreaseRepeatButton>
          <RepeatButton Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageLeftCommand" />
        </Track.DecreaseRepeatButton>
        <Track.Thumb>
          <Thumb Style="{StaticResource ScrollBarThumb}"
                 Margin="0,1,0,1">

            <Thumb.BorderBrush>

              <LinearGradientBrush StartPoint="0,0"
                                   EndPoint="1,0">
                <LinearGradientBrush.GradientStops>
                  <GradientStopCollection>
                    <GradientStop Color="{DynamicResource BorderLightColor}"
                                  Offset="0.0" />
                    <GradientStop Color="{DynamicResource BorderDarkColor}"
                                  Offset="1.0" />
                  </GradientStopCollection>
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>

            </Thumb.BorderBrush>
            <Thumb.Background>

              <LinearGradientBrush StartPoint="0,0"
                                   EndPoint="0,1">
                <LinearGradientBrush.GradientStops>
                  <GradientStopCollection>
                    <GradientStop Color="{DynamicResource ControlLightColor}"
                                  Offset="0.0" />
                    <GradientStop Color="{DynamicResource ControlMediumColor}"
                                  Offset="1.0" />
                  </GradientStopCollection>
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>

            </Thumb.Background>
          </Thumb>
        </Track.Thumb>
        <Track.IncreaseRepeatButton>
          <RepeatButton Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageRightCommand" />
        </Track.IncreaseRepeatButton>
      </Track>
      <!--</SnippetRepeatButtonStyle_a_lileib>-->
      <RepeatButton Grid.Column="3"
                    Style="{StaticResource ScrollBarLineButton}"
                    Width="18"
                    Command="ScrollBar.LineRightCommand"
                    Content="M 0 0 L 4 4 L 0 8 Z" />
    </Grid>
  </ControlTemplate>

  <Style x:Key="{x:Type ScrollBar}"
         TargetType="{x:Type ScrollBar}">
    <Setter Property="SnapsToDevicePixels"
            Value="True" />
    <Setter Property="OverridesDefaultStyle"
            Value="true" />
    <Style.Triggers>
      <Trigger Property="Orientation"
               Value="Horizontal">
        <Setter Property="Width"
                Value="Auto" />
        <Setter Property="Height"
                Value="18" />
        <Setter Property="Template"
                Value="{StaticResource HorizontalScrollBar}" />
      </Trigger>
      <Trigger Property="Orientation"
               Value="Vertical">
        <Setter Property="Width"
                Value="18" />
        <Setter Property="Height"
                Value="Auto" />
        <Setter Property="Template"
                Value="{StaticResource VerticalScrollBar}" />
      </Trigger>
    </Style.Triggers>
  </Style>
  <!--</SnippetScrollBar>-->
</ResourceDictionary>

 

posted @ 2017-08-22 10:56  天王星天  阅读(282)  评论(0编辑  收藏  举报