Search code examples
c#wpfxamltextbox

weird issue with scrollbars and... textboxes? (VerticalContentAlignment)


I have this strange problem and I don't understand what could be causing it. In my entire project, the textboxes are unable to center vertically, no matter what I use, padding, VerticalContentAlignment, or anything else you can think of, the horizontal works fine.

Then I though maybe a resource is interfering with my textboxes, so I started by removing one by one, until I found the resource that causes this problem, it's my custom scrollbar that I found on the internet, after reading it like 10 times, I just gave up. Can you guys help me to understand what part of this resource is causing this issue?

I want to clarify that this question should still be posted on stack overflow, because this post is not about the white rectangle, it was about a style that overrides textboxes styles, I also noticed that it can also affect the textbox ability to automatically scroll to the right when lots of text is written and hits the limit of the border, (it behave like TextWrapping="WrapWithOverflow") so be careful when creating scrollviewer/scrollbar styles, specially if you are still learning like me. Code:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <SolidColorBrush x:Key="StandardBorderBrush" Color="#888" />
    <SolidColorBrush x:Key="StandardBackgroundBrush" Color="Black" />
    <SolidColorBrush x:Key="HoverBorderBrush" Color="#DDD" />
    <SolidColorBrush x:Key="SelectedBackgroundBrush" Color="Gray" />
    <SolidColorBrush x:Key="SelectedForegroundBrush" Color="White" />
    <SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />
    <SolidColorBrush x:Key="GlyphBrush" Color="#444" />
    <SolidColorBrush x:Key="NormalBrush" Color="#888" />
    <SolidColorBrush x:Key="NormalBorderBrush" Color="#888" />
    <SolidColorBrush x:Key="HorizontalNormalBrush" Color="#C8C8C8" />
    <SolidColorBrush x:Key="HorizontalNormalBorderBrush" Color="#888" />

    <Style x:Key="ScrollBarLineButton" TargetType="RepeatButton">
        <Setter Property="Visibility" Value="Hidden" />
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="Focusable" Value="false" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="RepeatButton">
                    <Border Name="Border"
                        Margin="1"
                        CornerRadius="2"
                        Background="{StaticResource NormalBrush}"
                        BorderBrush="{StaticResource NormalBorderBrush}"
                        BorderThickness="1">
                        <Path HorizontalAlignment="Center"
                          VerticalAlignment="Center"
                          Fill="Blue"
                          Data="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter TargetName="Border" Property="Background" Value="Black" />
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="true">
                            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ScrollBarPageButton" TargetType="RepeatButton">
        <Setter Property="Visibility" Value="Visible" />
        <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="RepeatButton">
                    <Border Background="#1a000000" 
                        CornerRadius="5"
                        Width="5"
                            HorizontalAlignment="Right"
                        Margin="0, 0, 2, 0"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ScrollBarPageButtonHor" TargetType="RepeatButton">
        <Setter Property="Visibility" Value="Visible" />
        <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="RepeatButton">
                    <Border Background="#1a000000" 
                    CornerRadius="5"
                    Height="5"
                    VerticalAlignment="Center"
                    Margin="0, 0, 2, 0"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ScrollBarThumb" TargetType="Thumb">
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="Focusable" Value="false" />
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Thumb">
                    <Border CornerRadius="4"
                        Background="{DynamicResource ScrollBarColor}"
                        BorderBrush="{DynamicResource ScrollBarColor}"
                        BorderThickness="0"
                        Width="8"
                        Margin="8,0,-2,0" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ScrollBarThumbHor" TargetType="Thumb">
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="Focusable" Value="false" />
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Thumb">
                    <Border CornerRadius="4"
                        Background="{DynamicResource ScrollBarColor}"
                        BorderBrush="{DynamicResource ScrollBarColor}"
                        BorderThickness="0"
                        Height="8"
                        Margin="0,0,-2,0" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <ControlTemplate x:Key="VerticalScrollBar" TargetType="ScrollBar">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition MaxHeight="0" />
                <RowDefinition Height="0.00001*" />
                <RowDefinition MaxHeight="0" />
            </Grid.RowDefinitions>
            <Border Grid.RowSpan="3" CornerRadius="2" Background="Transparent" />
            <RepeatButton Grid.Row="0" Style="{StaticResource ScrollBarLineButton}" Height="18" Command="ScrollBar.LineUpCommand" Content="M 0 4 L 8 4 L 4 0 Z" />
            <Track 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" Background="LightBlue" BorderBrush="LightBlue" />
                </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="ScrollBar">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="0" />
                <ColumnDefinition Width="0.00001*" />
                <ColumnDefinition Width="0" />
            </Grid.ColumnDefinitions>
            <Border Grid.ColumnSpan="3" CornerRadius="3" Background="Transparent"/>
            <RepeatButton Grid.Column="0" Style="{StaticResource ScrollBarLineButton}" Width="18" Command="ScrollBar.LineLeftCommand" Content="M 4 0 L 4 8 L 0 4 Z" />
            <Track Name="PART_Track" Grid.Column="1" IsDirectionReversed="False">
                <Track.DecreaseRepeatButton>
                    <RepeatButton Style="{StaticResource ScrollBarPageButtonHor}" Command="ScrollBar.PageLeftCommand" />
                </Track.DecreaseRepeatButton>
                <Track.Thumb>
                    <Thumb Style="{StaticResource ScrollBarThumbHor}" Margin="0,1,0,1" Background="LightBlue" BorderBrush="LightBlue" />
                </Track.Thumb>
                <Track.IncreaseRepeatButton>
                    <RepeatButton Style="{StaticResource ScrollBarPageButtonHor}" Command="ScrollBar.PageRightCommand" />
                </Track.IncreaseRepeatButton>
            </Track>
            <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="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="12" />
                <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>

    <Style x:Key="FavsScrollViewer" TargetType="ScrollViewer">
        <Setter Property="OverridesDefaultStyle" Value="True" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ScrollViewer">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <ScrollContentPresenter Grid.Column="1" />
                        <ScrollBar Name="PART_VerticalScrollBar"
                               Value="{TemplateBinding VerticalOffset}"
                               Maximum="{TemplateBinding ScrollableHeight}"
                               ViewportSize="{TemplateBinding ViewportHeight}"
                               Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" />
                        <ScrollBar Name="PART_HorizontalScrollBar"
                               Orientation="Horizontal"
                               Grid.Row="1"
                               Grid.Column="1"
                               Value="{TemplateBinding HorizontalOffset}"
                               Maximum="{TemplateBinding ScrollableWidth}"
                               ViewportSize="{TemplateBinding ViewportWidth}"
                               Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="ScrollViewer">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ScrollViewer">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <ScrollContentPresenter Grid.Column="0" />
                        <ScrollBar x:Name="PART_VerticalScrollBar"
                               Grid.Row="0"
                               Grid.Column="1"
                               Value="{TemplateBinding VerticalOffset}"
                               Maximum="{TemplateBinding ScrollableHeight}"
                               ViewportSize="{TemplateBinding ViewportHeight}"
                               Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" />
                        <ScrollBar x:Name="PART_HorizontalScrollBar"
                               Orientation="Horizontal"
                               Grid.Row="1"
                               Grid.Column="0"
                               Value="{TemplateBinding HorizontalOffset}"
                               Maximum="{TemplateBinding ScrollableWidth}"
                               ViewportSize="{TemplateBinding ViewportWidth}"
                               Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>


