How to reduce the width of WPF datagrid vertical scrollbar?

Question

When I put a large value it does get bigger. But when I put a smaller value like 5 as in this code, it doesn't go any smaller than the default. How can I change this?

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace test
{
    public partial class MainWindow : Window
    {
        public event PropertyChangedEventHandler PropertyChanged;
        protected void SetField<T> ( ref T field, T value, string propertyName )
        {
            if ( !EqualityComparer<T>.Default.Equals ( field, value ) )
            {
                field = value;
                PropertyChanged?.Invoke ( this, new PropertyChangedEventArgs ( propertyName ) );
            }
        }

        ObservableCollection<Coin> _coins;
        public ObservableCollection<Coin> Coins { get => _coins; set => SetField ( ref _coins, value, nameof ( _coins ) ); }
        public ICollectionView CollectionView;

        public MainWindow ( )
        {
            this.Coins = new ObservableCollection<Coin> ( );
            this.Coins.Add ( new Coin ( "Coin 1" ) );
            this.Coins.Add ( new Coin ( "Coin 2" ) );
            this.Coins.Add ( new Coin ( "Coin 3" ) );
            this.Coins.Add ( new Coin ( "Coin 4" ) );
            this.Coins.Add ( new Coin ( "Coin 5" ) );
            this.Coins.Add ( new Coin ( "Coin 5" ) );
            this.Coins.Add ( new Coin ( "Coin 5" ) );
            this.Coins.Add ( new Coin ( "Coin 5" ) );
            this.Coins.Add ( new Coin ( "Coin 5" ) );
            this.Coins.Add ( new Coin ( "Coin 5" ) );
            this.Coins.Add ( new Coin ( "Coin 5" ) );

            this.DataContext = this;

            InitializeComponent ( );
        }
    }

    public class Coin
    {
        public string Symbol { get; set; }
        public SolidColorBrush Color2 { get; set; }

        public Coin ( string symbol )
        {
            this.Symbol = symbol;
            this.Color2 = new SolidColorBrush ( Color.FromRgb ( 0, 200, 0 ) );
        }
    }
}

Xaml:

<Window x:Class="test.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:test"
        mc:Ignorable="d"
        SizeToContent="Width"
        DataContext="{Binding RelativeSource={RelativeSource Self}}"
        Title="test"
        WindowStyle="None"
        AllowsTransparency="True"
        Topmost="True"
        Height="100">

    <Window.Resources>

        <Style x:Key="DataGridColumnSeparatorStyle" TargetType="DataGridCell">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Rectangle VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Fill="Red"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="DataGridColumnAlarmStyle" TargetType="DataGridCell">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Rectangle VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Fill="#000000"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>




        <Style TargetType="DataGridCell">
            <Setter Property="TextBlock.TextAlignment" Value="Center" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridCell}">
                        <Grid Background="{TemplateBinding Background}">
                            <ContentPresenter VerticalAlignment="Stretch"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="VerticalAlignment" Value="Stretch"/>
            <Setter Property="Padding" Value="0"/>
            <Setter Property="Margin" Value="0"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />

            <Style.Triggers>
                <MultiDataTrigger>
                    <MultiDataTrigger.Conditions>
                        <Condition Binding="{Binding Column.Header, RelativeSource={RelativeSource Self}}" Value="Symbol"/>
                    </MultiDataTrigger.Conditions>
                    <MultiDataTrigger.Setters>
                        <Setter Property="DataGridCell.Background" Value="{Binding Path=Color2}" />
                    </MultiDataTrigger.Setters>
                </MultiDataTrigger>

            </Style.Triggers>
        </Style>

        <Style TargetType="DataGridColumnHeader">
            <Setter Property="HorizontalContentAlignment" Value="Center" />
        </Style>

        <Style x:Key="RowStyleWithAlternation" TargetType="DataGridRow">
            <Setter Property="Background" Value="DarkKhaki"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontWeight" Value="Normal"/>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="BorderBrush" Value="DarkMagenta" />
                    <Setter Property="BorderThickness" Value="2" />
                    <Setter Property="Background" Value="Yellow"/>
                </Trigger>
            </Style.Triggers>
        </Style>

    </Window.Resources>

    <Grid>
        <DataGrid Name="dataGrid" ItemsSource="{Binding Coins}" SelectionMode="Single" GridLinesVisibility="None" HorizontalScrollBarVisibility="Hidden" RowHeaderWidth="0" IsReadOnly="True" CanUserAddRows="False" CanUserResizeColumns="False" CanUserResizeRows="False" AutoGenerateColumns="False" RowStyle="{StaticResource RowStyleWithAlternation}">
            <DataGrid.Resources>
                <Style TargetType="ScrollBar">
                    <Style.Triggers>
                        <Trigger Property="Orientation" Value="Vertical">
                            <Setter Property="Width" Value="5"/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </DataGrid.Resources>

            <DataGrid.Columns>

                <DataGridTemplateColumn Header=" " MinWidth="0" Width="10" CanUserSort="False"/>

                <DataGridTemplateColumn MinWidth="0" Width="2" CellStyle="{StaticResource DataGridColumnSeparatorStyle}"/>
                <DataGridTextColumn Header="Symbol" Width="64" Binding="{Binding Path=Symbol}" />

                <DataGridTemplateColumn MinWidth="0" Width="2" CellStyle="{StaticResource DataGridColumnSeparatorStyle}" CanUserSort="False"/>

                <DataGridTextColumn Header="PNL %" Width="64" Binding="{Binding Path=Color}"/>

                <DataGridTextColumn Width="64" Binding="{Binding Path=PriceChangeInPercentDailyDisplay}">
                    <DataGridTextColumn.Header>
                        <TextBlock Text="Profit"/>
                    </DataGridTextColumn.Header>
                </DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>

</Window>

Answer 1

Based on this response you can set the vertical scroll bar Width with a style that have a TargetType set to ScrollBar and use a trigger on the orientation to only affect the vertical ones. To reduce the width, you have to set the MinWidth property too:

<DataGrid.Resources>
    <Style TargetType="ScrollBar">
        <Style.Triggers>
            <Trigger Property="Orientation" Value="Vertical">
                <Setter Property="Width" Value="5" />
                <Setter Property="MinWidth" Value="5" />
            </Trigger>
        </Style.Triggers>
    </Style>
</DataGrid.Resources>

Edit:

An other solution based on this response is to modify the SystemParameters.VerticalScrollBarWidth property:

<DataGrid.Resources>
    <system:Double x:Key="{x:Static SystemParameters.VerticalScrollBarWidthKey}">5</system:Double>
</DataGrid.Resources>