Add WallpaperSelector, add some scrolling in SettingsWindow

This commit is contained in:
Ly-sec 2025-08-12 17:26:23 +02:00
parent eff47f504f
commit 8155ef20eb
14 changed files with 1451 additions and 674 deletions

View file

@ -1,113 +1,143 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import qs.Services
import qs.Widgets
Item {
id: generalPage
ColumnLayout {
id: root
// Public API
// Scaling factor provided by the parent settings window
property real scaling: 1
// Tab metadata
readonly property string tabIcon: "tune"
readonly property string tabLabel: "General"
readonly property int tabIndex: 0
spacing: 0
Layout.fillWidth: true
Layout.fillHeight: true
ScrollView {
id: scrollView
ColumnLayout {
anchors.fill: parent
anchors.margins: 0
spacing: Style.marginMedium * scaling
Layout.fillWidth: true
Layout.fillHeight: true
padding: 16
rightPadding: 12
clip: true
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
ScrollBar.vertical.policy: ScrollBar.AsNeeded
// Profile section
NText {
text: "Profile"
font.weight: Style.fontWeightBold
color: Colors.accentSecondary
}
ColumnLayout {
width: scrollView.availableWidth
spacing: 0
RowLayout {
Layout.fillWidth: true
spacing: Style.marginMedium * scaling
// Avatar preview
NImageRounded {
width: 64 * scaling
height: 64 * scaling
imagePath: Settings.data.general.avatarImage
fallbackIcon: "person"
borderColor: Colors.accentPrimary
borderWidth: Math.max(1, Style.borderMedium * scaling)
}
ColumnLayout {
Item {
Layout.fillWidth: true
spacing: 2 * scaling
Layout.preferredHeight: 0
}
ColumnLayout {
spacing: 4
Layout.fillWidth: true
NText {
text: "Profile Image"
color: Colors.textPrimary
text: "General Settings"
font.pointSize: 18
font.weight: Style.fontWeightBold
color: Colors.textPrimary
Layout.bottomMargin: 8
}
NText {
text: "Your profile picture displayed in various places throughout the shell"
color: Colors.textSecondary
font.pointSize: Style.fontSizeSmall * scaling
}
NTextInput {
text: Settings.data.general.avatarImage
placeholderText: "/home/user/.face"
// Profile section
ColumnLayout {
spacing: 8
Layout.fillWidth: true
onEditingFinished: function () {
Settings.data.general.avatarImage = text
Layout.topMargin: 8
NText {
text: "Profile"
font.pointSize: 13
font.weight: Style.fontWeightBold
color: Colors.textPrimary
}
RowLayout {
Layout.fillWidth: true
spacing: 16
// Avatar preview
NImageRounded {
width: 64
height: 64
imagePath: Settings.data.general.avatarImage
fallbackIcon: "person"
borderColor: Colors.accentPrimary
borderWidth: Math.max(1, Style.borderMedium)
}
ColumnLayout {
Layout.fillWidth: true
spacing: 4
NText {
text: "Profile Image"
color: Colors.textPrimary
font.weight: Style.fontWeightBold
}
NText {
text: "Your profile picture displayed in various places throughout the shell"
color: Colors.textSecondary
font.pointSize: 12
}
NTextInput {
text: Settings.data.general.avatarImage
placeholderText: "/home/user/.face"
Layout.fillWidth: true
onEditingFinished: function () {
Settings.data.general.avatarImage = text
}
}
}
}
}
}
NDivider {
Layout.fillWidth: true
Layout.topMargin: 26
Layout.bottomMargin: 18
}
ColumnLayout {
spacing: 4
Layout.fillWidth: true
NText {
text: "User Interface"
font.pointSize: 18
font.weight: Style.fontWeightBold
color: Colors.textPrimary
Layout.bottomMargin: 8
}
NToggle {
label: "Show Corners"
description: "Display rounded corners on the edge of the screen"
value: Settings.data.general.showScreenCorners
onToggled: function (v) {
Settings.data.general.showScreenCorners = v
}
}
NToggle {
label: "Show Dock"
description: "Display a dock at the bottom of the screen for quick access to applications"
value: Settings.data.general.showDock
onToggled: function (v) {
Settings.data.general.showDock = v
}
}
NToggle {
label: "Dim Desktop"
description: "Dim the desktop when panels or menus are open"
value: Settings.data.general.dimDesktop
onToggled: function (v) {
Settings.data.general.dimDesktop = v
}
}
}
}
NDivider {
Layout.fillWidth: true
Layout.topMargin: Style.marginSmall * scaling
Layout.bottomMargin: Style.marginSmall * scaling
}
// UI section
NText {
text: "User Interface"
font.weight: Style.fontWeightBold
color: Colors.accentSecondary
}
NToggle {
label: "Show Corners"
description: "Display rounded corners on the edge of the screen"
value: Settings.data.general.showScreenCorners
onToggled: function (v) {
Settings.data.general.showScreenCorners = v
}
}
NToggle {
label: "Show Dock"
description: "Display a dock at the bottom of the screen for quick access to applications"
value: Settings.data.general.showDock
onToggled: function (v) {
Settings.data.general.showDock = v
}
}
NToggle {
label: "Dim Desktop"
description: "Dim the desktop when panels or menus are open"
value: Settings.data.general.dimDesktop
onToggled: function (v) {
Settings.data.general.dimDesktop = v
}
}
Item {
Layout.fillHeight: true
}
}
}