1
0
mirror of https://github.com/AvengeMedia/DankMaterialShell.git synced 2025-12-11 07:52:50 -05:00

consistency in top bar tab of settings

This commit is contained in:
bbedward
2025-08-19 23:58:54 -04:00
parent b45a7709bb
commit 6e0977c719
3 changed files with 454 additions and 342 deletions

View File

@@ -1,5 +1,6 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import qs.Common
import qs.Services
import qs.Widgets
@@ -512,326 +513,6 @@ Item {
}
Row {
width: parent.width
spacing: Theme.spacingM
DankIcon {
name: "widgets"
size: Theme.iconSize
color: Theme.primary
anchors.verticalCenter: parent.verticalCenter
}
StyledText {
text: "Widget Management"
font.pixelSize: Theme.fontSizeLarge
font.weight: Font.Medium
color: Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
Item {
width: parent.width - 400
height: 1
}
Rectangle {
width: 80
height: 28
radius: Theme.cornerRadius
color: resetArea.containsMouse ? Theme.surfacePressed : Theme.surfaceVariant
anchors.verticalCenter: parent.verticalCenter
border.width: 1
border.color: resetArea.containsMouse ? Theme.outline : Qt.rgba(
Theme.outline.r,
Theme.outline.g,
Theme.outline.b, 0.5)
Row {
anchors.centerIn: parent
spacing: Theme.spacingXS
DankIcon {
name: "refresh"
size: 14
color: Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
StyledText {
text: "Reset"
font.pixelSize: Theme.fontSizeSmall
font.weight: Font.Medium
color: Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
}
MouseArea {
id: resetArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
SettingsData.setTopBarLeftWidgets(defaultLeftWidgets)
SettingsData.setTopBarCenterWidgets(defaultCenterWidgets)
SettingsData.setTopBarRightWidgets(defaultRightWidgets)
}
}
Behavior on color {
ColorAnimation {
duration: Theme.shortDuration
easing.type: Theme.standardEasing
}
}
Behavior on border.color {
ColorAnimation {
duration: Theme.shortDuration
easing.type: Theme.standardEasing
}
}
}
}
Rectangle {
width: parent.width
height: messageText.contentHeight + Theme.spacingM * 2
radius: Theme.cornerRadius
color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g,
Theme.surfaceVariant.b, 0.3)
border.color: Qt.rgba(Theme.outline.r, Theme.outline.g,
Theme.outline.b, 0.2)
border.width: 1
StyledText {
id: messageText
anchors.centerIn: parent
text: "Drag widgets to reorder within sections. Use the eye icon to hide/show widgets (maintains spacing), or X to remove them completely."
font.pixelSize: Theme.fontSizeSmall
color: Theme.outline
width: parent.width - Theme.spacingM * 2
wrapMode: Text.WordWrap
}
}
Column {
width: parent.width
spacing: Theme.spacingL
WidgetsTabSection {
width: parent.width
title: "Left Section"
titleIcon: "format_align_left"
sectionId: "left"
allWidgets: topBarTab.baseWidgetDefinitions
items: topBarTab.getItemsForSection("left")
onItemEnabledChanged: (sectionId, itemId, enabled) => {
topBarTab.handleItemEnabledChanged(sectionId,
itemId,
enabled)
}
onItemOrderChanged: newOrder => {
topBarTab.handleItemOrderChanged("left",
newOrder)
}
onAddWidget: sectionId => {
widgetSelectionPopup.allWidgets = topBarTab.baseWidgetDefinitions
widgetSelectionPopup.targetSection = sectionId
widgetSelectionPopup.safeOpen()
}
onRemoveWidget: (sectionId, widgetIndex) => {
topBarTab.removeWidgetFromSection(sectionId,
widgetIndex)
}
onSpacerSizeChanged: (sectionId, itemId, newSize) => {
topBarTab.handleSpacerSizeChanged(sectionId,
itemId,
newSize)
}
onCompactModeChanged: (widgetId, value) => {
if (widgetId === "clock") {
SettingsData.setClockCompactMode(value)
} else if (widgetId === "music") {
SettingsData.setMediaSize(value)
} else if (widgetId === "focusedWindow") {
SettingsData.setFocusedWindowCompactMode(value)
} else if (widgetId === "runningApps") {
SettingsData.setRunningAppsCompactMode(value)
}
}
onGpuSelectionChanged: (sectionId, widgetIndex, selectedIndex) => {
topBarTab.handleGpuSelectionChanged(
sectionId, widgetIndex, selectedIndex)
}
}
WidgetsTabSection {
width: parent.width
title: "Center Section"
titleIcon: "format_align_center"
sectionId: "center"
allWidgets: topBarTab.baseWidgetDefinitions
items: topBarTab.getItemsForSection("center")
onItemEnabledChanged: (sectionId, itemId, enabled) => {
topBarTab.handleItemEnabledChanged(sectionId,
itemId,
enabled)
}
onItemOrderChanged: newOrder => {
topBarTab.handleItemOrderChanged("center",
newOrder)
}
onAddWidget: sectionId => {
widgetSelectionPopup.allWidgets = topBarTab.baseWidgetDefinitions
widgetSelectionPopup.targetSection = sectionId
widgetSelectionPopup.safeOpen()
}
onRemoveWidget: (sectionId, widgetIndex) => {
topBarTab.removeWidgetFromSection(sectionId,
widgetIndex)
}
onSpacerSizeChanged: (sectionId, itemId, newSize) => {
topBarTab.handleSpacerSizeChanged(sectionId,
itemId,
newSize)
}
onCompactModeChanged: (widgetId, value) => {
if (widgetId === "clock") {
SettingsData.setClockCompactMode(value)
} else if (widgetId === "music") {
SettingsData.setMediaSize(value)
} else if (widgetId === "focusedWindow") {
SettingsData.setFocusedWindowCompactMode(value)
} else if (widgetId === "runningApps") {
SettingsData.setRunningAppsCompactMode(value)
}
}
onGpuSelectionChanged: (sectionId, widgetIndex, selectedIndex) => {
topBarTab.handleGpuSelectionChanged(
sectionId, widgetIndex, selectedIndex)
}
}
WidgetsTabSection {
width: parent.width
title: "Right Section"
titleIcon: "format_align_right"
sectionId: "right"
allWidgets: topBarTab.baseWidgetDefinitions
items: topBarTab.getItemsForSection("right")
onItemEnabledChanged: (sectionId, itemId, enabled) => {
topBarTab.handleItemEnabledChanged(sectionId,
itemId,
enabled)
}
onItemOrderChanged: newOrder => {
topBarTab.handleItemOrderChanged("right",
newOrder)
}
onAddWidget: sectionId => {
widgetSelectionPopup.allWidgets = topBarTab.baseWidgetDefinitions
widgetSelectionPopup.targetSection = sectionId
widgetSelectionPopup.safeOpen()
}
onRemoveWidget: (sectionId, widgetIndex) => {
topBarTab.removeWidgetFromSection(sectionId,
widgetIndex)
}
onSpacerSizeChanged: (sectionId, itemId, newSize) => {
topBarTab.handleSpacerSizeChanged(sectionId,
itemId,
newSize)
}
onCompactModeChanged: (widgetId, value) => {
if (widgetId === "clock") {
SettingsData.setClockCompactMode(value)
} else if (widgetId === "music") {
SettingsData.setMediaSize(value)
} else if (widgetId === "focusedWindow") {
SettingsData.setFocusedWindowCompactMode(value)
} else if (widgetId === "runningApps") {
SettingsData.setRunningAppsCompactMode(value)
}
}
onGpuSelectionChanged: (sectionId, widgetIndex, selectedIndex) => {
topBarTab.handleGpuSelectionChanged(
sectionId, widgetIndex, selectedIndex)
}
}
}
// Corner Radius
StyledRect {
width: parent.width
height: cornerRadiusSection.implicitHeight + Theme.spacingL * 2
radius: Theme.cornerRadius
color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
border.width: 1
Column {
id: cornerRadiusSection
anchors.fill: parent
anchors.margins: Theme.spacingL
spacing: Theme.spacingM
Row {
width: parent.width
spacing: Theme.spacingM
DankIcon {
name: "rounded_corner"
size: Theme.iconSize
color: Theme.primary
anchors.verticalCenter: parent.verticalCenter
}
StyledText {
text: "Corner Radius"
font.pixelSize: Theme.fontSizeLarge
font.weight: Font.Medium
color: Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
}
Column {
width: parent.width
spacing: Theme.spacingS
StyledText {
text: "Bar & Widget Corner Roundness"
font.pixelSize: Theme.fontSizeSmall
color: Theme.surfaceText
font.weight: Font.Medium
}
DankSlider {
width: parent.width
height: 24
value: SettingsData.cornerRadius
minimum: 0
maximum: 32
unit: ""
showValue: true
onSliderValueChanged: (newValue) => {
SettingsData.setCornerRadius(newValue);
}
}
}
}
}
// Spacing
StyledRect {
width: parent.width
@@ -908,6 +589,302 @@ Item {
}
}
// Widget Management Section
StyledRect {
width: parent.width
height: widgetManagementSection.implicitHeight + Theme.spacingL * 2
radius: Theme.cornerRadius
color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
border.width: 1
Column {
id: widgetManagementSection
anchors.fill: parent
anchors.margins: Theme.spacingL
spacing: Theme.spacingM
RowLayout {
width: parent.width
spacing: Theme.spacingM
DankIcon {
id: widgetIcon
name: "widgets"
size: Theme.iconSize
color: Theme.primary
Layout.alignment: Qt.AlignVCenter
}
StyledText {
id: widgetTitle
text: "Widget Management"
font.pixelSize: Theme.fontSizeLarge
font.weight: Font.Medium
color: Theme.surfaceText
Layout.alignment: Qt.AlignVCenter
}
Item {
height: 1
Layout.fillWidth: true
}
Rectangle {
id: resetButton
width: 80
height: 28
radius: Theme.cornerRadius
color: resetArea.containsMouse ? Theme.surfacePressed : Theme.surfaceVariant
Layout.alignment: Qt.AlignVCenter
border.width: 1
border.color: resetArea.containsMouse ? Theme.outline : Qt.rgba(
Theme.outline.r,
Theme.outline.g,
Theme.outline.b, 0.5)
Row {
anchors.centerIn: parent
spacing: Theme.spacingXS
DankIcon {
name: "refresh"
size: 14
color: Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
StyledText {
text: "Reset"
font.pixelSize: Theme.fontSizeSmall
font.weight: Font.Medium
color: Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
}
MouseArea {
id: resetArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
SettingsData.setTopBarLeftWidgets(defaultLeftWidgets)
SettingsData.setTopBarCenterWidgets(defaultCenterWidgets)
SettingsData.setTopBarRightWidgets(defaultRightWidgets)
}
}
Behavior on color {
ColorAnimation {
duration: Theme.shortDuration
easing.type: Theme.standardEasing
}
}
Behavior on border.color {
ColorAnimation {
duration: Theme.shortDuration
easing.type: Theme.standardEasing
}
}
}
}
StyledText {
width: parent.width
text: "Drag widgets to reorder within sections. Use the eye icon to hide/show widgets (maintains spacing), or X to remove them completely."
font.pixelSize: Theme.fontSizeSmall
color: Theme.surfaceVariantText
wrapMode: Text.WordWrap
}
}
}
Column {
width: parent.width
spacing: Theme.spacingL
// Left Section
StyledRect {
width: parent.width
height: leftSection.implicitHeight + Theme.spacingL * 2
radius: Theme.cornerRadius
color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
border.width: 1
WidgetsTabSection {
id: leftSection
anchors.fill: parent
anchors.margins: Theme.spacingL
title: "Left Section"
titleIcon: "format_align_left"
sectionId: "left"
allWidgets: topBarTab.baseWidgetDefinitions
items: topBarTab.getItemsForSection("left")
onItemEnabledChanged: (sectionId, itemId, enabled) => {
topBarTab.handleItemEnabledChanged(sectionId,
itemId,
enabled)
}
onItemOrderChanged: newOrder => {
topBarTab.handleItemOrderChanged("left",
newOrder)
}
onAddWidget: sectionId => {
widgetSelectionPopup.allWidgets = topBarTab.baseWidgetDefinitions
widgetSelectionPopup.targetSection = sectionId
widgetSelectionPopup.safeOpen()
}
onRemoveWidget: (sectionId, widgetIndex) => {
topBarTab.removeWidgetFromSection(sectionId,
widgetIndex)
}
onSpacerSizeChanged: (sectionId, itemId, newSize) => {
topBarTab.handleSpacerSizeChanged(sectionId,
itemId,
newSize)
}
onCompactModeChanged: (widgetId, value) => {
if (widgetId === "clock") {
SettingsData.setClockCompactMode(value)
} else if (widgetId === "music") {
SettingsData.setMediaSize(value)
} else if (widgetId === "focusedWindow") {
SettingsData.setFocusedWindowCompactMode(value)
} else if (widgetId === "runningApps") {
SettingsData.setRunningAppsCompactMode(value)
}
}
onGpuSelectionChanged: (sectionId, widgetIndex, selectedIndex) => {
topBarTab.handleGpuSelectionChanged(
sectionId, widgetIndex, selectedIndex)
}
}
}
// Center Section
StyledRect {
width: parent.width
height: centerSection.implicitHeight + Theme.spacingL * 2
radius: Theme.cornerRadius
color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
border.width: 1
WidgetsTabSection {
id: centerSection
anchors.fill: parent
anchors.margins: Theme.spacingL
title: "Center Section"
titleIcon: "format_align_center"
sectionId: "center"
allWidgets: topBarTab.baseWidgetDefinitions
items: topBarTab.getItemsForSection("center")
onItemEnabledChanged: (sectionId, itemId, enabled) => {
topBarTab.handleItemEnabledChanged(sectionId,
itemId,
enabled)
}
onItemOrderChanged: newOrder => {
topBarTab.handleItemOrderChanged("center",
newOrder)
}
onAddWidget: sectionId => {
widgetSelectionPopup.allWidgets = topBarTab.baseWidgetDefinitions
widgetSelectionPopup.targetSection = sectionId
widgetSelectionPopup.safeOpen()
}
onRemoveWidget: (sectionId, widgetIndex) => {
topBarTab.removeWidgetFromSection(sectionId,
widgetIndex)
}
onSpacerSizeChanged: (sectionId, itemId, newSize) => {
topBarTab.handleSpacerSizeChanged(sectionId,
itemId,
newSize)
}
onCompactModeChanged: (widgetId, value) => {
if (widgetId === "clock") {
SettingsData.setClockCompactMode(value)
} else if (widgetId === "music") {
SettingsData.setMediaSize(value)
} else if (widgetId === "focusedWindow") {
SettingsData.setFocusedWindowCompactMode(value)
} else if (widgetId === "runningApps") {
SettingsData.setRunningAppsCompactMode(value)
}
}
onGpuSelectionChanged: (sectionId, widgetIndex, selectedIndex) => {
topBarTab.handleGpuSelectionChanged(
sectionId, widgetIndex, selectedIndex)
}
}
}
// Right Section
StyledRect {
width: parent.width
height: rightSection.implicitHeight + Theme.spacingL * 2
radius: Theme.cornerRadius
color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
border.width: 1
WidgetsTabSection {
id: rightSection
anchors.fill: parent
anchors.margins: Theme.spacingL
title: "Right Section"
titleIcon: "format_align_right"
sectionId: "right"
allWidgets: topBarTab.baseWidgetDefinitions
items: topBarTab.getItemsForSection("right")
onItemEnabledChanged: (sectionId, itemId, enabled) => {
topBarTab.handleItemEnabledChanged(sectionId,
itemId,
enabled)
}
onItemOrderChanged: newOrder => {
topBarTab.handleItemOrderChanged("right",
newOrder)
}
onAddWidget: sectionId => {
widgetSelectionPopup.allWidgets = topBarTab.baseWidgetDefinitions
widgetSelectionPopup.targetSection = sectionId
widgetSelectionPopup.safeOpen()
}
onRemoveWidget: (sectionId, widgetIndex) => {
topBarTab.removeWidgetFromSection(sectionId,
widgetIndex)
}
onSpacerSizeChanged: (sectionId, itemId, newSize) => {
topBarTab.handleSpacerSizeChanged(sectionId,
itemId,
newSize)
}
onCompactModeChanged: (widgetId, value) => {
if (widgetId === "clock") {
SettingsData.setClockCompactMode(value)
} else if (widgetId === "music") {
SettingsData.setMediaSize(value)
} else if (widgetId === "focusedWindow") {
SettingsData.setFocusedWindowCompactMode(value)
} else if (widgetId === "runningApps") {
SettingsData.setRunningAppsCompactMode(value)
}
}
onGpuSelectionChanged: (sectionId, widgetIndex, selectedIndex) => {
topBarTab.handleGpuSelectionChanged(
sectionId, widgetIndex, selectedIndex)
}
}
}
}
}
}