How do I customise the scrollbar?

[poohe]

I'm creating character profiles for every main character in my game and I'm using a scroll bar to display all the info. I've looked through the documentation and haven't found an answer. Is it possible to customize the scroll bar, and how do I do it? Also how do I resize the scrollbar, so it's smaller than the actual text, is that possible?

side "c r":
area (770, 100, 700, 580)

viewport id "vp":
draggable False
mousewheel True
vbar.scrollbar_size = 24

add "character_select_stuff/Ragnyo Character Select Menu TEXT.png"

vbar value YScrollValue("vp")



This code gives me the scrolling I need, but it has a default bar and a block as the thumb. How would I edit it, so the thumb is a heart and the default bar is the line? And how do I get it smaller? If it's not possible through renpy, then it'll be nice to be told.

[poohe]

*bump*

[poohe]

*bump again* I really need help on this. If it's not possible, then just tell me please.

[Ocelot]

I suggest to check out bar style properties, in paticular base_bar and thumb ones. I do not have much experience with old GUI, but you probably want to look where style properties for scrollbars are set and modify it to change all scrollbars at once.

https://www.renpy.org/doc/html/style_pr ... properties

[Minuteman]

*Bump*
I'm interested in this as well.

[hell_oh_world]

I'm creating character profiles for every main character in my game and I'm using a scroll bar to display all the info. I've looked through the documentation and haven't found an answer. Is it possible to customize the scroll bar, and how do I do it? Also how do I resize the scrollbar, so it's smaller than the actual text, is that possible?

side "c r":
area (770, 100, 700, 580)

viewport id "vp":
draggable False
mousewheel True
vbar.scrollbar_size = 24

add "character_select_stuff/Ragnyo Character Select Menu TEXT.png"

vbar value YScrollValue("vp")



This code gives me the scrolling I need, but it has a default bar and a block as the thumb. How would I edit it, so the thumb is a heart and the default bar is the line? And how do I get it smaller? If it's not possible through renpy, then it'll be nice to be told.

Do this, add some properties to the vbar, then experiment on those until you're satisfied with the result.

Code: Select all

side "c r":
         area (770, 100, 700, 580)
        
         viewport id "vp":
             draggable False
             mousewheel True
             vbar.scrollbar_size = 24

             add "character_select_stuff/Ragnyo Character Select Menu TEXT.png"

         vbar value YScrollValue("vp"):
         	## These are all the fundamental properties of a bar that you can alter in order to change its look.
         	## It is well explained in the doc on what each one does.
         	left_bar img_name
		right_bar img_name
		top_bar img_name ## Probably the most common property that you need to change to alter the look.
		bottom_bar img_name ## Probably the most common property that you need to change to alter the look.
		base_bar img_name
		thumb img_name
		thumb_shadow img_name
         

Here's the doc:
https://www.renpy.org/doc/html/style_pr ... y-left_bar

If you're still confused to what each property do, experiment on it. Try different images and see how it works.