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

feat: use circular gauges for dash resources

Browse source 
Also pause prog indicator wave anim when amplitude == 0
This commit is contained in:
2 * r + 2 * t 2026-04-23 23:31:24 +10:00
parent 28a84a9611
commit 15498f8786
4 changed files with 41 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
components/controls/CircularProgress.qml
View file

@ -23,7 +23,7 @@ Item {
property bool wavy: false property bool wavy: false
property alias waveFrequency: wave.frequency property alias waveFrequency: wave.frequency
property alias waveAmplitude: wave.amplitudeMultiplier property alias waveAmplitude: wave.amplitudeMultiplier
property alias wavePaused: waveProgAnim.paused property bool wavePaused
property alias waveDuration: waveProgAnim.duration property alias waveDuration: waveProgAnim.duration
readonly property real size: Math.min(width, height) readonly property real size: Math.min(width, height)
@ -86,6 +86,7 @@ Item {
id: waveProgAnim id: waveProgAnim
running: true running: true
paused: root.wavePaused || wave.amplitudeMultiplier === 0
from: 0 from: 0
to: 1 to: 1
duration: 2000 duration: 2000

4
components/controls/StyledProgressBar.qml
View file

@ -220,6 +220,8 @@ ProgressBar {
} }
component Wave: WavyLine { component Wave: WavyLine {
id: wave
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
implicitHeight: lineWidth * amplitudeMultiplier * 2 + lineWidth implicitHeight: lineWidth * amplitudeMultiplier * 2 + lineWidth
@ -232,7 +234,7 @@ ProgressBar {
Anim on waveProgress { Anim on waveProgress {
running: true running: true
paused: root.wavePaused paused: wave.amplitudeMultiplier === 0 || root.wavePaused
from: 0 from: 0
to: 1 to: 1
duration: root.waveDuration duration: root.waveDuration

90
modules/dashboard/dash/Resources.qml
View file

@ -1,87 +1,67 @@
import QtQuick import QtQuick
import QtQuick.Layouts
import Caelestia.Config import Caelestia.Config
import qs.components import qs.components
import qs.components.controls
import qs.components.misc import qs.components.misc
import qs.services import qs.services
Row { Item {
id: root id: root
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
padding: Tokens.padding.large implicitWidth: layout.implicitWidth + layout.anchors.margins * 2
spacing: Tokens.spacing.medium
Ref { Ref {
service: SystemUsage service: SystemUsage
} }
Resource { ColumnLayout {
icon: "memory" id: layout
value: SystemUsage.cpuPerc
colour: Colours.palette.m3primary
}
Resource {
icon: "memory_alt"
value: SystemUsage.memPerc
colour: Colours.palette.m3secondary
}
Resource {
icon: "hard_disk"
value: SystemUsage.storagePerc
colour: Colours.palette.m3tertiary
}
component Resource: Item {
id: res
required property string icon
required property real value
required property color colour
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.margins: Tokens.padding.large anchors.margins: Tokens.padding.large
implicitWidth: icon.implicitWidth spacing: Tokens.spacing.medium
StyledRect { Resource {
anchors.horizontalCenter: parent.horizontalCenter icon: "memory"
anchors.top: parent.top value: SystemUsage.cpuPerc
anchors.bottom: icon.top }
anchors.bottomMargin: Tokens.spacing.small
implicitWidth: Tokens.sizes.dashboard.resourceProgressThickness Resource {
icon: "memory_alt"
value: SystemUsage.memPerc
fgColour: Colours.palette.m3tertiary
}
color: Colours.layer(Colours.palette.m3surfaceContainerHigh, 2) Resource {
radius: Tokens.rounding.full icon: "hard_disk"
value: SystemUsage.storagePerc
fgColour: Colours.palette.m3secondary
}
}
component Resource: CircularProgress {
id: res
StyledRect { required property string icon
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
implicitHeight: res.value * parent.height
color: res.colour Layout.fillHeight: true
radius: Tokens.rounding.full implicitSize: height
} strokeWidth: Tokens.sizes.dashboard.resourceProgressThickness
Behavior on value {
Anim {}
} }
MaterialIcon { MaterialIcon {
id: icon anchors.centerIn: parent
anchors.bottom: parent.bottom
text: res.icon text: res.icon
color: res.colour font: Tokens.font.icon.large
} color: res.fgColour
Behavior on value {
Anim {
type: Anim.StandardLarge
}
} }
} }
} }

2
plugin/src/Caelestia/Config/tokens.hpp
View file

@ -185,7 +185,7 @@ class DashboardTokens : public ConfigObject {
CONFIG_PROPERTY(int, mediaWidth, 200) CONFIG_PROPERTY(int, mediaWidth, 200)
CONFIG_PROPERTY(int, mediaProgressSweep, 180) CONFIG_PROPERTY(int, mediaProgressSweep, 180)
CONFIG_PROPERTY(int, mediaProgressThickness, 6) CONFIG_PROPERTY(int, mediaProgressThickness, 6)
CONFIG_PROPERTY(int, resourceProgressThickness, 10) CONFIG_PROPERTY(int, resourceProgressThickness, 6)
CONFIG_PROPERTY(int, weatherWidth, 275) CONFIG_PROPERTY(int, weatherWidth, 275)
CONFIG_PROPERTY(int, mediaCoverArtSize, 150) CONFIG_PROPERTY(int, mediaCoverArtSize, 150)
CONFIG_PROPERTY(int, mediaVisualiserSize, 80) CONFIG_PROPERTY(int, mediaVisualiserSize, 80)