fix: lock media size
This commit is contained in:
parent
573cc9def0
commit
619b840893
1 changed files with 31 additions and 89 deletions
|
|
@ -3,8 +3,10 @@ pragma ComponentBehavior: Bound
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
import Quickshell
|
import Quickshell
|
||||||
|
import Caelestia.Components
|
||||||
import Caelestia.Config
|
import Caelestia.Config
|
||||||
import qs.components
|
import qs.components
|
||||||
|
import qs.components.controls
|
||||||
import qs.components.effects
|
import qs.components.effects
|
||||||
import qs.services
|
import qs.services
|
||||||
|
|
||||||
|
|
@ -72,14 +74,14 @@ Item {
|
||||||
|
|
||||||
anchors.left: parent.left
|
anchors.left: parent.left
|
||||||
anchors.right: parent.right
|
anchors.right: parent.right
|
||||||
anchors.margins: Tokens.padding.large
|
anchors.margins: Tokens.padding.medium
|
||||||
|
|
||||||
StyledText {
|
StyledText {
|
||||||
Layout.topMargin: Tokens.padding.large
|
Layout.topMargin: Tokens.padding.medium
|
||||||
Layout.bottomMargin: Tokens.spacing.large
|
Layout.bottomMargin: Tokens.spacing.large
|
||||||
text: qsTr("Now playing")
|
text: qsTr("Now playing")
|
||||||
color: Colours.palette.m3onSurfaceVariant
|
color: Colours.palette.m3onSurfaceVariant
|
||||||
font: Tokens.font.mono.builders.small.weight(Font.Medium).build()
|
font: Tokens.font.label.builders.medium.weight(Font.DemiBold).vaxis("slnt", -4).build()
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledText {
|
StyledText {
|
||||||
|
|
@ -88,7 +90,7 @@ Item {
|
||||||
text: Players.active?.trackArtist ?? qsTr("No media")
|
text: Players.active?.trackArtist ?? qsTr("No media")
|
||||||
color: Colours.palette.m3primary
|
color: Colours.palette.m3primary
|
||||||
horizontalAlignment: Text.AlignHCenter
|
horizontalAlignment: Text.AlignHCenter
|
||||||
font: Tokens.font.mono.builders.large.weight(Font.DemiBold).build()
|
font: Tokens.font.body.builders.large.weight(Font.DemiBold).build()
|
||||||
elide: Text.ElideRight
|
elide: Text.ElideRight
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -97,103 +99,43 @@ Item {
|
||||||
animate: true
|
animate: true
|
||||||
text: Players.active?.trackTitle ?? qsTr("No media")
|
text: Players.active?.trackTitle ?? qsTr("No media")
|
||||||
horizontalAlignment: Text.AlignHCenter
|
horizontalAlignment: Text.AlignHCenter
|
||||||
font: Tokens.font.mono.large
|
font: Tokens.font.title.medium
|
||||||
elide: Text.ElideRight
|
elide: Text.ElideRight
|
||||||
}
|
}
|
||||||
|
|
||||||
RowLayout {
|
ButtonRow {
|
||||||
Layout.alignment: Qt.AlignHCenter
|
Layout.alignment: Qt.AlignHCenter
|
||||||
Layout.topMargin: Tokens.spacing.largeIncreased * 1.2
|
Layout.topMargin: Tokens.spacing.medium
|
||||||
Layout.bottomMargin: Tokens.padding.large
|
Layout.bottomMargin: Tokens.padding.extraLarge
|
||||||
|
|
||||||
spacing: Tokens.spacing.largeIncreased
|
spacing: Tokens.spacing.extraSmall
|
||||||
|
|
||||||
PlayerControl {
|
IconButton {
|
||||||
|
type: IconButton.Tonal
|
||||||
icon: "skip_previous"
|
icon: "skip_previous"
|
||||||
onClicked: {
|
isRound: true
|
||||||
if (Players.active?.canGoPrevious)
|
shapeMorph: true
|
||||||
Players.active.previous();
|
disabled: !Players.active?.canGoPrevious
|
||||||
}
|
onClicked: Players.active?.previous()
|
||||||
}
|
}
|
||||||
|
|
||||||
PlayerControl {
|
IconButton {
|
||||||
animate: true
|
icon: Players.active?.isPlaying ? "pause" : "play_arrow"
|
||||||
icon: active ? "pause" : "play_arrow"
|
isRound: true
|
||||||
colour: "Primary"
|
shapeMorph: true
|
||||||
level: active ? 2 : 1
|
checked: Players.active?.isPlaying ?? false
|
||||||
active: Players.active?.isPlaying ?? false
|
disabled: !Players.active?.canTogglePlaying
|
||||||
onClicked: {
|
onClicked: Players.active?.togglePlaying()
|
||||||
if (Players.active?.canTogglePlaying)
|
implicitWidth: implicitHeight + Tokens.padding.large * 2
|
||||||
Players.active.togglePlaying();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
PlayerControl {
|
IconButton {
|
||||||
|
type: IconButton.Tonal
|
||||||
icon: "skip_next"
|
icon: "skip_next"
|
||||||
onClicked: {
|
isRound: true
|
||||||
if (Players.active?.canGoNext)
|
shapeMorph: true
|
||||||
Players.active.next();
|
disabled: !Players.active?.canGoNext
|
||||||
}
|
onClicked: Players.active?.next()
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
component PlayerControl: StyledRect {
|
|
||||||
id: control
|
|
||||||
|
|
||||||
property alias animate: controlIcon.animate
|
|
||||||
property alias icon: controlIcon.text
|
|
||||||
property bool active
|
|
||||||
property string colour: "Secondary"
|
|
||||||
property int level: 1
|
|
||||||
|
|
||||||
signal clicked
|
|
||||||
|
|
||||||
Layout.preferredWidth: implicitWidth + (controlState.pressed ? Tokens.padding.medium * 2 : active ? Tokens.padding.small : 0)
|
|
||||||
implicitWidth: controlIcon.implicitWidth + Tokens.padding.extraLargeIncreased
|
|
||||||
implicitHeight: controlIcon.implicitHeight + Tokens.padding.medium * 2
|
|
||||||
|
|
||||||
color: active ? Colours.palette[`m3${colour.toLowerCase()}`] : Colours.palette[`m3${colour.toLowerCase()}Container`]
|
|
||||||
radius: active || controlState.pressed ? Tokens.rounding.large : Math.min(implicitWidth, implicitHeight) / 2 * Math.min(1, Tokens.rounding.scale)
|
|
||||||
|
|
||||||
Elevation {
|
|
||||||
anchors.fill: parent
|
|
||||||
radius: parent.radius
|
|
||||||
z: -1
|
|
||||||
level: controlState.containsMouse && !controlState.pressed ? control.level + 1 : control.level
|
|
||||||
}
|
|
||||||
|
|
||||||
StateLayer {
|
|
||||||
id: controlState
|
|
||||||
|
|
||||||
color: control.active ? Colours.palette[`m3on${control.colour}`] : Colours.palette[`m3on${control.colour}Container`]
|
|
||||||
onClicked: control.clicked()
|
|
||||||
}
|
|
||||||
|
|
||||||
MaterialIcon {
|
|
||||||
id: controlIcon
|
|
||||||
|
|
||||||
anchors.centerIn: parent
|
|
||||||
color: control.active ? Colours.palette[`m3on${control.colour}`] : Colours.palette[`m3on${control.colour}Container`]
|
|
||||||
fontStyle: Tokens.font.icon.large
|
|
||||||
fill: control.active ? 1 : 0
|
|
||||||
|
|
||||||
Behavior on fill {
|
|
||||||
Anim {
|
|
||||||
type: Anim.DefaultEffects
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Behavior on Layout.preferredWidth {
|
|
||||||
Anim {
|
|
||||||
type: Anim.FastSpatial
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Behavior on radius {
|
|
||||||
Anim {
|
|
||||||
type: Anim.FastSpatial
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue