Improve visuals of non-native FontDialogs

- Specify preferredHeights directly on the items that need them rather
  than doing it at a higher level. This makes the lower row with the
  text edits and check boxes shorter, giving more space to the row with
  the list views.
- Convert the ColumnLayout containing the check boxes into a RowLayout
  to save vertical space.
- Add some spacing and padding where necessary now that everything is
  more compressed.

Task-number: QTBUG-87799
Change-Id: Iba288f678c1d449ace3bc143073d216fe69d9d9a
Reviewed-by: Oliver Eftevaag <oliver.eftevaag@qt.io>
Reviewed-by: Volker Hilsheimer <volker.hilsheimer@qt.io>
(cherry picked from commit e2f4afcedb857f22e80671b638a80245a09cb249)
Reviewed-by: Qt Cherry-pick Bot <cherrypick_bot@qt-project.org>

5 files changed, 11 insertions, 8 deletions

diff --git a/src/quickdialogs2/quickdialogs2quickimpl/qml/+Imagine/FontDialog.qml b/src/quickdialogs2/quickdialogs2quickimpl/qml/+Imagine/FontDialog.qml
index d150674cf6..47bd53dafc 100644
--- a/src/quickdialogs2/quickdialogs2quickimpl/qml/+Imagine/FontDialog.qml
+++ b/src/quickdialogs2/quickdialogs2quickimpl/qml/+Imagine/FontDialog.qml
@@ -137,6 +137,7 @@ FontDialogImpl {
 
     contentItem: FontDialogContent {
         id: content
+        rowSpacing: 16
     }
 
     footer: RowLayout {
diff --git a/src/quickdialogs2/quickdialogs2quickimpl/qml/+Material/FontDialog.qml b/src/quickdialogs2/quickdialogs2quickimpl/qml/+Material/FontDialog.qml
index db1062b7ea..8a660cb7d0 100644
--- a/src/quickdialogs2/quickdialogs2quickimpl/qml/+Material/FontDialog.qml
+++ b/src/quickdialogs2/quickdialogs2quickimpl/qml/+Material/FontDialog.qml
@@ -104,6 +104,7 @@ FontDialogImpl {
         leftPadding: 24
         rightPadding: 24
         topPadding: 24
+        bottomPadding: 24
     }
 
     contentItem: FontDialogContent {
diff --git a/src/quickdialogs2/quickdialogs2quickimpl/qml/+Universal/FontDialog.qml b/src/quickdialogs2/quickdialogs2quickimpl/qml/+Universal/FontDialog.qml
index a49ed57dc9..2d55806674 100644
--- a/src/quickdialogs2/quickdialogs2quickimpl/qml/+Universal/FontDialog.qml
+++ b/src/quickdialogs2/quickdialogs2quickimpl/qml/+Universal/FontDialog.qml
@@ -109,6 +109,7 @@ FontDialogImpl {
 
     contentItem: FontDialogContent {
         id: content
+        rowSpacing: 24
     }
 
     footer: RowLayout {
diff --git a/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialog.qml b/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialog.qml
index e4cbc2b213..e2caea4043 100644
--- a/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialog.qml
+++ b/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialog.qml
@@ -62,6 +62,8 @@ FontDialogImpl {
     topInset: -1
     bottomInset: -1
 
+    spacing: 12
+
     standardButtons: T.Dialog.Ok | T.Dialog.Cancel
 
     FontDialogImpl.buttonBox: buttonBox
diff --git a/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialogContent.qml b/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialogContent.qml
index 5a521be3e6..a0b7dd3861 100644
--- a/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialogContent.qml
+++ b/src/quickdialogs2/quickdialogs2quickimpl/qml/FontDialogContent.qml
@@ -58,7 +58,6 @@ GridLayout {
         spacing: 0
 
         Layout.preferredWidth: 50
-        Layout.preferredHeight: 80
 
         Label {
             text: qsTr("Family")
@@ -80,6 +79,7 @@ GridLayout {
             ListView {
                 id: fontFamilyListView
                 objectName: "familyListView"
+                implicitHeight: 200
                 anchors.fill: parent
                 clip: true
 
@@ -108,7 +108,6 @@ GridLayout {
         spacing: 0
 
         Layout.preferredWidth: 30
-        Layout.preferredHeight: 80
 
         Label {
             text: qsTr("Style")
@@ -129,6 +128,7 @@ GridLayout {
             ListView {
                 id: fontStyleListView
                 objectName: "styleListView"
+                implicitHeight: 200
                 anchors.fill: parent
                 clip: true
 
@@ -154,7 +154,6 @@ GridLayout {
         spacing: 0
 
         Layout.preferredWidth: 20
-        Layout.preferredHeight: 80
 
         Label {
             text: qsTr("Size")
@@ -172,12 +171,14 @@ GridLayout {
         Frame {
             Layout.fillWidth: true
             Layout.fillHeight: true
+
             background: Rectangle {
                 color: "white"
             }
             ListView {
                 id: fontSizeListView
                 objectName: "sizeListView"
+                implicitHeight: 200
                 anchors.fill: parent
                 clip: true
 
@@ -203,7 +204,6 @@ GridLayout {
     }
 
     ColumnLayout {
-        Layout.preferredHeight: 50
         Layout.preferredWidth: 80
 
         GroupBox {
@@ -211,7 +211,6 @@ GridLayout {
             title: qsTr("Effects")
 
             Layout.fillWidth: true
-
             Layout.fillHeight: true
 
             label: Label {
@@ -219,8 +218,8 @@ GridLayout {
                 text: parent.title
             }
 
-            ColumnLayout {
-                anchors.centerIn: parent
+            RowLayout {
+                anchors.fill: parent
                 CheckBox {
                     id: fontUnderline
                     objectName: "underlineEffect"
@@ -241,7 +240,6 @@ GridLayout {
         title: qsTr("Sample")
 
         Layout.fillWidth: true
-        Layout.preferredHeight: 50
         Layout.preferredWidth: 80
         Layout.fillHeight: true
         Layout.columnSpan: 2