nosignal/nosignal-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

feat: use ButtonRow for dash media controls

Browse source 
Also increase default IconButton font to medium size
This commit is contained in:
2 * r + 2 * t 2026-05-02 21:23:56 +10:00
parent deb28b44ab
commit 0210f98686
2 changed files with 11 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
components/controls/IconButton.qml
View file

@ -9,6 +9,7 @@ ButtonBase {
property alias icon: label.text property alias icon: label.text
readonly property alias label: label readonly property alias label: label
font: Tokens.font.icon.medium
padding: type === IconButton.Text ? Tokens.padding.extraSmall / 2 : Tokens.padding.small padding: type === IconButton.Text ? Tokens.padding.extraSmall / 2 : Tokens.padding.small
activeColour: type === IconButton.Filled ? Colours.palette.m3primary : Colours.palette.m3secondary activeColour: type === IconButton.Filled ? Colours.palette.m3primary : Colours.palette.m3secondary

44
modules/dashboard/dash/Media.qml
View file

@ -1,6 +1,7 @@
pragma ComponentBehavior: Bound pragma ComponentBehavior: Bound
import QtQuick import QtQuick
import Caelestia.Components
import Caelestia.Config import Caelestia.Config
import Caelestia.Services import Caelestia.Services
import qs.components import qs.components
@ -119,7 +120,7 @@ Item {
elide: Text.ElideRight elide: Text.ElideRight
} }
Item { ButtonRow {
id: controls id: controls
anchors.top: artist.bottom anchors.top: artist.bottom
@ -128,41 +129,29 @@ Item {
anchors.topMargin: Tokens.spacing.medium anchors.topMargin: Tokens.spacing.medium
anchors.margins: Tokens.padding.large anchors.margins: Tokens.padding.large
implicitHeight: Math.max(previousBtn.implicitHeight, playPauseBtn.implicitHeight, nextBtn.implicitHeight) spacing: Tokens.spacing.small
PlayerControl {
id: previousBtn
anchors.left: parent.left
width: Math.round(implicitWidth * shapeMorphExpansion - playPauseBtn.implicitWidth * (playPauseBtn.shapeMorphExpansion - 1))
IconButton {
type: IconButton.Tonal type: IconButton.Tonal
icon: "skip_previous" icon: "skip_previous"
isRound: true
disabled: !Players.active?.canGoPrevious disabled: !Players.active?.canGoPrevious
onClicked: Players.active?.previous() onClicked: Players.active?.previous()
} }
PlayerControl { IconButton {
id: playPauseBtn fillWidth: true
anchors.left: previousBtn.right
anchors.right: nextBtn.left
anchors.margins: Tokens.spacing.small
icon: Players.active?.isPlaying ? "pause" : "play_arrow" icon: Players.active?.isPlaying ? "pause" : "play_arrow"
isRound: true
checked: Players.active?.isPlaying ?? false checked: Players.active?.isPlaying ?? false
disabled: !Players.active?.canTogglePlaying disabled: !Players.active?.canTogglePlaying
onClicked: Players.active?.togglePlaying() onClicked: Players.active?.togglePlaying()
} }
PlayerControl { IconButton {
id: nextBtn
anchors.right: parent.right
width: Math.round(implicitWidth * shapeMorphExpansion - playPauseBtn.implicitWidth * (playPauseBtn.shapeMorphExpansion - 1))
type: IconButton.Tonal type: IconButton.Tonal
icon: "skip_next" icon: "skip_next"
isRound: true
disabled: !Players.active?.canGoNext disabled: !Players.active?.canGoNext
onClicked: Players.active?.next() onClicked: Players.active?.next()
} }
@ -185,17 +174,4 @@ Item {
asynchronous: true asynchronous: true
fillMode: AnimatedImage.PreserveAspectFit fillMode: AnimatedImage.PreserveAspectFit
} }
component PlayerControl: IconButton {
property real shapeMorphExpansion: pressed ? 1.16 : 1
font: Tokens.font.icon.medium
isRound: true
Behavior on shapeMorphExpansion {
Anim {
type: Anim.FastSpatial
}
}
}
} }