controlcenter: minor adjustments of accordion menu

This commit is contained in:
ATMDA 2025-11-14 14:11:40 -05:00
parent 9cdc30058a
commit 5994c77dea
2 changed files with 169 additions and 126 deletions

View file

@ -24,15 +24,24 @@ RowLayout {
Layout.minimumWidth: 420 Layout.minimumWidth: 420
Layout.fillHeight: true Layout.fillHeight: true
ColumnLayout { StyledFlickable {
anchors.fill: parent anchors.fill: parent
anchors.margins: Appearance.padding.large + Appearance.padding.normal anchors.margins: Appearance.padding.large + Appearance.padding.normal
anchors.leftMargin: Appearance.padding.large anchors.leftMargin: Appearance.padding.large
anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2
flickableDirection: Flickable.VerticalFlick
contentHeight: leftContent.height
spacing: Appearance.spacing.small ColumnLayout {
id: leftContent
anchors.left: parent.left
anchors.right: parent.right
spacing: Appearance.spacing.normal
// Settings header above the collapsible sections
RowLayout { RowLayout {
Layout.fillWidth: true
spacing: Appearance.spacing.smaller spacing: Appearance.spacing.smaller
StyledText { StyledText {
@ -46,36 +55,42 @@ RowLayout {
} }
} }
CollapsibleSection {
id: outputDevicesSection
Layout.fillWidth: true
title: qsTr("Output devices")
expanded: true
ColumnLayout {
Layout.fillWidth: true
spacing: Appearance.spacing.small
RowLayout {
Layout.fillWidth: true
spacing: Appearance.spacing.small
StyledText { StyledText {
text: qsTr("Output devices (%1)").arg(Audio.sinks.length) text: qsTr("Devices (%1)").arg(Audio.sinks.length)
font.pointSize: Appearance.font.size.normal font.pointSize: Appearance.font.size.normal
font.weight: 500 font.weight: 500
} }
}
StyledText { StyledText {
Layout.fillWidth: true
text: qsTr("All available output devices") text: qsTr("All available output devices")
color: Colours.palette.m3outline color: Colours.palette.m3outline
} }
StyledListView { Repeater {
id: outputView
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true
model: Audio.sinks model: Audio.sinks
spacing: Appearance.spacing.small / 2
clip: true
StyledScrollBar.vertical: StyledScrollBar {
flickable: outputView
}
delegate: StyledRect { delegate: StyledRect {
required property var modelData required property var modelData
anchors.left: parent.left Layout.fillWidth: true
anchors.right: parent.right
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, Audio.sink?.id === modelData.id ? Colours.tPalette.m3surfaceContainer.a : 0) color: Qt.alpha(Colours.tPalette.m3surfaceContainer, Audio.sink?.id === modelData.id ? Colours.tPalette.m3surfaceContainer.a : 0)
radius: Appearance.rounding.normal radius: Appearance.rounding.normal
@ -106,6 +121,8 @@ RowLayout {
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight
maximumLineCount: 1
text: modelData.description || qsTr("Unknown") text: modelData.description || qsTr("Unknown")
font.weight: Audio.sink?.id === modelData.id ? 500 : 400 font.weight: Audio.sink?.id === modelData.id ? 500 : 400
@ -115,38 +132,45 @@ RowLayout {
implicitHeight: outputRowLayout.implicitHeight + Appearance.padding.normal * 2 implicitHeight: outputRowLayout.implicitHeight + Appearance.padding.normal * 2
} }
} }
}
}
CollapsibleSection {
id: inputDevicesSection
Layout.fillWidth: true
title: qsTr("Input devices")
expanded: true
ColumnLayout {
Layout.fillWidth: true
spacing: Appearance.spacing.small
RowLayout {
Layout.fillWidth: true
spacing: Appearance.spacing.small
StyledText { StyledText {
Layout.topMargin: Appearance.spacing.large text: qsTr("Devices (%1)").arg(Audio.sources.length)
text: qsTr("Input devices (%1)").arg(Audio.sources.length)
font.pointSize: Appearance.font.size.normal font.pointSize: Appearance.font.size.normal
font.weight: 500 font.weight: 500
} }
}
StyledText { StyledText {
Layout.fillWidth: true
text: qsTr("All available input devices") text: qsTr("All available input devices")
color: Colours.palette.m3outline color: Colours.palette.m3outline
} }
StyledListView { Repeater {
id: inputView
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true
model: Audio.sources model: Audio.sources
spacing: Appearance.spacing.small / 2
clip: true
StyledScrollBar.vertical: StyledScrollBar {
flickable: inputView
}
delegate: StyledRect { delegate: StyledRect {
required property var modelData required property var modelData
anchors.left: parent.left Layout.fillWidth: true
anchors.right: parent.right
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, Audio.source?.id === modelData.id ? Colours.tPalette.m3surfaceContainer.a : 0) color: Qt.alpha(Colours.tPalette.m3surfaceContainer, Audio.source?.id === modelData.id ? Colours.tPalette.m3surfaceContainer.a : 0)
radius: Appearance.rounding.normal radius: Appearance.rounding.normal
@ -170,13 +194,15 @@ RowLayout {
spacing: Appearance.spacing.normal spacing: Appearance.spacing.normal
MaterialIcon { MaterialIcon {
text: Audio.source?.id === modelData.id ? "mic" : "mic_external_on" text: "mic"
font.pointSize: Appearance.font.size.large font.pointSize: Appearance.font.size.large
fill: Audio.source?.id === modelData.id ? 1 : 0 fill: Audio.source?.id === modelData.id ? 1 : 0
} }
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight
maximumLineCount: 1
text: modelData.description || qsTr("Unknown") text: modelData.description || qsTr("Unknown")
font.weight: Audio.source?.id === modelData.id ? 500 : 400 font.weight: Audio.source?.id === modelData.id ? 500 : 400
@ -187,6 +213,9 @@ RowLayout {
} }
} }
} }
}
}
}
InnerBorder { InnerBorder {
leftThickness: 0 leftThickness: 0

View file

@ -106,6 +106,13 @@ RowLayout {
title: qsTr("Ethernet") title: qsTr("Ethernet")
expanded: true expanded: true
onToggleRequested: {
if (!expanded) {
// Opening ethernet, close wireless
wirelessListSection.expanded = false;
}
}
ColumnLayout { ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
spacing: Appearance.spacing.small spacing: Appearance.spacing.small
@ -233,6 +240,13 @@ RowLayout {
title: qsTr("Wireless") title: qsTr("Wireless")
expanded: true expanded: true
onToggleRequested: {
if (!expanded) {
// Opening wireless, close ethernet
ethernetListSection.expanded = false;
}
}
ColumnLayout { ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
spacing: Appearance.spacing.small spacing: Appearance.spacing.small