summaryrefslogtreecommitdiff
path: root/modules/controlcenter/taskbar/ConnectedButtonGroup.qml
diff options
context:
space:
mode:
Diffstat (limited to 'modules/controlcenter/taskbar/ConnectedButtonGroup.qml')
-rw-r--r--modules/controlcenter/taskbar/ConnectedButtonGroup.qml175
1 files changed, 93 insertions, 82 deletions
diff --git a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml
index 7999b70..83ff95e 100644
--- a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml
+++ b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml
@@ -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,115 +24,125 @@ StyledRect {
Anim {}
}
- RowLayout {
- id: buttonRow
- anchors.left: parent.left
- anchors.right: parent.right
- anchors.verticalCenter: parent.verticalCenter
+ ColumnLayout {
+ id: layout
+
+ anchors.fill: parent
anchors.margins: Appearance.padding.large
- spacing: Appearance.spacing.small
+ spacing: Appearance.spacing.normal
- Repeater {
- id: repeater
- model: root.options
+ StyledText {
+ visible: root.title !== ""
+ text: root.title
+ font.pointSize: Appearance.font.size.normal
+ }
- delegate: TextButton {
- id: button
- required property int index
- required property var modelData
+ RowLayout {
+ id: buttonRow
+ Layout.alignment: Qt.AlignHCenter
+ spacing: Appearance.spacing.small
- Layout.fillWidth: true
- text: modelData.label
-
- property bool isChecked: false
-
- // Initialize from root property
- Component.onCompleted: {
- if (root.rootItem && modelData.propertyName) {
- isChecked = root.rootItem[modelData.propertyName];
- }
- }
-
- checked: isChecked
- toggle: false
- type: TextButton.Tonal
+ Repeater {
+ id: repeater
+ model: root.options
- // Listen for property changes on rootItem
- Connections {
- target: root.rootItem
- enabled: root.rootItem !== null && modelData.propertyName !== undefined
+ delegate: TextButton {
+ id: button
+ required property int index
+ required property var modelData
- function onShowAudioChanged() {
- if (modelData.propertyName === "showAudio") {
- button.isChecked = root.rootItem.showAudio;
+ Layout.fillWidth: true
+ text: modelData.label
+
+ property bool isChecked: false
+
+ // Initialize from root property
+ Component.onCompleted: {
+ if (root.rootItem && modelData.propertyName) {
+ isChecked = root.rootItem[modelData.propertyName];
}
}
+
+ checked: isChecked
+ toggle: false
+ type: TextButton.Tonal
+
+ // Listen for property changes on rootItem
+ Connections {
+ target: root.rootItem
+ enabled: root.rootItem !== null && modelData.propertyName !== undefined
- function onShowMicrophoneChanged() {
- if (modelData.propertyName === "showMicrophone") {
- button.isChecked = root.rootItem.showMicrophone;
+ function onShowAudioChanged() {
+ if (modelData.propertyName === "showAudio") {
+ button.isChecked = root.rootItem.showAudio;
+ }
}
- }
- function onShowKbLayoutChanged() {
- if (modelData.propertyName === "showKbLayout") {
- button.isChecked = root.rootItem.showKbLayout;
+ function onShowMicrophoneChanged() {
+ if (modelData.propertyName === "showMicrophone") {
+ button.isChecked = root.rootItem.showMicrophone;
+ }
}
- }
- function onShowNetworkChanged() {
- if (modelData.propertyName === "showNetwork") {
- button.isChecked = root.rootItem.showNetwork;
+ function onShowKbLayoutChanged() {
+ if (modelData.propertyName === "showKbLayout") {
+ button.isChecked = root.rootItem.showKbLayout;
+ }
}
- }
- function onShowBluetoothChanged() {
- if (modelData.propertyName === "showBluetooth") {
- button.isChecked = root.rootItem.showBluetooth;
+ function onShowNetworkChanged() {
+ if (modelData.propertyName === "showNetwork") {
+ button.isChecked = root.rootItem.showNetwork;
+ }
}
- }
- function onShowBatteryChanged() {
- if (modelData.propertyName === "showBattery") {
- button.isChecked = root.rootItem.showBattery;
+ function onShowBluetoothChanged() {
+ if (modelData.propertyName === "showBluetooth") {
+ button.isChecked = root.rootItem.showBluetooth;
+ }
}
- }
- function onShowLockStatusChanged() {
- if (modelData.propertyName === "showLockStatus") {
- button.isChecked = root.rootItem.showLockStatus;
+ function onShowBatteryChanged() {
+ if (modelData.propertyName === "showBattery") {
+ button.isChecked = root.rootItem.showBattery;
+ }
}
- }
- }
+ function onShowLockStatusChanged() {
+ if (modelData.propertyName === "showLockStatus") {
+ button.isChecked = root.rootItem.showLockStatus;
+ }
+ }
+ }
- // 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
+ // 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
- // Match utilities Toggles inactive color
- inactiveColour: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2)
-
- // Adjust width similar to utilities toggles
- Layout.preferredWidth: implicitWidth + (stateLayer.pressed ? Appearance.padding.large : internalChecked ? Appearance.padding.smaller : 0)
+ // Match utilities Toggles inactive color
+ inactiveColour: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2)
+
+ // Adjust width similar to utilities toggles
+ Layout.preferredWidth: implicitWidth + (stateLayer.pressed ? Appearance.padding.large : internalChecked ? Appearance.padding.smaller : 0)
- onClicked: {
- if (modelData.onToggled) {
- modelData.onToggled(!checked);
+ onClicked: {
+ if (modelData.onToggled) {
+ modelData.onToggled(!checked);
+ }
}
- }
- Behavior on Layout.preferredWidth {
- Anim {
- duration: Appearance.anim.durations.expressiveFastSpatial
- easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
+ Behavior on Layout.preferredWidth {
+ Anim {
+ duration: Appearance.anim.durations.expressiveFastSpatial
+ easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
+ }
}
- }
- Behavior on radius {
- Anim {
- duration: Appearance.anim.durations.expressiveFastSpatial
- easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
+ Behavior on radius {
+ Anim {
+ duration: Appearance.anim.durations.expressiveFastSpatial
+ easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
+ }
}
}
}
generated by cgit v1.2.3-freya (git 2.51.1) at 2026-01-20 12:14:51 +0000