Solution

  • It turns out that there is a rectangle in the scrollviewer called x:Name="Corner" that I didn't know about, after navigating the internet again, I found this question,That did fix my problem, by replacing the two last styles from my resource (I had initially added them because the resource I got from the internet had it, and it also solved that annoying problem of the empty square that was generated at the bottom right when the two scrollbars were visible) Now all textboxes align perfectly in the middle when I say so.

    This is the new style that I replaced:

    <Style TargetType="ScrollViewer">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ScrollViewer">
                    <Grid x:Name="Grid" Background="{TemplateBinding Background}">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Rectangle x:Name="Corner"
                    Grid.Column="1" Grid.Row="1"
                    Fill="Transparent"/>
                        <ScrollContentPresenter x:Name="PART_ScrollContentPresenter"
                                Grid.Column="0" Grid.Row="0"
                                CanContentScroll="{TemplateBinding CanContentScroll}"
                                CanHorizontallyScroll="False" CanVerticallyScroll="False"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                Content="{TemplateBinding Content}"
                                Margin="{TemplateBinding Padding}"/>
                        <ScrollBar x:Name="PART_VerticalScrollBar"
                    Grid.Column="1" Grid.Row="0"
                    AutomationProperties.AutomationId="VerticalScrollBar"
                    Cursor="Arrow"
                    Maximum="{TemplateBinding ScrollableHeight}" Minimum="0"
                    Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                    Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                    ViewportSize="{TemplateBinding ViewportHeight}"/>
                        <ScrollBar x:Name="PART_HorizontalScrollBar"
                    AutomationProperties.AutomationId="HorizontalScrollBar"
                    Cursor="Arrow"
                    Grid.Column="0" Grid.Row="1"
                    Maximum="{TemplateBinding ScrollableWidth}"
                    Minimum="0"
                    Orientation="Horizontal"
                    Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                    Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                    ViewportSize="{TemplateBinding ViewportWidth}"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    

    And the full resource:

    <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <SolidColorBrush x:Key="StandardBorderBrush" Color="#888" />
        <SolidColorBrush x:Key="StandardBackgroundBrush" Color="Black" />
        <SolidColorBrush x:Key="HoverBorderBrush" Color="#DDD" />
        <SolidColorBrush x:Key="SelectedBackgroundBrush" Color="Gray" />
        <SolidColorBrush x:Key="SelectedForegroundBrush" Color="White" />
        <SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />
        <SolidColorBrush x:Key="GlyphBrush" Color="#444" />
        <SolidColorBrush x:Key="NormalBrush" Color="#888" />
        <SolidColorBrush x:Key="NormalBorderBrush" Color="#888" />
        <SolidColorBrush x:Key="HorizontalNormalBrush" Color="#C8C8C8" />
        <SolidColorBrush x:Key="HorizontalNormalBorderBrush" Color="#888" />
    
        <Style x:Key="ScrollBarLineButton" TargetType="RepeatButton">
            <Setter Property="Visibility" Value="Hidden" />
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="OverridesDefaultStyle" Value="true" />
            <Setter Property="Focusable" Value="false" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="RepeatButton">
                        <Border Name="Border"
                            Margin="1"
                            CornerRadius="2"
                            Background="{StaticResource NormalBrush}"
                            BorderBrush="{StaticResource NormalBorderBrush}"
                            BorderThickness="1">
                            <Path HorizontalAlignment="Center"
                              VerticalAlignment="Center"
                              Fill="Blue"
                              Data="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsPressed" Value="true">
                                <Setter TargetName="Border" Property="Background" Value="Black" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="true">
                                <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    
        <Style x:Key="ScrollBarPageButton" TargetType="RepeatButton">
            <Setter Property="Visibility" Value="Visible" />
            <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="RepeatButton">
                        <Border Background="#1a000000" 
                            CornerRadius="5"
                            Width="5"
                                HorizontalAlignment="Right"
                            Margin="0, 0, 2, 0"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    
        <Style x:Key="ScrollBarPageButtonHor" TargetType="RepeatButton">
            <Setter Property="Visibility" Value="Visible" />
            <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="RepeatButton">
                        <Border Background="#1a000000" 
                        CornerRadius="5"
                        Height="5"
                        VerticalAlignment="Center"
                        Margin="0, 0, 2, 0"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    
        <Style x:Key="ScrollBarThumb" TargetType="Thumb">
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="OverridesDefaultStyle" Value="true" />
            <Setter Property="IsTabStop" Value="false" />
            <Setter Property="Focusable" Value="false" />
            <Setter Property="Cursor" Value="Hand"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Thumb">
                        <Border CornerRadius="4"
                            Background="{DynamicResource ScrollBarColor}"
                            BorderBrush="{DynamicResource ScrollBarColor}"
                            BorderThickness="0"
                            Width="8"
                            Margin="8,0,-2,0" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    
        <Style x:Key="ScrollBarThumbHor" TargetType="Thumb">
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="OverridesDefaultStyle" Value="true" />
            <Setter Property="IsTabStop" Value="false" />
            <Setter Property="Focusable" Value="false" />
            <Setter Property="Cursor" Value="Hand"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Thumb">
                        <Border CornerRadius="4"
                            Background="{DynamicResource ScrollBarColor}"
                            BorderBrush="{DynamicResource ScrollBarColor}"
                            BorderThickness="0"
                            Height="8"
                            Margin="0,0,-2,0" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    
        <ControlTemplate x:Key="VerticalScrollBar" TargetType="ScrollBar">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition MaxHeight="0" />
                    <RowDefinition Height="0.00001*" />
                    <RowDefinition MaxHeight="0" />
                </Grid.RowDefinitions>
                <Border Grid.RowSpan="3" CornerRadius="2" Background="Transparent" />
                <RepeatButton Grid.Row="0" Style="{StaticResource ScrollBarLineButton}" Height="18" Command="ScrollBar.LineUpCommand" Content="M 0 4 L 8 4 L 4 0 Z" />
                <Track 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" Background="LightBlue" BorderBrush="LightBlue" />
                    </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="ScrollBar">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="0" />
                    <ColumnDefinition Width="0.00001*" />
                    <ColumnDefinition Width="0" />
                </Grid.ColumnDefinitions>
                <Border Grid.ColumnSpan="3" CornerRadius="3" Background="Transparent"/>
                <RepeatButton Grid.Column="0" Style="{StaticResource ScrollBarLineButton}" Width="18" Command="ScrollBar.LineLeftCommand" Content="M 4 0 L 4 8 L 0 4 Z" />
                <Track Name="PART_Track" Grid.Column="1" IsDirectionReversed="False">
                    <Track.DecreaseRepeatButton>
                        <RepeatButton Style="{StaticResource ScrollBarPageButtonHor}" Command="ScrollBar.PageLeftCommand" />
                    </Track.DecreaseRepeatButton>
                    <Track.Thumb>
                        <Thumb Style="{StaticResource ScrollBarThumbHor}" Margin="0,1,0,1" Background="LightBlue" BorderBrush="LightBlue" />
                    </Track.Thumb>
                    <Track.IncreaseRepeatButton>
                        <RepeatButton Style="{StaticResource ScrollBarPageButtonHor}" Command="ScrollBar.PageRightCommand" />
                    </Track.IncreaseRepeatButton>
                </Track>
                <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="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="12" />
                    <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>
    
    
        <Style TargetType="ScrollViewer">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ScrollViewer">
                        <Grid x:Name="Grid" Background="{TemplateBinding Background}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <Rectangle x:Name="Corner"
                        Grid.Column="1" Grid.Row="1"
                        Fill="Transparent"/>
                            <ScrollContentPresenter x:Name="PART_ScrollContentPresenter"
                                    Grid.Column="0" Grid.Row="0"
                                    CanContentScroll="{TemplateBinding CanContentScroll}"
                                    CanHorizontallyScroll="False" CanVerticallyScroll="False"
                                    ContentTemplate="{TemplateBinding ContentTemplate}"
                                    Content="{TemplateBinding Content}"
                                    Margin="{TemplateBinding Padding}"/>
                            <ScrollBar x:Name="PART_VerticalScrollBar"
                        Grid.Column="1" Grid.Row="0"
                        AutomationProperties.AutomationId="VerticalScrollBar"
                        Cursor="Arrow"
                        Maximum="{TemplateBinding ScrollableHeight}" Minimum="0"
                        Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                        Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                        ViewportSize="{TemplateBinding ViewportHeight}"/>
                            <ScrollBar x:Name="PART_HorizontalScrollBar"
                        AutomationProperties.AutomationId="HorizontalScrollBar"
                        Cursor="Arrow"
                        Grid.Column="0" Grid.Row="1"
                        Maximum="{TemplateBinding ScrollableWidth}"
                        Minimum="0"
                        Orientation="Horizontal"
                        Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                        Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                        ViewportSize="{TemplateBinding ViewportWidth}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>