How to hide the ScrollContainer's scrollbar

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By chenjie199234

I want to use the scrollcontainer to contain a texturerect,but i want to hide the scrollbar.
Just hide the scrollbar not disable the scrollbar.
I need to scroll the texture down and up.
How to do this!

:bust_in_silhouette: Reply From: pgregory

I’m not sure if this is the right way to do it, but I’ve achieved this effect in the past by adding a theme to the ScrollContainer, or any GUI node above it in the hierarchy.

Edit the theme, and choose “Add Class Items” from the “Edit Theme” button, choose HScrollBar and/or VScrollBar. Then in the settings for those types, set the various styles to NewStyleBoxEmpty. The scrollbar will no longer be drawn. I’ve put together a simple example of hiding just the HScrollbar, here.

thx got it~
u really solved my problem!
thx very much!

chenjie199234 | 2018-03-05 08:38

I am not sure there is a better way to solve this.
but I’m using the same way as what @pgregory said for a long time.

volzhs | 2018-03-05 17:57

:bust_in_silhouette: Reply From: pattlebass

Other workarounds if you don’t want to mess with themes:

  • If you want to still be able to drag the scroll bar, but want it invisible:
    ScrollContainer.get_h_scrollbar().modulate = Color(0, 0, 0, 0)

  • If you want it gone:
    ScrollContainer.get_h_scrollbar().rect_scale.x = 0

:bust_in_silhouette: Reply From: d.dastan

for anyone who might stumble upon this, I want to add that the easiest way I mange to do this is to edit the rect size of the scrollcontainer and making slightly bigger than the screen so the scrollbar would be on the outside, hence not visible.

:bust_in_silhouette: Reply From: RrR2010

Use this code right in the func _read(): (or whatever you want):

extends ScrollContainer

func _ready() -> void:
    disable_scrollbars() #Run the function to disable the scrollbars

func disable_scrollbars():
    var invisible_scrollbar_theme = Theme.new()
    var empty_stylebox = StyleBoxEmpty.new()
    invisible_scrollbar_theme.set_stylebox("scroll", "VScrollBar", empty_stylebox)
    invisible_scrollbar_theme.set_stylebox("scroll", "HScrollBar", empty_stylebox)
    get_v_scrollbar().theme = invisible_scrollbar_theme
    get_h_scrollbar().theme = invisible_scrollbar_theme

Same thing works (in 3.5.1) if you want to hide scrollbars for other elements like the TextEdit control.

func disable_scrollbars():
	var invisible_scrollbar_theme = Theme.new()
	var empty_stylebox = StyleBoxEmpty.new()
	invisible_scrollbar_theme.set_stylebox("scroll", "VScrollBar", empty_stylebox)
	invisible_scrollbar_theme.set_stylebox("scroll", "HScrollBar", empty_stylebox)
	$TitleTextEdit.theme = invisible_scrollbar_theme

GrayDwarf | 2022-10-24 13:33

:bust_in_silhouette: Reply From: pattlebass

There is now an option in Godot 4: Add the ability to hide `ScrollContainer`'s scrollbars by AaronRecord · Pull Request #48008 · godotengine/godot · GitHub
If anyone wants it in 3.x make sure to let them know.