Customize scrollbar

You can now use images for the scroll bars of the ScrollViewer. At the moment best to use images with rotation symmetry of order 4. Will be working on the orientation issue over the next few days (weeks?).

You can adjust the thumb length and thumb height and barImageHeight from 0 to 1. Check out the properties on lines 90 to 95 in the page source of Scroller

PR and docs coming very soon.

3 Likes

Now available, docs shortly. For the moment this PG should show you how to use it Babylon.js Playground

Here is a crude PG version of the image in Customize scrollbar, hopefully it will show how it could be reconstructed with GUI

https://www.babylonjs-playground.com/#4ZC0G4#1

EDIT
The image for the vertical bar and thumb is now a rotation of those used for the horizontal bar and thumb.

https://www.babylonjs-playground.com/#4ZC0G4#2

Since the horizontal images are copied and rotated you may want to keep their sizes small if memory is an issue in your project.

3 Likes