Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to increase scrollbar width in WPF ScrollViewer?

I am working on a touch screen on a small device and the custom width of the scroll-bar is no good as one of my requirements is that everything needs to be doable by finger gestures.

How can I set the width of the WPF ScrollViewer scrollbar?

Note that I don't wanna change the width of all the scrollbars on the device (doable through windows settings) - only the ones in my app.

like image 493
JohnIdol Avatar asked Aug 24 '09 09:08

JohnIdol


People also ask

How do I make my scrollbar wider?

Double-click/tap on ScrollHeight. The Edit String window will open with the default value of -255. That is the standard size of the scrollbars you see on Windows. To change the Scrollbars height to your liking, enter a value between -120 (smaller) to -1500 (larger) for the size you want, and click/tap on OK.

How do I change the scrollbar size?

The scrollbar-width property is used to set the width or thickness of an element's scrollbar when shown. This property can be used on pages where the user interface requires the element to be displayed more prominently and shrinking the scrollbar width gives more space to the element.


2 Answers

The ScrollBar template reaches out for system parameters to determine its width/height (depending on orientation). Therefore, you can override those parameters:

<ScrollViewer>     <ScrollViewer.Resources>         <sys:Double x:Key="{x:Static SystemParameters.VerticalScrollBarWidthKey}">100</sys:Double>     </ScrollViewer.Resources> </ScrollViewer> 
like image 114
Kent Boogaart Avatar answered Sep 24 '22 07:09

Kent Boogaart


Kent's answer can also be applied to easily all scrollbars in your application by placing it in your App.xaml resources, and by specifying the horizontal height key as well.

<Application     xmlns:sys="clr-namespace:System;assembly=mscorlib"     ... >     <Application.Resources>         <sys:Double x:Key="{x:Static SystemParameters.VerticalScrollBarWidthKey}">50</sys:Double>         <sys:Double x:Key="{x:Static SystemParameters.HorizontalScrollBarHeightKey}">50</sys:Double>     </Application.Resources> </Application> 
like image 26
DuckMaestro Avatar answered Sep 20 '22 07:09

DuckMaestro