CODEWITHSUNDEEP
xamlwindows-runtimeuwp
AbsoluteSith
AbsoluteSith

Reputation: 1967

How to set the width of the scrollbar inside a ScrollViewer in UWP?

I have a ComboBox with thousands of items bound to it.

The problem I'm facing is when I run the app on a tablet the scrollviewer's scrollbar is very thin hence I cannot hold and drag it and can only swipe to move inside the ComboBox.enter image description here

Hence I was wondering is there a way to change the style template of the ScrollViewer inside the ComboBox inorder to make the ScrollBar width larger.

Upvotes: 0

Views: 2242

Answers (1)

Chris W.
Chris W.

Reputation: 23280

You'll have to dig in to the style template and change some hard set properties for Width / Height that sit on the parts like the Thumb that you will find on the default style template. You can extract a copy via selecting a Scrollbar -> Right Click -> Edit Style -> Edit a copy. Save the copy wherever you need it, like a resource dictionary if you plan to use it multiple places or to the instance where you need it.

(Note: Generally folks start at the ScrollViewer level, then find a Scrollbar in it, and apply the style changes there so they can apply the style directly to ScrollViewers)

Once you have your changes made to the control template you then need to pass them to your ComboBox. If you only need it for the one ComboBox, You can just put the style template in it's Resources and remove the x:Key name you gave it so it hits the instance of the TargetType via inheritance for just that ComboBox.

However if you want it to hit EVERY ComboBox, then you'll need to edit the ComboBox style template and add a reference to the Style template you just made to it's embedded ScrollViewer.

You'll find long tutorials out there for stuff like WPF/Silverlight that pretty much the same concept but little nuance differences in the templates and syntax of properties.

Hope this helps, give it a shot and if you get stuck come on back and we'll get you sorted.

Upvotes: 1

Related Questions