WPF自定义滚动条

我修改了一些地方，部分代码参考了博主 https://www.cnblogs.com/xiaomingg/

<!-- ScrollViewer 滚动条 -->

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

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

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

<Setter Property="Template">

<Setter.Value>

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

<Grid>

<!--滚动条颜色-->

<Border Background="#959595" BorderThickness="0" BorderBrush="Transparent" CornerRadius="0,0,0,0"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

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

<Setter Property="OverridesDefaultStyle" Value="true"/>

<Setter Property="Background" Value="#EDEDED"/>

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

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

<Setter Property="Template">

<Setter.Value>

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

<Rectangle Fill="{TemplateBinding Background}"/>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

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

<Setter Property="OverridesDefaultStyle" Value="true"/>

<Setter Property="Background" Value="#EDEDED"/>

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

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

<Setter Property="Template">

<Setter.Value>

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

<Rectangle Fill="{TemplateBinding Background}"/>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

<Style x:Key="for_scrollbar" TargetType="{x:Type ScrollBar}">

<Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>

<Setter Property="Stylus.IsFlicksEnabled" Value="false"/>

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

<Setter Property="Template">

<Setter.Value>

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

<Grid x:Name="Bg" SnapsToDevicePixels="true">

<Grid.RowDefinitions>

<RowDefinition Height="auto" MinHeight="7"></RowDefinition>

<RowDefinition Height="*"></RowDefinition>

<RowDefinition Height="auto" MinHeight="7"></RowDefinition>

</Grid.RowDefinitions>

<RepeatButton Grid.Row="0" Style="{StaticResource VerticalScrollBarPageButton}" Command="{x:Static ScrollBar.PageUpCommand}"/>

<Track x:Name="PART_Track" Grid.Row="1" IsEnabled="{TemplateBinding IsMouseOver}" IsDirectionReversed="true">

<Track.DecreaseRepeatButton>

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

</Track.DecreaseRepeatButton>

<Track.IncreaseRepeatButton>

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

</Track.IncreaseRepeatButton>

<Track.Thumb>

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

</Track.Thumb>

</Track>

<RepeatButton Grid.Row="2" Style="{StaticResource VerticalScrollBarPageButton}" Command="{x:Static ScrollBar.PageDownCommand}"/>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

<Style.Triggers>

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

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

<Setter Property="Width" Value="Auto"/>

<Setter Property="Template">

<Setter.Value>

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

<Grid x:Name="Bg" SnapsToDevicePixels="true">

<Track x:Name="PART_Track" IsEnabled="{TemplateBinding IsMouseOver}">

<Track.DecreaseRepeatButton>

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

</Track.DecreaseRepeatButton>

<Track.IncreaseRepeatButton>

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

</Track.IncreaseRepeatButton>

<Track.Thumb>

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

</Track.Thumb>

</Track>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Trigger>

</Style.Triggers>

</Style>

<Style x:Key="for_scrollviewer"

TargetType="{x:Type ScrollViewer}">

<Setter Property="Template">

<Setter.Value>

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

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True">

<Grid Background="{TemplateBinding Background}">

<ScrollContentPresenter Cursor="{TemplateBinding Cursor}" Margin="{TemplateBinding Padding}" ContentTemplate="{TemplateBinding ContentTemplate}"/>

<ScrollBar x:Name="PART_VerticalScrollBar"

HorizontalAlignment="Right"

Maximum="{TemplateBinding ScrollableHeight}"

Orientation="Vertical"

Style="{StaticResource for_scrollbar}"

ViewportSize="{TemplateBinding ViewportHeight}"

Value="{TemplateBinding VerticalOffset}"

Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"

/>

<ScrollBar x:Name="PART_HorizontalScrollBar"

Maximum="{TemplateBinding ScrollableWidth}"

Orientation="Horizontal"

VerticalAlignment="Bottom"

Style="{StaticResource for_scrollbar}"

Value="{TemplateBinding HorizontalOffset}"

ViewportSize="{TemplateBinding ViewportWidth}"

Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"

/>

</Grid>

</Border>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

<!--默认ScrollBar-->

<Style TargetType="ScrollBar" BasedOn="{StaticResource for_scrollbar}"/>

<!--默认ScrollView-->

<Style TargetType="ScrollViewer" BasedOn="{StaticResource for_scrollviewer}"/>