Reputation: 2233
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
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
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