never/noctalia-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Settings / Display-Scaling tab: improved display at low scaling + fixed refresh button look

Browse source
This commit is contained in:
LemmyCook 2025-08-25 22:47:32 -04:00
parent 1ab3463e6d
commit a61526543d
1 changed files with 15 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

32
Modules/SettingsPanel/Tabs/DisplayTab.qml
View file

@ -32,11 +32,11 @@ Item {
clip: true clip: true
ScrollBar.vertical.policy: ScrollBar.AsNeeded ScrollBar.vertical.policy: ScrollBar.AsNeeded
ScrollBar.horizontal.policy: ScrollBar.AsNeeded ScrollBar.horizontal.policy: ScrollBar.AsNeeded
contentWidth: parent.width contentWidth: Math.max(parent.width, 600 * scaling)
ColumnLayout { ColumnLayout {
id: contentColumn id: contentColumn
width: Math.max(parent.width, 300) // Minimum reasonable width without scaling width: Math.max(parent.width, 600 * scaling)
ColumnLayout { ColumnLayout {
spacing: Style.marginL * scaling spacing: Style.marginL * scaling
@ -54,14 +54,16 @@ Item {
text: "By default, bars and notifications are shown on all displays. Select one or more below to narrow your view." text: "By default, bars and notifications are shown on all displays. Select one or more below to narrow your view."
font.pointSize: Style.fontSize * scaling font.pointSize: Style.fontSize * scaling
color: Color.mOnSurfaceVariant color: Color.mOnSurfaceVariant
wrapMode: Text.WordWrap
Layout.fillWidth: true
Layout.preferredWidth: parent.width - (Style.marginL * 2 * scaling)
} }
Repeater { Repeater {
model: Quickshell.screens || [] model: Quickshell.screens || []
delegate: Rectangle { delegate: Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
// Remove the scaling-based minimum width that causes issues at low scaling Layout.minimumWidth: 550 * scaling
// Layout.minimumWidth: 400 * scaling
radius: Style.radiusM * scaling radius: Style.radiusM * scaling
color: Color.mSurface color: Color.mSurface
border.color: Color.mOutline border.color: Color.mOutline
@ -73,7 +75,6 @@ Item {
anchors.fill: parent anchors.fill: parent
anchors.margins: Style.marginL * scaling anchors.margins: Style.marginL * scaling
spacing: Style.marginXXS * scaling spacing: Style.marginXXS * scaling
Layout.minimumWidth: 0
NText { NText {
text: (modelData.name || "Unknown") text: (modelData.name || "Unknown")
@ -86,16 +87,16 @@ Item {
text: `Resolution: ${modelData.width}x${modelData.height} - Position: (${modelData.x}, ${modelData.y})` text: `Resolution: ${modelData.width}x${modelData.height} - Position: (${modelData.x}, ${modelData.y})`
font.pointSize: Style.fontSizeXS * scaling font.pointSize: Style.fontSizeXS * scaling
color: Color.mOnSurfaceVariant color: Color.mOnSurfaceVariant
wrapMode: Text.WordWrap
Layout.fillWidth: true
} }
ColumnLayout { ColumnLayout {
spacing: Style.marginL * scaling spacing: Style.marginL * scaling
Layout.minimumWidth: 0
Layout.fillWidth: true Layout.fillWidth: true
NToggle { NToggle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumWidth: 0
label: "Bar" label: "Bar"
description: "Enable the bar on this monitor." description: "Enable the bar on this monitor."
checked: (Settings.data.bar.monitors || []).indexOf(modelData.name) !== -1 checked: (Settings.data.bar.monitors || []).indexOf(modelData.name) !== -1
@ -110,7 +111,6 @@ Item {
NToggle { NToggle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumWidth: 0
label: "Notifications" label: "Notifications"
description: "Enable notifications on this monitor." description: "Enable notifications on this monitor."
checked: (Settings.data.notifications.monitors || []).indexOf(modelData.name) !== -1 checked: (Settings.data.notifications.monitors || []).indexOf(modelData.name) !== -1
@ -127,7 +127,6 @@ Item {
NToggle { NToggle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumWidth: 0
label: "Dock" label: "Dock"
description: "Enable the dock on this monitor." description: "Enable the dock on this monitor."
checked: (Settings.data.dock.monitors || []).indexOf(modelData.name) !== -1 checked: (Settings.data.dock.monitors || []).indexOf(modelData.name) !== -1
@ -142,16 +141,16 @@ Item {
} }
ColumnLayout { ColumnLayout {
spacing: Style.marginL * scaling spacing: Style.marginS * scaling
Layout.fillWidth: true Layout.fillWidth: true
RowLayout { RowLayout {
Layout.fillWidth: true Layout.fillWidth: true
spacing: Style.marginL * scaling
ColumnLayout { ColumnLayout {
spacing: Style.marginXXS * scaling spacing: Style.marginXXS * scaling
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumWidth: 0
NText { NText {
text: "Scale" text: "Scale"
@ -171,18 +170,18 @@ Item {
NText { NText {
text: `${Math.round(ScalingService.scaleByName(modelData.name) * 100)}%` text: `${Math.round(ScalingService.scaleByName(modelData.name) * 100)}%`
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
Layout.minimumWidth: implicitWidth Layout.minimumWidth: 50 * scaling
horizontalAlignment: Text.AlignRight
} }
} }
RowLayout { RowLayout {
spacing: Style.marginS * scaling spacing: Style.marginS * scaling
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumWidth: 0
NSlider { NSlider {
id: scaleSlider id: scaleSlider
from: 0.6 from: 0.7
to: 1.8 to: 1.8
stepSize: 0.01 stepSize: 0.01
value: ScalingService.scaleByName(modelData.name) value: ScalingService.scaleByName(modelData.name)
@ -192,15 +191,12 @@ Item {
Settings.data.monitorsScaling = data Settings.data.monitorsScaling = data
} }
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumWidth: 50 // Ensure minimum slider width Layout.minimumWidth: 150 * scaling
} }
NIconButton { NIconButton {
icon: "refresh" icon: "refresh"
tooltipText: "Reset Scaling" tooltipText: "Reset Scaling"
fontPointSize: Style.fontSizeL * scaling
Layout.preferredWidth: implicitWidth
Layout.minimumWidth: implicitWidth
onClicked: { onClicked: {
var data = Settings.data.monitorsScaling || {} var data = Settings.data.monitorsScaling || {}
data[modelData.name] = 1.0 data[modelData.name] = 1.0