extract BacklightApplet, add brightness and notif pills to lock screen right column

This commit is contained in:
Damocles 2026-04-18 10:25:50 +02:00
parent a55d232b9a
commit 08d34ac5c7
5 changed files with 163 additions and 79 deletions

View file

@ -0,0 +1,79 @@
import QtQuick
import "../services" as S
Item {
id: root
required property int percent
required property color accentColor
signal setPercent(real pct)
implicitHeight: 36
Text {
id: _icon
anchors.left: parent.left
anchors.leftMargin: 12
anchors.verticalCenter: parent.verticalCenter
text: "\uF185"
color: root.accentColor
font.pixelSize: S.Theme.fontSize + 2
font.family: S.Theme.iconFontFamily
}
Item {
id: _slider
anchors.left: _icon.right
anchors.leftMargin: 8
anchors.right: _label.left
anchors.rightMargin: 8
anchors.verticalCenter: parent.verticalCenter
height: 6
Rectangle {
anchors.fill: parent
color: S.Theme.base02
radius: 3
}
Rectangle {
width: parent.width * root.percent / 100
height: parent.height
color: root.accentColor
radius: 3
Behavior on width {
NumberAnimation {
duration: 80
}
}
}
MouseArea {
anchors.fill: parent
anchors.margins: -6
cursorShape: Qt.PointingHandCursor
onPressed: mouse => _set(mouse)
onPositionChanged: mouse => {
if (pressed)
_set(mouse);
}
function _set(mouse) {
root.setPercent(mouse.x / _slider.width * 100);
}
}
}
Text {
id: _label
anchors.right: parent.right
anchors.rightMargin: 12
anchors.verticalCenter: parent.verticalCenter
text: root.percent + "%"
color: S.Theme.base05
font.pixelSize: S.Theme.fontSize
font.family: S.Theme.fontFamily
width: 30
}
}

View file

@ -6,3 +6,4 @@ CpuApplet 1.0 CpuApplet.qml
MemoryApplet 1.0 MemoryApplet.qml
TemperatureApplet 1.0 TemperatureApplet.qml
DiskApplet 1.0 DiskApplet.qml
BacklightApplet 1.0 BacklightApplet.qml

View file

@ -115,16 +115,6 @@ WlSessionLockSurface {
anchors.horizontalCenter: parent.horizontalCenter
spacing: 24
LockNotifPills {
anchors.horizontalCenter: parent.horizontalCenter
}
// Spacer
Item {
width: 1
height: 24
}
// Password input
LockInput {
anchors.horizontalCenter: parent.horizontalCenter

View file

@ -1,4 +1,6 @@
import QtQuick
import Quickshell
import Quickshell.Io
import Quickshell.Services.Mpris
import Quickshell.Services.Pipewire
import "../services" as S
@ -28,13 +30,19 @@ Item {
}
implicitHeight: _widgetContent.implicitHeight
visible: _mprisCard.visible || _volumeCard.visible
visible: _mprisCard.visible || _volumeCard.visible || _backlightCard.visible || _notifPills.visible
Column {
id: _widgetContent
width: parent.width
spacing: 12
// Notification pills
LockNotifPills {
id: _notifPills
anchors.horizontalCenter: parent.horizontalCenter
}
// Media widget
Rectangle {
id: _mprisCard
@ -96,5 +104,74 @@ Item {
accentColor: S.Theme.base0E
}
}
// Brightness widget
Rectangle {
id: _backlightCard
width: parent.width
height: _backlightContent.implicitHeight + 8
radius: S.Theme.radius + 2
color: Qt.rgba(S.Theme.base01.r, S.Theme.base01.g, S.Theme.base01.b, 0.7)
border.color: Qt.rgba(S.Theme.base03.r, S.Theme.base03.g, S.Theme.base03.b, 0.3)
border.width: 1
visible: _blDev !== ""
property string _blDev: ""
property int _percent: 0
Process {
running: true
command: ["sh", "-c", "ls /sys/class/backlight/ 2>/dev/null | head -1"]
stdout: StdioCollector {
onStreamFinished: {
const dev = text.trim();
if (dev)
_backlightCard._blDev = "/sys/class/backlight/" + dev;
}
}
}
FileView {
id: _blCurrent
path: _backlightCard._blDev ? _backlightCard._blDev + "/brightness" : ""
watchChanges: true
onFileChanged: reload()
onLoaded: _backlightCard._updatePercent()
}
FileView {
id: _blMax
path: _backlightCard._blDev ? _backlightCard._blDev + "/max_brightness" : ""
onLoaded: _backlightCard._updatePercent()
}
function _updatePercent() {
const c = parseInt(_blCurrent.text());
const m = parseInt(_blMax.text());
if (m > 0)
_percent = Math.round((c / m) * 100);
}
Process {
id: _blAdj
property string cmd: ""
command: ["sh", "-c", cmd]
onRunningChanged: if (!running && cmd !== "")
_blCurrent.reload()
}
C.BacklightApplet {
id: _backlightContent
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.topMargin: 4
percent: _backlightCard._percent
accentColor: S.Theme.base0A
onSetPercent: pct => {
_blAdj.cmd = "light -S " + Math.round(Math.max(0, Math.min(100, pct)));
_blAdj.running = true;
}
}
}
}
}

View file

@ -3,6 +3,7 @@ import Quickshell
import Quickshell.Io
import "." as M
import "../services" as S
import "../applets" as C
M.BarSection {
id: root
@ -113,75 +114,11 @@ M.BarSection {
panelTitle: "Brightness"
contentWidth: 200
Item {
C.BacklightApplet {
width: parent.width
height: 36
Text {
id: blIcon
anchors.left: parent.left
anchors.leftMargin: 12
anchors.verticalCenter: parent.verticalCenter
text: "\uF185"
color: root.accentColor
font.pixelSize: S.Theme.fontSize + 2
font.family: S.Theme.iconFontFamily
}
Item {
id: slider
anchors.left: blIcon.right
anchors.leftMargin: 8
anchors.right: blLabel.left
anchors.rightMargin: 8
anchors.verticalCenter: parent.verticalCenter
height: 6
Rectangle {
anchors.fill: parent
color: S.Theme.base02
radius: 3
}
Rectangle {
width: parent.width * root.percent / 100
height: parent.height
color: root.accentColor
radius: 3
Behavior on width {
NumberAnimation {
duration: 80
}
}
}
MouseArea {
anchors.fill: parent
anchors.margins: -6
cursorShape: Qt.PointingHandCursor
onPressed: mouse => _set(mouse)
onPositionChanged: mouse => {
if (pressed)
_set(mouse);
}
function _set(mouse) {
root.setPercent(mouse.x / slider.width * 100);
}
}
}
Text {
id: blLabel
anchors.right: parent.right
anchors.rightMargin: 12
anchors.verticalCenter: parent.verticalCenter
text: root.percent + "%"
color: S.Theme.base05
font.pixelSize: S.Theme.fontSize
font.family: S.Theme.fontFamily
width: 30
}
percent: root.percent
accentColor: root.accentColor
onSetPercent: pct => root.setPercent(pct)
}
}
}