feat: use ButtonRow for dash media controls
Also increase default IconButton font to medium size
This commit is contained in:
parent
deb28b44ab
commit
0210f98686
2 changed files with 11 additions and 34 deletions
|
|
@ -9,6 +9,7 @@ ButtonBase {
|
|||
property alias icon: label.text
|
||||
readonly property alias label: label
|
||||
|
||||
font: Tokens.font.icon.medium
|
||||
padding: type === IconButton.Text ? Tokens.padding.extraSmall / 2 : Tokens.padding.small
|
||||
|
||||
activeColour: type === IconButton.Filled ? Colours.palette.m3primary : Colours.palette.m3secondary
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
pragma ComponentBehavior: Bound
|
||||
|
||||
import QtQuick
|
||||
import Caelestia.Components
|
||||
import Caelestia.Config
|
||||
import Caelestia.Services
|
||||
import qs.components
|
||||
|
|
@ -119,7 +120,7 @@ Item {
|
|||
elide: Text.ElideRight
|
||||
}
|
||||
|
||||
Item {
|
||||
ButtonRow {
|
||||
id: controls
|
||||
|
||||
anchors.top: artist.bottom
|
||||
|
|
@ -128,41 +129,29 @@ Item {
|
|||
anchors.topMargin: Tokens.spacing.medium
|
||||
anchors.margins: Tokens.padding.large
|
||||
|
||||
implicitHeight: Math.max(previousBtn.implicitHeight, playPauseBtn.implicitHeight, nextBtn.implicitHeight)
|
||||
|
||||
PlayerControl {
|
||||
id: previousBtn
|
||||
|
||||
anchors.left: parent.left
|
||||
width: Math.round(implicitWidth * shapeMorphExpansion - playPauseBtn.implicitWidth * (playPauseBtn.shapeMorphExpansion - 1))
|
||||
spacing: Tokens.spacing.small
|
||||
|
||||
IconButton {
|
||||
type: IconButton.Tonal
|
||||
icon: "skip_previous"
|
||||
isRound: true
|
||||
disabled: !Players.active?.canGoPrevious
|
||||
onClicked: Players.active?.previous()
|
||||
}
|
||||
|
||||
PlayerControl {
|
||||
id: playPauseBtn
|
||||
|
||||
anchors.left: previousBtn.right
|
||||
anchors.right: nextBtn.left
|
||||
anchors.margins: Tokens.spacing.small
|
||||
|
||||
IconButton {
|
||||
fillWidth: true
|
||||
icon: Players.active?.isPlaying ? "pause" : "play_arrow"
|
||||
isRound: true
|
||||
checked: Players.active?.isPlaying ?? false
|
||||
disabled: !Players.active?.canTogglePlaying
|
||||
onClicked: Players.active?.togglePlaying()
|
||||
}
|
||||
|
||||
PlayerControl {
|
||||
id: nextBtn
|
||||
|
||||
anchors.right: parent.right
|
||||
width: Math.round(implicitWidth * shapeMorphExpansion - playPauseBtn.implicitWidth * (playPauseBtn.shapeMorphExpansion - 1))
|
||||
|
||||
IconButton {
|
||||
type: IconButton.Tonal
|
||||
icon: "skip_next"
|
||||
isRound: true
|
||||
disabled: !Players.active?.canGoNext
|
||||
onClicked: Players.active?.next()
|
||||
}
|
||||
|
|
@ -185,17 +174,4 @@ Item {
|
|||
asynchronous: true
|
||||
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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue