From 8fede53c826f43f9d79eff76078df4b474315a83 Mon Sep 17 00:00:00 2001 From: Malte E Date: Fri, 18 Feb 2022 20:20:52 +0100 Subject: [PATCH 1/4] let labels wrap and collapse below the back button --- resources/qml/pages/UserSettingsPage.qml | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/resources/qml/pages/UserSettingsPage.qml b/resources/qml/pages/UserSettingsPage.qml index 71a90a27..94e345e3 100644 --- a/resources/qml/pages/UserSettingsPage.qml +++ b/resources/qml/pages/UserSettingsPage.qml @@ -25,7 +25,9 @@ Rectangle { palette: Nheko.colors ScrollBar.horizontal.visible: false anchors.fill: parent - anchors.margins: Nheko.paddingLarge + //anchors.margins: Nheko.paddingLarge // padding right of the scrollbar is ugly anyway + anchors.topMargin: (collapsed? backButton.height : 0) + Nheko.paddingMedium + anchors.leftMargin: collapsed? Nheko.paddingMedium : Nheko.paddingLarge contentWidth: availableWidth @@ -48,7 +50,7 @@ Rectangle { columnSpacing: Nheko.paddingMedium anchors.fill: parent - anchors.leftMargin: userSettingsDialog.collapsed ? Nheko.paddingLarge : (userSettingsDialog.width-userSettingsDialog.collapsePoint) * 0.4 + anchors.leftMargin: userSettingsDialog.collapsed ? 0 : (userSettingsDialog.width-userSettingsDialog.collapsePoint) * 0.4 + Nheko.paddingLarge anchors.rightMargin: anchors.leftMargin Repeater { @@ -72,7 +74,7 @@ Rectangle { //Layout.column: 0 Layout.columnSpan: (model.type == UserSettingsModel.SectionTitle && !userSettingsDialog.collapsed) ? 2 : 1 //Layout.row: model.index - Layout.minimumWidth: implicitWidth + //Layout.minimumWidth: implicitWidth Layout.leftMargin: model.type == UserSettingsModel.SectionTitle ? 0 : Nheko.paddingMedium Layout.topMargin: model.type == UserSettingsModel.SectionTitle ? Nheko.paddingLarge : 0 font.pointSize: 1.1 * fontMetrics.font.pointSize @@ -84,6 +86,7 @@ Rectangle { ToolTip.visible: hovered.hovered && model.description ToolTip.text: model.description ?? "" ToolTip.delay: Nheko.tooltipDelay + wrapMode: Text.Wrap } DelegateChooser { @@ -237,6 +240,7 @@ Rectangle { } ImageButton { + id: backButton anchors.top: parent.top anchors.left: parent.left anchors.margins: Nheko.paddingMedium From af8fbb990bffeec6fb4fe3799b097d47d9bff56f Mon Sep 17 00:00:00 2001 From: Malte E Date: Sat, 19 Feb 2022 21:47:19 +0100 Subject: [PATCH 2/4] remove reparenting --- resources/qml/pages/UserSettingsPage.qml | 17 ++++++----------- 1 file changed, 6 insertions(+), 11 deletions(-) diff --git a/resources/qml/pages/UserSettingsPage.qml b/resources/qml/pages/UserSettingsPage.qml index 94e345e3..495d208b 100644 --- a/resources/qml/pages/UserSettingsPage.qml +++ b/resources/qml/pages/UserSettingsPage.qml @@ -42,12 +42,10 @@ Rectangle { } - GridLayout { + ColumnLayout { id: grid - columns: userSettingsDialog.collapsed ? 1 : 2 - rowSpacing: Nheko.paddingMedium - columnSpacing: Nheko.paddingMedium + spacing: Nheko.paddingMedium anchors.fill: parent anchors.leftMargin: userSettingsDialog.collapsed ? 0 : (userSettingsDialog.width-userSettingsDialog.collapsePoint) * 0.4 + Nheko.paddingLarge @@ -55,17 +53,14 @@ Rectangle { Repeater { model: UserSettingsModel + Layout.fillWidth:true - delegate: Item { + delegate: GridLayout { + columns: collapsed? 1 : 2 + rows: collapsed? 2: 1 required property var model id: r - Component.onCompleted: { - while (children.length) { - children[0].parent = grid; - } - } - Label { Layout.alignment: Qt.AlignLeft Layout.fillWidth: true From d941974e35cf7d9fa4f09c573e844885a8618cb0 Mon Sep 17 00:00:00 2001 From: Nicolas Werner Date: Sun, 20 Feb 2022 03:03:11 +0100 Subject: [PATCH 3/4] Simplify logic to suppress wheel events --- resources/qml/pages/UserSettingsPage.qml | 20 ++++++-------------- 1 file changed, 6 insertions(+), 14 deletions(-) diff --git a/resources/qml/pages/UserSettingsPage.qml b/resources/qml/pages/UserSettingsPage.qml index 495d208b..d6de7e4c 100644 --- a/resources/qml/pages/UserSettingsPage.qml +++ b/resources/qml/pages/UserSettingsPage.qml @@ -31,17 +31,6 @@ Rectangle { contentWidth: availableWidth - Timer { - id: deadTimer - interval: 500 - } - - Connections { - target: scroll.contentItem - function onContentYChanged() { deadTimer.restart(); } - } - - ColumnLayout { id: grid @@ -111,8 +100,9 @@ Rectangle { width: Math.min(parent.width, implicitWidth) model: r.model.values currentIndex: r.model.value - enabled: !deadTimer.running onCurrentIndexChanged: r.model.value = currentIndex + + WheelHandler{} // suppress scrolling changing values } } DelegateChoice { @@ -121,13 +111,14 @@ Rectangle { SpinBox { anchors.right: parent.right width: Math.min(parent.width, implicitWidth) - enabled: !deadTimer.running && model.enabled from: model.valueLowerBound to: model.valueUpperBound stepSize: model.valueStep value: model.value onValueChanged: model.value = value editable: true + + WheelHandler{} // suppress scrolling changing values } } DelegateChoice { @@ -141,7 +132,6 @@ Rectangle { anchors.right: parent.right width: Math.min(parent.width, implicitWidth) - enabled: !deadTimer.running && model.enabled from: model.valueLowerBound * div to: model.valueUpperBound * div stepSize: model.valueStep * div @@ -163,6 +153,8 @@ Rectangle { valueFromText: function(text, locale) { return Number.fromLocaleString(locale, text) * spinbox.div } + + WheelHandler{} // suppress scrolling changing values } } DelegateChoice { From 4f8e6602c491606369a2bafb711a08352f9215d7 Mon Sep 17 00:00:00 2001 From: Malte E Date: Sun, 20 Feb 2022 09:45:37 +0100 Subject: [PATCH 4/4] limit width of comboboxes and add bottomPadding --- resources/qml/pages/UserSettingsPage.qml | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/resources/qml/pages/UserSettingsPage.qml b/resources/qml/pages/UserSettingsPage.qml index d6de7e4c..6151e067 100644 --- a/resources/qml/pages/UserSettingsPage.qml +++ b/resources/qml/pages/UserSettingsPage.qml @@ -25,10 +25,9 @@ Rectangle { palette: Nheko.colors ScrollBar.horizontal.visible: false anchors.fill: parent - //anchors.margins: Nheko.paddingLarge // padding right of the scrollbar is ugly anyway - anchors.topMargin: (collapsed? backButton.height : 0) + Nheko.paddingMedium - anchors.leftMargin: collapsed? Nheko.paddingMedium : Nheko.paddingLarge - + anchors.topMargin: (collapsed? backButton.height : 0)+Nheko.paddingLarge + leftPadding: collapsed? Nheko.paddingMedium : Nheko.paddingLarge + bottomPadding: Nheko.paddingLarge contentWidth: availableWidth ColumnLayout { @@ -82,6 +81,7 @@ Rectangle { Layout.columnSpan: (model.type == UserSettingsModel.SectionTitle && !userSettingsDialog.collapsed) ? 2 : 1 Layout.preferredHeight: child.height Layout.preferredWidth: Math.min(child.implicitWidth, child.width || 1000) + Layout.maximumWidth: model.type == UserSettingsModel.SectionTitle ? Number.POSITIVE_INFINITY : 400 Layout.fillWidth: model.type == UserSettingsModel.SectionTitle || model.type == UserSettingsModel.Options || model.type == UserSettingsModel.Number Layout.rightMargin: model.type == UserSettingsModel.SectionTitle ? 0 : Nheko.paddingMedium