controlcenter: refined connected button groups

This commit is contained in:
ATMDA 2025-11-17 10:36:17 -05:00
parent 3f3f3a7d78
commit 388cb0e373
2 changed files with 168 additions and 163 deletions

View file

@ -12,9 +12,10 @@ StyledRect {
property var options: [] // Array of {label: string, propertyName: string, onToggled: function}
property var rootItem: null // The root item that contains the properties we want to bind to
property string title: "" // Optional title text
Layout.fillWidth: true
implicitHeight: buttonRow.implicitHeight + Appearance.padding.large * 2
implicitHeight: layout.implicitHeight + Appearance.padding.large * 2
radius: Appearance.rounding.normal
color: Colours.layer(Colours.palette.m3surfaceContainer, 2)
clip: true
@ -23,12 +24,22 @@ StyledRect {
Anim {}
}
ColumnLayout {
id: layout
anchors.fill: parent
anchors.margins: Appearance.padding.large
spacing: Appearance.spacing.normal
StyledText {
visible: root.title !== ""
text: root.title
font.pointSize: Appearance.font.size.normal
}
RowLayout {
id: buttonRow
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.margins: Appearance.padding.large
Layout.alignment: Qt.AlignHCenter
spacing: Appearance.spacing.small
Repeater {
@ -104,7 +115,6 @@ StyledRect {
}
}
// Match utilities Toggles radius styling
// Each button has full rounding (not connected) since they have spacing
radius: stateLayer.pressed ? Appearance.rounding.small / 2 : internalChecked ? Appearance.rounding.small : Appearance.rounding.normal
@ -137,5 +147,6 @@ StyledRect {
}
}
}
}
}

View file

@ -164,7 +164,6 @@ Item {
readonly property bool allSectionsExpanded:
clockSection.expanded &&
barBehaviorSection.expanded &&
statusIconsSection.expanded &&
traySettingsSection.expanded &&
workspacesSection.expanded
@ -189,13 +188,76 @@ Item {
const shouldExpand = !sidebarLayout.allSectionsExpanded;
clockSection.expanded = shouldExpand;
barBehaviorSection.expanded = shouldExpand;
statusIconsSection.expanded = shouldExpand;
traySettingsSection.expanded = shouldExpand;
workspacesSection.expanded = shouldExpand;
}
}
}
ConnectedButtonGroup {
rootItem: root
title: qsTr("Status Icons")
options: [
{
label: qsTr("Audio"),
propertyName: "showAudio",
onToggled: function(checked) {
root.showAudio = checked;
root.saveConfig();
}
},
{
label: qsTr("Mic"),
propertyName: "showMicrophone",
onToggled: function(checked) {
root.showMicrophone = checked;
root.saveConfig();
}
},
{
label: qsTr("KB"),
propertyName: "showKbLayout",
onToggled: function(checked) {
root.showKbLayout = checked;
root.saveConfig();
}
},
{
label: qsTr("Network"),
propertyName: "showNetwork",
onToggled: function(checked) {
root.showNetwork = checked;
root.saveConfig();
}
},
{
label: qsTr("BT"),
propertyName: "showBluetooth",
onToggled: function(checked) {
root.showBluetooth = checked;
root.saveConfig();
}
},
{
label: qsTr("Battery"),
propertyName: "showBattery",
onToggled: function(checked) {
root.showBattery = checked;
root.saveConfig();
}
},
{
label: qsTr("Lock"),
propertyName: "showLockStatus",
onToggled: function(checked) {
root.showLockStatus = checked;
root.saveConfig();
}
}
]
}
CollapsibleSection {
id: clockSection
title: qsTr("Clock")
@ -332,74 +394,6 @@ Item {
}
}
CollapsibleSection {
id: statusIconsSection
title: qsTr("Status Icons")
ConnectedButtonGroup {
rootItem: root
options: [
{
label: qsTr("Audio"),
propertyName: "showAudio",
onToggled: function(checked) {
root.showAudio = checked;
root.saveConfig();
}
},
{
label: qsTr("Mic"),
propertyName: "showMicrophone",
onToggled: function(checked) {
root.showMicrophone = checked;
root.saveConfig();
}
},
{
label: qsTr("KB"),
propertyName: "showKbLayout",
onToggled: function(checked) {
root.showKbLayout = checked;
root.saveConfig();
}
},
{
label: qsTr("Network"),
propertyName: "showNetwork",
onToggled: function(checked) {
root.showNetwork = checked;
root.saveConfig();
}
},
{
label: qsTr("BT"),
propertyName: "showBluetooth",
onToggled: function(checked) {
root.showBluetooth = checked;
root.saveConfig();
}
},
{
label: qsTr("Battery"),
propertyName: "showBattery",
onToggled: function(checked) {
root.showBattery = checked;
root.saveConfig();
}
},
{
label: qsTr("Lock"),
propertyName: "showLockStatus",
onToggled: function(checked) {
root.showLockStatus = checked;
root.saveConfig();
}
}
]
}
}
CollapsibleSection {
id: traySettingsSection
title: qsTr("Tray Settings")