From 18f2737ae23fbffe55b8948bee5a39966b91eabb Mon Sep 17 00:00:00 2001 From: swurl Date: Thu, 16 Jan 2025 16:25:43 -0500 Subject: [PATCH] improve dialog dimensions & scaling Signed-off-by: swurl --- qml/dialogs/accent/AccentDisplay.qml | 48 +++++++--------------- qml/dialogs/accent/AccentEditor.qml | 6 ++- qml/widgets/config/BaseConfigDialog.qml | 7 +++- qml/widgets/config/SectionHeader.qml | 5 ++- qml/widgets/misc/CameraView.qml | 12 ++---- qml/widgets/misc/ErrorsWidget.qml | 2 - qml/widgets/primitive/BoolWidget.qml | 4 +- qml/widgets/primitive/ColorWidget.qml | 4 +- qml/widgets/primitive/DoubleDialWidget.qml | 6 +-- qml/widgets/primitive/DoubleWidget.qml | 2 - qml/widgets/primitive/EnumWidget.qml | 12 +++--- qml/widgets/primitive/IntDialWidget.qml | 6 +-- qml/widgets/primitive/IntWidget.qml | 4 +- qml/widgets/primitive/TextWidget.qml | 2 - qml/widgets/sendable/Command.qml | 2 - qml/widgets/sendable/FMSInfo.qml | 2 - qml/widgets/sendable/Field2d.qml | 20 +++++---- qml/widgets/sendable/StringChooser.qml | 10 ++--- 18 files changed, 61 insertions(+), 93 deletions(-) diff --git a/qml/dialogs/accent/AccentDisplay.qml b/qml/dialogs/accent/AccentDisplay.qml index c661d616..343ffa61 100644 --- a/qml/dialogs/accent/AccentDisplay.qml +++ b/qml/dialogs/accent/AccentDisplay.qml @@ -7,7 +7,7 @@ import QFRCDashboard Rectangle { clip: true - height: 100 * Constants.scalar + height: 85 * Constants.scalar border { color: "white" width: 2 * Constants.scalar @@ -23,16 +23,17 @@ Rectangle { } RowLayout { + id: fields anchors { + top: parent.top left: parent.left right: parent.right - margins: 5 + margins: 5 * Constants.scalar } width: parent.width uniformCellSizes: true - height: 50 * Constants.scalar TextField { Layout.fillWidth: true @@ -81,65 +82,47 @@ Rectangle { Component.onCompleted: currentIndex = indexOfValue(getQml()) id: qml - model: [ - "Lime", - "Green", - "Emerald", - "Teal", - "Cyan", - "Cobalt", - "Indigo", - "Violet", - "Pink", - "Magenta", - "Crimson", - "Red", - "Orange", - "Amber", - "Yellow", - "Brown", - "Olive", - "Steel", - "Mauve", - "Taupe", - ] + model: ["Lime", "Green", "Emerald", "Teal", "Cyan", "Cobalt", "Indigo", "Violet", "Pink", "Magenta", "Crimson", "Red", "Orange", "Amber", "Yellow", "Brown", "Olive", "Steel", "Mauve", "Taupe"] font.pixelSize: Math.round(15 * Constants.scalar) - onActivated: (index) => setQml(currentText) + onActivated: index => setQml(currentText) } } RowLayout { id: preview uniformCellSizes: true - y: 50 * Constants.scalar anchors { left: parent.left right: parent.right + top: fields.bottom + margins: 8 * Constants.scalar + topMargin: 2 } - height: 50 * Constants.scalar - Button { + font.pixelSize: 18 * Constants.scalar text: "Remove" onClicked: accents.remove(model.idx) + + Layout.alignment: Qt.AlignCenter } Rectangle { Layout.fillWidth: true - height: 40 * Constants.scalar + implicitHeight: 40 * Constants.scalar color: accent.text } Rectangle { Layout.fillWidth: true - height: 40 * Constants.scalar + implicitHeight: 40 * Constants.scalar color: light.text } @@ -147,10 +130,9 @@ Rectangle { Rectangle { Layout.fillWidth: true - height: 40 * Constants.scalar + implicitHeight: 40 * Constants.scalar color: accents.qmlColor(qml.currentText) } } - } diff --git a/qml/dialogs/accent/AccentEditor.qml b/qml/dialogs/accent/AccentEditor.qml index c25b7c4d..6280e8bc 100644 --- a/qml/dialogs/accent/AccentEditor.qml +++ b/qml/dialogs/accent/AccentEditor.qml @@ -6,8 +6,8 @@ import QtQuick.Dialogs import QFRCDashboard AnimatedDialog { - width: parent.width / 1.5 - height: parent.height / 1.1 + width: Math.min(window.width, 625 * Constants.scalar) + height: window.height standardButtons: Dialog.Ok | Dialog.Cancel title: "Accent Editor" @@ -79,6 +79,7 @@ AnimatedDialog { uniformCellSizes: true Button { + font.pixelSize: 15 * Constants.scalar Layout.fillWidth: true text: "Add" @@ -86,6 +87,7 @@ AnimatedDialog { } Button { + font.pixelSize: 15 * Constants.scalar Layout.fillWidth: true text: "Pick Color" diff --git a/qml/widgets/config/BaseConfigDialog.qml b/qml/widgets/config/BaseConfigDialog.qml index c0512077..d5059604 100644 --- a/qml/widgets/config/BaseConfigDialog.qml +++ b/qml/widgets/config/BaseConfigDialog.qml @@ -8,7 +8,12 @@ AnimatedDialog { title: "Configure Widget" - width: 400 * Constants.scalar + height: Math.min( + window.height, Math.max( + implicitBackgroundHeight + topInset + + bottomInset, contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + 50 * Constants.scalar) + width: Math.min(window.width, 625 * Constants.scalar) standardButtons: Dialog.Ok | Dialog.Cancel } diff --git a/qml/widgets/config/SectionHeader.qml b/qml/widgets/config/SectionHeader.qml index a95bae79..1e71ab8a 100644 --- a/qml/widgets/config/SectionHeader.qml +++ b/qml/widgets/config/SectionHeader.qml @@ -13,11 +13,14 @@ Column { font.bold: true color: Constants.palette.text text: label + + width: parent.width + horizontalAlignment: Text.AlignHCenter } Rectangle { height: 2 - width: 350 * Constants.scalar + width: parent.width color: Constants.palette.text } } diff --git a/qml/widgets/misc/CameraView.qml b/qml/widgets/misc/CameraView.qml index ea4ab3b3..8515243a 100644 --- a/qml/widgets/misc/CameraView.qml +++ b/qml/widgets/misc/CameraView.qml @@ -104,8 +104,7 @@ BaseWidget { + item_quality + "&" : "") + (item_fps !== 0 ? "fps=" + item_fps + "&" : "") + (item_resH !== Qt.size( - 0, 0) ? "resolution=" + item_resW + "x" - + item_resH : "")) + 0, 0) ? "resolution=" + item_resW + "x" + item_resH : "")) } function reconnect() { @@ -143,9 +142,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 450 * Constants.scalar - width: 450 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -167,7 +163,7 @@ BaseWidget { } ScrollView { - contentWidth: 380 * Constants.scalar + contentWidth: width - 5 * Constants.scalar - effectiveScrollBarWidth anchors { top: parent.top @@ -185,6 +181,7 @@ BaseWidget { spacing: 25 * Constants.scalar anchors.fill: parent + anchors.leftMargin: 2 SectionHeader { label: "Font Settings" @@ -220,8 +217,8 @@ BaseWidget { RowLayout { Layout.fillWidth: true Layout.alignment: Qt.AlignTop - // Layout.preferredWidth: 300 + // Layout.preferredWidth: 300 Text { font.pixelSize: 16 * Constants.scalar text: "Resolution" @@ -301,5 +298,4 @@ BaseWidget { } } } - } diff --git a/qml/widgets/misc/ErrorsWidget.qml b/qml/widgets/misc/ErrorsWidget.qml index 2ba09aa9..8f6f80db 100644 --- a/qml/widgets/misc/ErrorsWidget.qml +++ b/qml/widgets/misc/ErrorsWidget.qml @@ -79,8 +79,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 325 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() diff --git a/qml/widgets/primitive/BoolWidget.qml b/qml/widgets/primitive/BoolWidget.qml index c9dd98a3..d56cd854 100644 --- a/qml/widgets/primitive/BoolWidget.qml +++ b/qml/widgets/primitive/BoolWidget.qml @@ -72,8 +72,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 325 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -99,7 +97,7 @@ BaseWidget { right: parent.right topMargin: -20 - + rightMargin: 5 } diff --git a/qml/widgets/primitive/ColorWidget.qml b/qml/widgets/primitive/ColorWidget.qml index f9dd94b5..d5fcfa1c 100644 --- a/qml/widgets/primitive/ColorWidget.qml +++ b/qml/widgets/primitive/ColorWidget.qml @@ -87,8 +87,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 500 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -118,7 +116,7 @@ BaseWidget { right: parent.right topMargin: -20 - + rightMargin: 5 } diff --git a/qml/widgets/primitive/DoubleDialWidget.qml b/qml/widgets/primitive/DoubleDialWidget.qml index a4b914db..f5c46a52 100644 --- a/qml/widgets/primitive/DoubleDialWidget.qml +++ b/qml/widgets/primitive/DoubleDialWidget.qml @@ -173,9 +173,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 450 * Constants.scalar - width: 450 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -203,7 +200,7 @@ BaseWidget { ScrollView { id: scroll - contentWidth: 380 * Constants.scalar + contentWidth: width - 5 * Constants.scalar - effectiveScrollBarWidth anchors { top: parent.top @@ -221,6 +218,7 @@ BaseWidget { spacing: 25 * Constants.scalar anchors.fill: parent + anchors.leftMargin: 2 SectionHeader { label: "Font Settings" diff --git a/qml/widgets/primitive/DoubleWidget.qml b/qml/widgets/primitive/DoubleWidget.qml index 92b00134..47cbab79 100644 --- a/qml/widgets/primitive/DoubleWidget.qml +++ b/qml/widgets/primitive/DoubleWidget.qml @@ -85,8 +85,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 500 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() diff --git a/qml/widgets/primitive/EnumWidget.qml b/qml/widgets/primitive/EnumWidget.qml index 60a83d71..1a54a281 100644 --- a/qml/widgets/primitive/EnumWidget.qml +++ b/qml/widgets/primitive/EnumWidget.qml @@ -31,8 +31,8 @@ BaseWidget { } function colorFromMap(value) { - for (let i = 0 ; i < item_colorMap.length; ++i) { - let obj = item_colorMap[i]; + for (var i = 0; i < item_colorMap.length; ++i) { + let obj = item_colorMap[i] if (obj["Value"] === value) { return obj["Color"] @@ -98,9 +98,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 450 * Constants.scalar - width: 450 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -120,7 +117,7 @@ BaseWidget { ScrollView { clip: true - contentWidth: 380 * Constants.scalar + contentWidth: width - 5 * Constants.scalar - effectiveScrollBarWidth anchors { top: parent.top @@ -136,7 +133,10 @@ BaseWidget { ColumnLayout { id: layout spacing: 25 * Constants.scalar + anchors.fill: parent + anchors.leftMargin: 2 + clip: true SectionHeader { diff --git a/qml/widgets/primitive/IntDialWidget.qml b/qml/widgets/primitive/IntDialWidget.qml index 51ee92f6..31e8f523 100644 --- a/qml/widgets/primitive/IntDialWidget.qml +++ b/qml/widgets/primitive/IntDialWidget.qml @@ -174,9 +174,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 450 * Constants.scalar - width: 450 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -203,7 +200,7 @@ BaseWidget { } ScrollView { - contentWidth: 380 * Constants.scalar + contentWidth: width - 5 * Constants.scalar - effectiveScrollBarWidth anchors { top: parent.top @@ -221,6 +218,7 @@ BaseWidget { spacing: 25 * Constants.scalar anchors.fill: parent + anchors.leftMargin: 2 SectionHeader { label: "Font Settings" diff --git a/qml/widgets/primitive/IntWidget.qml b/qml/widgets/primitive/IntWidget.qml index 9cb0ba14..568aaa32 100644 --- a/qml/widgets/primitive/IntWidget.qml +++ b/qml/widgets/primitive/IntWidget.qml @@ -83,8 +83,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 500 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -117,7 +115,7 @@ BaseWidget { right: parent.right topMargin: -20 - + rightMargin: 5 } diff --git a/qml/widgets/primitive/TextWidget.qml b/qml/widgets/primitive/TextWidget.qml index 75251348..768b8959 100644 --- a/qml/widgets/primitive/TextWidget.qml +++ b/qml/widgets/primitive/TextWidget.qml @@ -73,8 +73,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 325 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() diff --git a/qml/widgets/sendable/Command.qml b/qml/widgets/sendable/Command.qml index 7bc95d52..9d23a343 100644 --- a/qml/widgets/sendable/Command.qml +++ b/qml/widgets/sendable/Command.qml @@ -73,8 +73,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 325 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() diff --git a/qml/widgets/sendable/FMSInfo.qml b/qml/widgets/sendable/FMSInfo.qml index d4d21f8b..6d25a027 100644 --- a/qml/widgets/sendable/FMSInfo.qml +++ b/qml/widgets/sendable/FMSInfo.qml @@ -287,8 +287,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 325 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() diff --git a/qml/widgets/sendable/Field2d.qml b/qml/widgets/sendable/Field2d.qml index 16de4494..2745fcb0 100644 --- a/qml/widgets/sendable/Field2d.qml +++ b/qml/widgets/sendable/Field2d.qml @@ -121,8 +121,12 @@ BaseWidget { let realFieldX = field.x + (field.width - field.paintedWidth) / 2 let realFieldY = field.y + (field.height - field.paintedHeight) / 2 - let startPoint = item_useVerticalField ? Qt.point(realFieldX + field.paintedWidth - width, realFieldY + field.paintedHeight) - : Qt.point(realFieldX, realFieldY + field.paintedHeight) + let startPoint = item_useVerticalField ? Qt.point( + realFieldX + field.paintedWidth - width, + realFieldY + + field.paintedHeight) : Qt.point( + realFieldX, + realFieldY + field.paintedHeight) x = startPoint.x + xPixels y = startPoint.y - yPixels - height @@ -180,7 +184,7 @@ BaseWidget { shape.width = w shape.height = h - start.x = w + start.x = w start.y = h / 2 middle.x = 0 @@ -205,9 +209,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 450 * Constants.scalar - width: 450 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -237,16 +238,16 @@ BaseWidget { ScrollView { clip: true - contentWidth: 380 * Constants.scalar + contentWidth: width - 5 * Constants.scalar - effectiveScrollBarWidth anchors { top: parent.top bottom: parent.bottom left: parent.left - right: parent.right + right: parent.right topMargin: -20 - + rightMargin: 5 } @@ -254,6 +255,7 @@ BaseWidget { id: layout spacing: 25 * Constants.scalar anchors.fill: parent + anchors.leftMargin: 2 clip: true SectionHeader { diff --git a/qml/widgets/sendable/StringChooser.qml b/qml/widgets/sendable/StringChooser.qml index 858628e9..65647571 100644 --- a/qml/widgets/sendable/StringChooser.qml +++ b/qml/widgets/sendable/StringChooser.qml @@ -52,8 +52,8 @@ BaseWidget { choices = value } else if (ntTopic === item_topic + "/active") { if (!readyToUpdate) { - readyToUpdate = true; - return; + readyToUpdate = true + return } active = value @@ -63,7 +63,7 @@ BaseWidget { function connected(conn) { if (conn) { - readyToUpdate = false; + readyToUpdate = false topicStore.setValue(item_topic + "/selected", currentText) } @@ -108,8 +108,6 @@ BaseWidget { BaseConfigDialog { id: config - height: 325 * Constants.scalar - function openDialog() { topicField.open() titleFontField.open() @@ -135,7 +133,7 @@ BaseWidget { right: parent.right topMargin: -20 - + rightMargin: 5 }