Update: Refactored how layout positioning works.

This commit is contained in:
Keyitdev
2026-07-10 19:03:51 +02:00
parent 61e74ac096
commit 60a73a22ef
6 changed files with 170 additions and 115 deletions
+15 -17
View File
@@ -15,8 +15,8 @@ Column {
property ComboBox exposeSession: sessionSelect.exposeSession property ComboBox exposeSession: sessionSelect.exposeSession
property bool failed property bool failed
// Custom addition: exposes the face icon of the currently typed/selected readonly property real fontUnit: root.font.pointSize
// user so it can be shown in ProfilePicture, above the login field
property url currentUserIcon: { property url currentUserIcon: {
var typedUser = username.text var typedUser = username.text
for (var i = 0; i < userRegistry.list.length; i++) { for (var i = 0; i < userRegistry.list.length; i++) {
@@ -58,8 +58,7 @@ Column {
Item { Item {
id: errorMessageField id: errorMessageField
// change also in selectSession height: fontUnit * 1.5
height: root.font.pointSize * 2
width: parent.width / 2 width: parent.width / 2
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
@@ -69,7 +68,8 @@ Column {
width: parent.width width: parent.width
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: failed ? config.TranslateLoginFailedWarning || textConstants.loginFailed + "!" : keyboard.capsLock ? config.TranslateCapslockWarning || textConstants.capslockWarning : null text: failed ? config.TranslateLoginFailedWarning || textConstants.loginFailed + "!" : keyboard.capsLock ? config.TranslateCapslockWarning || textConstants.capslockWarning : ""
font.pointSize: root.font.pointSize * 0.8 font.pointSize: root.font.pointSize * 0.8
font.italic: true font.italic: true
color: config.WarningColor color: config.WarningColor
@@ -107,7 +107,7 @@ Column {
Item { Item {
id: usernameField id: usernameField
height: root.font.pointSize * 4.5 height: root.font.pointSize * 4
width: parent.width / 2 width: parent.width / 2
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
@@ -142,7 +142,7 @@ Column {
delegate: ItemDelegate { delegate: ItemDelegate {
// minus padding // minus padding
width: popupHandler.width - 20 width: popupHandler.width - (fontUnit * 1.5)
anchors.horizontalCenter: popupHandler.horizontalCenter anchors.horizontalCenter: popupHandler.horizontalCenter
contentItem: Text { contentItem: Text {
@@ -170,8 +170,8 @@ Column {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: selectUser.height * 0 anchors.leftMargin: selectUser.height * 0
icon.height: parent.height * 0.25 icon.height: parent.height * 0.3
icon.width: parent.height * 0.25 icon.width: parent.height * 0.3
enabled: false enabled: false
icon.color: config.UserIconColor icon.color: config.UserIconColor
icon.source: Qt.resolvedUrl("../Assets/User.svg") icon.source: Qt.resolvedUrl("../Assets/User.svg")
@@ -195,10 +195,10 @@ Column {
y: parent.height - username.height / 3 y: parent.height - username.height / 3
x: config.RightToLeftLayout == "true" ? -loginButton.width + selectUser.width : 0 x: config.RightToLeftLayout == "true" ? -loginButton.width + selectUser.width : 0
rightMargin: config.RightToLeftLayout == "true" ? root.padding + usernameField.width / 2 : undefined rightMargin: config.RightToLeftLayout == "true" ? root.padding + usernameField.width / 2 : undefined
padding: 10 padding: fontUnit * 0.75
contentItem: ListView { contentItem: ListView {
implicitHeight: contentHeight + 20 implicitHeight: contentHeight + (fontUnit * 1.5)
clip: true clip: true
model: selectUser.popup.visible ? selectUser.delegateModel : null model: selectUser.popup.visible ? selectUser.delegateModel : null
@@ -308,7 +308,7 @@ Column {
Item { Item {
id: passwordField id: passwordField
height: root.font.pointSize * 4.5 height: root.font.pointSize * 4
width: parent.width / 2 width: parent.width / 2
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
@@ -322,8 +322,8 @@ Column {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
z: 2 z: 2
icon.height: parent.height * 0.25 icon.height: parent.height * 0.3
icon.width: parent.height * 0.25 icon.width: parent.height * 0.3
icon.color: config.PasswordIconColor icon.color: config.PasswordIconColor
icon.source: Qt.resolvedUrl("../Assets/Password2.svg") icon.source: Qt.resolvedUrl("../Assets/Password2.svg")
@@ -443,9 +443,7 @@ Column {
Item { Item {
id: login id: login
// important height: loginButton.implicitHeight + (fontUnit * 3.7)
// try 4 or 9 ...
height: root.font.pointSize * 9
width: parent.width / 2 width: parent.width / 2
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
+91 -39
View File
@@ -2,70 +2,122 @@
// Copyright (C) 2022-2025 Keyitdev // Copyright (C) 2022-2025 Keyitdev
// Based on https://github.com/MarianArlt/sddm-sugar-dark // Based on https://github.com/MarianArlt/sddm-sugar-dark
// Distributed under the GPLv3+ License https://www.gnu.org/licenses/gpl-3.0.html // Distributed under the GPLv3+ License https://www.gnu.org/licenses/gpl-3.0.html
import QtQuick 2.15 import QtQuick 2.15
import QtQuick.Layouts 1.15 import QtQuick.Layouts 1.15
import SddmComponents 2.0 as SDDM import SddmComponents 2.0 as SDDM
Item {
ColumnLayout {
id: formContainer id: formContainer
SDDM.TextConstants { id: textConstants } SDDM.TextConstants { id: textConstants }
property int p: config.ScreenPadding == "" ? 0 : config.ScreenPadding readonly property real fontUnit: root.font.pointSize
property string a: config.FormPosition
readonly property real clockTopMargin: (Number(config.ClockTopMargin) || 0) * fontUnit
readonly property real profilePictureTopMargin: (Number(config.ProfilePictureTopMargin) || 0) * fontUnit
readonly property real loginInputTopMargin: (Number(config.LoginInputTopMargin) || 0) * fontUnit
readonly property real systemButtonsBottomMargin: (Number(config.SystemButtonsBottomMargin) || 0) * fontUnit
readonly property real sessionSelectBottomMargin: (Number(config.SessionSelectBottomMargin) || 0) * fontUnit
readonly property real virtualKeyboardButtonBottomMargin: (Number(config.VirtualKeyboardButtonBottomMargin) || 0) * fontUnit
ColumnLayout {
id: topGroup
spacing: 0
anchors.top: parent.top
anchors.horizontalCenter: parent.horizontalCenter
Rectangle {
id: clockBox
color: "transparent"
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: clockTopMargin
Layout.preferredHeight: clock.implicitHeight + (fontUnit * 1.5)
implicitWidth: clock.implicitWidth + (fontUnit * 3)
radius: 20
Layout.preferredWidth: implicitWidth
Clock { Clock {
anchors.fill: parent
id: clock id: clock
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom Layout.alignment: Qt.AlignHCenter
// important
Layout.preferredHeight: root.height / 3
Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
} }
}
Rectangle {
id: profilePictureBox
color: "transparent"
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: profilePictureTopMargin
Layout.preferredHeight: profilePicture.height
implicitWidth: profilePicture.width + (fontUnit * 3)
Layout.preferredWidth: implicitWidth
ProfilePicture { ProfilePicture {
id: profilePicture id: profilePicture
visible: false visible: config.ShowProfilePicture == "true" ? true : false
Layout.alignment: Qt.AlignHCenter anchors.centerIn: parent
Layout.preferredWidth: root.height / 7 width: fontUnit * 11
Layout.preferredHeight: root.height / 7 height: fontUnit * 11
Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
} }
}
Rectangle {
id: inputBox
color: "transparent"
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: loginInputTopMargin
Layout.preferredHeight: input.implicitHeight
implicitWidth: input.implicitWidth
Layout.preferredWidth: implicitWidth
Input { Input {
id: input id: input
anchors.centerIn: parent
Layout.alignment: Qt.AlignVCenter width: fontUnit * 60
Layout.preferredHeight: root.height / 10 }
Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0 }
Layout.topMargin: 0
} }
ColumnLayout {
id: bottomGroup
spacing: 0
anchors.bottom: parent.bottom
anchors.horizontalCenter: parent.horizontalCenter
Rectangle {
id: systemButtonsBox
color: "transparent"
Layout.alignment: Qt.AlignHCenter
Layout.bottomMargin: systemButtonsBottomMargin
Layout.preferredHeight: systemButtons.implicitHeight
implicitWidth: systemButtons.implicitWidth
Layout.preferredWidth: implicitWidth
SystemButtons { SystemButtons {
id: systemButtons id: systemButtons
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
Layout.preferredHeight: root.height / 5
Layout.maximumHeight: root.height / 5
Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
exposedSession: input.exposeSession exposedSession: input.exposeSession
anchors.centerIn: parent
} }
}
Rectangle {
id: sessionSelectBox
color: "transparent"
Layout.alignment: Qt.AlignHCenter
Layout.bottomMargin: sessionSelectBottomMargin
Layout.preferredHeight: sessionSelect.height
implicitWidth: sessionSelect.width
Layout.preferredWidth: implicitWidth
SessionButton { SessionButton {
id: sessionSelect id: sessionSelect
anchors.centerIn: parent
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom width: fontUnit * 30
Layout.preferredHeight: root.height / 54
Layout.maximumHeight: root.height / 54
Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
} }
}
Rectangle {
id: virtualKeyboardButtonBox
color: "transparent"
Layout.alignment: Qt.AlignHCenter
Layout.bottomMargin: virtualKeyboardButtonBottomMargin
Layout.preferredHeight: virtualKeyboardButton.height
implicitWidth: virtualKeyboardButton.width
Layout.preferredWidth: implicitWidth
VirtualKeyboardButton { VirtualKeyboardButton {
id: virtualKeyboardButton id: virtualKeyboardButton
anchors.centerIn: parent
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop width: fontUnit * 30
Layout.preferredHeight: root.height / 27 }
Layout.maximumHeight: root.height / 27 }
Layout.leftMargin: p != "0" ? a == "left" ? -p : a == "right" ? p : 0 : 0
} }
} }
+1 -1
View File
@@ -3,7 +3,7 @@ import QtQuick.Effects
Item { Item {
id: profilePicture id: profilePicture
// visible: false
property url userIcon: input.currentUserIcon property url userIcon: input.currentUserIcon
property bool hasCustomIcon: userIcon != "" property bool hasCustomIcon: userIcon != ""
+2 -4
View File
@@ -9,7 +9,7 @@ import QtQuick.Controls 2.15
Item { Item {
id: sessionButton id: sessionButton
height: root.font.pointSize height: selectSession.height
width: parent.width / 2 width: parent.width / 2
property var selectedSession: selectSession.currentIndex property var selectedSession: selectSession.currentIndex
@@ -20,9 +20,7 @@ Item {
ComboBox { ComboBox {
id: selectSession id: selectSession
// important height: root.font.pointSize
// change also in errorMessage
height: root.font.pointSize * 2
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
hoverEnabled: true hoverEnabled: true
-1
View File
@@ -25,7 +25,6 @@ RowLayout {
RoundButton { RoundButton {
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
Layout.topMargin: root.font.pointSize * 6.5
text: modelData[1] text: modelData[1]
font.pointSize: root.font.pointSize * 0.8 font.pointSize: root.font.pointSize * 0.8
+9 -1
View File
@@ -6,9 +6,14 @@ import QtQuick 2.15
import QtQuick.Controls 2.15 import QtQuick.Controls 2.15
Item { Item {
id: virtualKeyboardButtonRoot
height: virtualKeyboardButton.height
width: parent.width / 2
Button { Button {
id: virtualKeyboardButton id: virtualKeyboardButton
height: root.font.pointSize
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
z: 1 z: 1
@@ -28,6 +33,9 @@ Item {
contentItem: Text { contentItem: Text {
id: virtualKeyboardButtonText id: virtualKeyboardButtonText
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
text: config.TranslateVirtualKeyboardButtonOff || "Virtual Keyboard (off)" text: config.TranslateVirtualKeyboardButtonOff || "Virtual Keyboard (off)"
font.pointSize: root.font.pointSize * 0.8 font.pointSize: root.font.pointSize * 0.8
font.family: root.font.family font.family: root.font.family