Restyle the music player bar
Build / test (push) Successful in 1m11s
Build / build (push) Successful in 1m20s

The bar is rounded and a little taller, with a round orange play button
and a restart button that lights up orange under the mouse. The icons sit
inside their buttons with room around them, and are one colour, cropped to
their shape. Progress fills in orange, the volume slider gets a speaker
icon, and the buttons say their shortcut keys in their tooltips.

Buttons grow a little under the mouse and shrink while held down, and the
play button pops when it switches between play and pause. ButtonBounce
holds these animations so other buttons can use them too.
This commit is contained in:
Sansan committed 2026-10-09 17:38:38 +02:00
1 parent 78e1facaf0
commit 4a934840f6
23 files changed
+1037 -247

No files matched your search

+29 -11
View File
@@ -2,19 +2,22 @@ class_name MusicPlayer
extends Control
## The bar that plays the songs, with play, restart, progress and volume. Whether a song
## repeats is a quiz setting ([code]Settings.auto_repeat_song[/code]).
##
## The buttons grow a little under the mouse and the play button pops when it switches
## between play and pause, see [ButtonBounce].
signal update_song_list
signal play_next_song
var play_icon: Texture = preload("res://icons/play_icon_light.svg")
var pause_icon: Texture = preload("res://icons/pause_icon_light.svg")
var play_icon: Texture = preload("res://icons/play_button_icon.svg")
var pause_icon: Texture = preload("res://icons/pause_button_icon.svg")
var is_changing: bool = false
var playback_position: float
var stream: AudioStream
var song_finished: bool = false
@onready var play_button: TextureButton = %PlayTextureButton
@onready var restart_button: TextureButton = %RestartTextureButton
@onready var play_button: Button = %PlayButton
@onready var restart_button: Button = %RestartButton
@onready var audio_player: AudioStreamPlayer = $AudioStreamPlayer
@onready var sound_player: AudioStreamPlayer = $AudioSoundPlayer
@onready var sound_effect_player: AudioStreamPlayer = $AudioSoundEffectPlayer
@@ -26,6 +29,8 @@ var song_finished: bool = false
func _ready() -> void:
play_button.pressed.connect(play_or_pause)
restart_button.pressed.connect(restart)
ButtonBounce.add_to(play_button)
ButtonBounce.add_to(restart_button)
progress_slider.drag_started.connect(_on_drag_started)
progress_slider.drag_ended.connect(_on_drag_ended)
@@ -43,6 +48,19 @@ func _process(_delta: float) -> void:
music_time_label.text = format_text(progress_slider.value, 0.0)
## Whether the play button shows pause, because a song is playing.
func shows_playing() -> bool:
return play_button.icon == pause_icon
# Shows pause on the play button while a song plays, and play otherwise
func _show_playing(playing: bool) -> void:
var icon: Texture = pause_icon if playing else play_icon
if play_button.icon != icon:
play_button.icon = icon
ButtonBounce.pop(play_button)
func format_time(time: float) -> String:
var total_seconds: int = roundi(time)
@warning_ignore("integer_division")
@@ -64,7 +82,7 @@ func play_or_pause() -> void:
if song_finished:
restart()
elif audio_player.stream_paused:
play_button.texture_normal = pause_icon
_show_playing(true)
audio_player.stream_paused = false
song_finished = false
audio_player.seek(playback_position)
@@ -81,7 +99,7 @@ func play_or_pause() -> void:
func pause() -> void:
audio_player.stream_paused = true
playback_position = audio_player.get_playback_position()
play_button.texture_normal = play_icon
_show_playing(false)
func restart() -> void:
@@ -91,12 +109,12 @@ func restart() -> void:
progress_slider.value = 0
playback_position = audio_player.get_playback_position()
audio_player.seek(playback_position)
play_button.texture_normal = pause_icon
_show_playing(true)
audio_player.play()
func _on_finished() -> void:
play_button.texture_normal = play_icon
_show_playing(false)
song_finished = true
if !Settings.stop_after_current:
play_next_song.emit()
@@ -150,7 +168,7 @@ func play_sound(sound_name: AudioStream) -> void:
audio_player.stop()
sound_player.play()
song_finished = true
play_button.texture_normal = play_icon
_show_playing(false)
progress_slider.value = 0
@@ -159,7 +177,7 @@ func play_song(song: AudioStream) -> void:
audio_player.play()
sound_player.stop()
song_finished = false
play_button.texture_normal = pause_icon
_show_playing(true)
stream = audio_player.stream
progress_slider.value = 0
progress_slider.max_value = round(stream.get_length())
@@ -179,7 +197,7 @@ func play_song_object(song_object_no: int) -> void:
sound_player.stop()
audio_player.play()
song_finished = false
play_button.texture_normal = pause_icon
_show_playing(true)
stream = audio_player.stream
progress_slider.value = 0
progress_slider.max_value = round(stream.get_length())