BlackBox
BlackBox

Reputation: 2233

WPF - Increase scrollbar width of existing style

I'm currently using MahApps.Metro to style my WPF controls. When I add a ScrollViewer to components the MahApps.Metro style is used, but while I like the style, the width of the scrollbar (vertical) isn't suitable for my needs. Could someone suggest a way to increase the width of an existing style (from a library, although source is available on github)?

I've tried using:

<Style TargetType="ScrollBar"><Setter Property="Width" Value="50"/></Style>

but it reverts the MahApps.Metro style back to the WPF default, but with thicker scrollbars. After this, I tried using:

<sys:Double x:Key="{x:Static SystemParameters.VerticalScrollBarWidthKey}">100</sys:Double>

but it seemed to have no visual effect.

Upvotes: 3

Views: 2932

Answers (2)

CAD bloke
CAD bloke

Reputation: 8798

Building on Mike Strobel's answer, and in the best copy-paste traditions, here is how I got it to work ...

<ScrollViewer
    Name="scrlMain"
    VerticalAlignment="Stretch"
    CanContentScroll="True"
    HorizontalScrollBarVisibility="Auto"
    VerticalScrollBarVisibility="Auto" >
    <ScrollViewer.Resources>
        <system:Double  x:Key="MetroScrollBarWidth">20</system:Double>
    </ScrollViewer.Resources>

Upvotes: 0

Mike Strobel
Mike Strobel

Reputation: 25623

It looks like their ScrollBar style overrides the width and height with different resource keys:

<Style.Triggers>
    <Trigger Property="Orientation"
             Value="Horizontal">
        <Setter Property="Height"
                Value="{DynamicResource MetroScrollBarHeight}" />
        <!-- ... -->
    </Trigger>
    <Trigger Property="Orientation"
             Value="Vertical">
        <Setter Property="Width"
                Value="{DynamicResource MetroScrollBarWidth}" />
        <!-- ... -->
    </Trigger>
</Style.Triggers>

Try dropping in a resource override like you did before, but use their custom resource key instead:

<sys:Double x:Key="MetroScrollBarWidth">100</sys:Double>

Upvotes: 7

Related Questions