（旧）ScrollBarのStyleをカスタマイズ

ScrollViewerのスタイルをいじってみる。

2018/11/05 現在：ScrollViewerのStyleを作成して，x:Key = {StaticResource {x:Type ScrollViewer}} とすると，テキストボックスで不具合が起きたり，DataGridではデフォルトの見た目になっていた。
対処法を別記事にまとめる。

構成

リソースディクショナを作成する。

ScrollViewer.xamlを作成した。
これだけでは変わらない。

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

    <Style TargetType="{x:Type ScrollViewer}" x:Key="OnlyRadiusScrollViewerStyle">
        <Setter Property="Background" Value="Aqua"/>
    </Style>

</ResourceDictionary>

クライアント側での参照

    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/StandardWindow;component/Object/.../.../ScrollViewer.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>        
    </Window.Resources>
    
    <ScrollViewer
        Grid.Row="2"
        HorizontalScrollBarVisibility="Auto"
        VerticalScrollBarVisibility="Auto"
        Style="{StaticResource ResourceKey=OnlyRadiusScrollViewerStyle}">
        <DataGrid/>
    </ScrollViewer>

基本のテンプレートをコピペして編集

以下のURLよりコピー&ペーストすると良いはず。
また，ScrollBarやRepeateButtonなどのスタイルも必要になる。
ScrollViewer のスタイルとテンプレート | Microsoft Docs

以下のを参考にカスタマイズ

今回は以下のサンプルを参考にカスタマイズした。
コメントがあるので分かりやすい。
[WPF] WPF でスクロールバーのデザインをカスタマイズ - ぐーたら書房

完成

Mac風のスクロールバーが完成。
RepeatButtonは消している。

<!--ScrollViewer.xaml-->
<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:sys="clr-namespace:System;assembly=mscorlib">

    <!-- ///////////////////////////////////////////////////// -->
    <!-- PropertyValue Style -->
    
    <!-- ScrollBarコントロールの幅 -->
    <sys:Double x:Key="ScrollBarSize">15</sys:Double>
    <!-- つまみの幅 -->
    <sys:Double x:Key="ThumbSize">8</sys:Double>
    <!-- ScrollBarコントロールのマージン -->
    <sys:Double x:Key="ScrollBarMarginSize">0</sys:Double>
    <!-- トラック（レーン）の色 -->
    <SolidColorBrush x:Key="ScrollBarTrackBrush" Color="{DynamicResource ContentBackground}" />
    <!-- スクロールバーの色-->
    <SolidColorBrush x:Key="ThumbBrush" Color="{DynamicResource Border}" />
    <!-- ボーダーの色 -->
    <SolidColorBrush x:Key="ScrollBarBorderBrush" Color="{DynamicResource Border}" />

    
    <!-- ///////////////////////////////////////////////////// -->
    <!-- Thumb(つまみ) Style -->

    <!-- つまみのスタイル -->
    <Style x:Key="ScrollBarThumbStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Border CornerRadius="4"  Background="{StaticResource ThumbBrush}" BorderBrush="{StaticResource ScrollBarBorderBrush}" BorderThickness="1" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    
    <!-- ///////////////////////////////////////////////////// -->
    <!-- ScrollBar Style -->

    <!-- 角丸のスクロールバー（RepeateButtonなし）のスタイル -->
    <Style x:Key="OnlyRadiusScrollBar" TargetType="{x:Type ScrollBar}">
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Style.Triggers>
            <!-- 縦向きのスクロールバー -->
            <Trigger Property="Orientation" Value="Vertical">
                <Setter Property="Width" Value="{StaticResource ScrollBarSize}"/>
                <Setter Property="Height" Value="Auto" />
                <Setter Property="Margin">
                    <Setter.Value>
                        <Thickness Left="{StaticResource ScrollBarMarginSize}" Top="{StaticResource ScrollBarMarginSize}" Right="{StaticResource ScrollBarMarginSize}" Bottom="{StaticResource ScrollBarMarginSize}" />
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Border CornerRadius="0" Background="{StaticResource ScrollBarTrackBrush}">
                                <Grid>
                                    <Track x:Name="PART_Track" IsDirectionReversed="true">
                                        <Track.Thumb>
                                            <Thumb Style="{StaticResource ScrollBarThumbStyle}"  Width="{StaticResource ThumbSize}" Margin="0,1"/>
                                        </Track.Thumb>
                                    </Track>
                                </Grid>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
            <!-- 横向きのスクロールバー -->
            <Trigger Property="Orientation" Value="Horizontal">
                <Setter Property="Width" Value="Auto"/>
                <Setter Property="Height" Value="{StaticResource ScrollBarSize}" />
                <Setter Property="Margin">
                    <Setter.Value>
                        <Thickness Left="{StaticResource ScrollBarMarginSize}" Top="{StaticResource ScrollBarMarginSize}" Right="{StaticResource ScrollBarMarginSize}" Bottom="{StaticResource ScrollBarMarginSize}" />
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Border CornerRadius="0" Background="{StaticResource ScrollBarTrackBrush}">
                                <Grid>
                                    <Track x:Name="PART_Track" IsDirectionReversed="false">
                                        <Track.Thumb>
                                            <Thumb Style="{StaticResource ScrollBarThumbStyle}" Height="{StaticResource ThumbSize}" Margin="1,0"/>
                                        </Track.Thumb>
                                    </Track>
                                </Grid>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
    </Style>

    
    
    <!-- ///////////////////////////////////////////////////// -->
    <!-- ScrollViewer Style -->

    <!-- 角丸のScrollViewer （RepeateButtonなし）のスタイル -->
    <Style x:Key="OnlyRadiusScrollViewerStyle" TargetType="{x:Type ScrollViewer}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ScrollViewer}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <ScrollContentPresenter Grid.Column="0" Grid.Row="0">
                            <ScrollContentPresenter.Margin>
                                <Thickness Left="{StaticResource ScrollBarMarginSize}" Top="{StaticResource ScrollBarMarginSize}" Right="{StaticResource ScrollBarMarginSize}" Bottom="{StaticResource ScrollBarMarginSize}" />
                            </ScrollContentPresenter.Margin>
                        </ScrollContentPresenter>
                        <ScrollBar
                            x:Name="PART_VerticalScrollBar"
                            Grid.Column="1"
                            Grid.Row="0"
                            Orientation="Vertical"
                            Value="{TemplateBinding VerticalOffset}"
                            Maximum="{TemplateBinding ScrollableHeight}" 
                            ViewportSize="{TemplateBinding ViewportHeight}" 
                            Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" 
                            Style="{StaticResource OnlyRadiusScrollBar}"/>
                        <ScrollBar
                            x:Name="PART_HorizontalScrollBar"
                            Grid.Column="0"
                            Grid.Row="1"
                            Orientation="Horizontal"
                            Value="{TemplateBinding HorizontalOffset}"
                            Maximum="{TemplateBinding ScrollableWidth}"
                            ViewportSize="{TemplateBinding ViewportWidth}"
                            Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                            Style="{StaticResource OnlyRadiusScrollBar}"/>
                        <Border Grid.Column="1" Grid.Row="1" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</ResourceDictionary>