How to tween a node's transparency?

Question

Hey. I'm making a HBoxContainer and it's children disappear in a tween node, but when i try, i get this.

https://drive.google.com/file/d/13X2EFqegBVW1aIWCik1sh9d6qMQX55At/view?usp=sharing

Here's all the necessary code

func _notification(what: int) -> void:
    match what:
        NOTIFICATION_WM_MOUSE_ENTER:
            show_buttons()
        NOTIFICATION_WM_MOUSE_EXIT:
            hide_buttons()

func show_buttons() -> void:
    $Buttons.show()
    $Buttons.set_mouse_filter(Control.MOUSE_FILTER_PASS)

    $Tween.interpolate_property(
        $Buttons,
        'modulate',
        $Buttons.get_modulate(),
        Color(255, 255, 255, 0),
        0.75,
        Tween.TRANS_SINE,
        Tween.EASE_IN
    )
    $Tween.start()

func hide_buttons() -> void:
    $Buttons.show()
    $Buttons.set_mouse_filter(Control.MOUSE_FILTER_IGNORE)

    $Tween.interpolate_property(
        $Buttons,
        'modulate',
        $Buttons.get_modulate(),
        Color(255, 255, 255, 255),
        0.75,
        Tween.TRANS_SINE,
        Tween.EASE_OUT
    )
    $Tween.start()

    $Buttons.hide()

Answer 1

You can tween the alpha directly if that's what you need:

$Tween.interpolate_property(
        $Buttons,
        "modulate:a",
        $Buttons.modulate.a,
        0,
        etc etc
    )

However if you just want to make the UI disappear, you can simply call hide() and show().

Comments

It seems to stop the node from turning white. For the hide button functions however, I needed to add a yield function to stop it from hiding before the tween node is finished:

func hide_buttons() -> void:
    $Buttons.show()
    $Buttons.set_mouse_filter(Control.MOUSE_FILTER_IGNORE)

    $Tween.stop_all()
    $Tween.interpolate_property(
        $Buttons,
        'modulate:a',
        $Buttons.get_modulate().a,
        0.0,
        0.25,
        Tween.TRANS_SINE,
        Tween.EASE_OUT
    )
    $Tween.start()

    yield($Tween, 'tween_completed')
    $Buttons.hide()

Thanks for the help