From cad9da05fd2afc214fcde74ac9a5196f9aae8d5d Mon Sep 17 00:00:00 2001
From: Thomas Hartmann <thomas.hartmann@qt.io>
Date: Tue, 29 Jan 2019 17:52:09 +0100
Subject: [PATCH] QmlDesigner: Add layout margins to property editor

Change-Id: I39565559fbd3f5cae46e72f9139f2eac17b647b0
Reviewed-by: Tim Jenssen <tim.jenssen@qt.io>
---
 .../QtQuick/LayoutPoperties.qml               | 112 ++++++++++++++++--
 .../propertyeditorqmlbackend.cpp              |   9 +-
 2 files changed, 112 insertions(+), 9 deletions(-)

diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutPoperties.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutPoperties.qml
index 8c933988799..8ae5dcdb91e 100644
--- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutPoperties.qml
+++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutPoperties.qml
@@ -40,6 +40,8 @@ SectionLayout {
     onBackendValueChanged: evaluateAlignment()
     onValueFromBackendChanged: evaluateAlignment()
 
+    property int spinBoxWidth: 62
+
     Connections {
         target: modelNodeBackend
         onSelectionChanged: {
@@ -47,6 +49,8 @@ SectionLayout {
         }
     }
 
+    id: root
+
     Component.onCompleted: evaluateAlignment()
 
     function indexOfVerticalAlignment() {
@@ -256,7 +260,7 @@ SectionLayout {
 
         Label {
             text: "W"
-            width: 12
+            width: 28
         }
 
         SpinBox {
@@ -264,6 +268,7 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: -1
             decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
 
         Item {
@@ -273,7 +278,7 @@ SectionLayout {
 
         Label {
             text: "H"
-            width: 12
+            width: 28
         }
 
         SpinBox {
@@ -281,6 +286,7 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: -1
             decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
         ExpandingSpacer {
 
@@ -297,7 +303,7 @@ SectionLayout {
 
         Label {
             text: "W"
-            width: 12
+            width: 28
         }
 
         SpinBox {
@@ -305,6 +311,7 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: 0
             decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
 
         Item {
@@ -314,7 +321,7 @@ SectionLayout {
 
         Label {
             text: "H"
-            width: 12
+            width: 28
         }
 
         SpinBox {
@@ -322,6 +329,7 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: 0
             decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
         ExpandingSpacer {
 
@@ -338,7 +346,7 @@ SectionLayout {
 
         Label {
             text: "W"
-            width: 12
+            width: 28
         }
 
         SpinBox {
@@ -346,6 +354,7 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: 0
             decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
 
         Item {
@@ -355,7 +364,7 @@ SectionLayout {
 
         Label {
             text: "H"
-            width: 12
+             width: 28
         }
 
         SpinBox {
@@ -363,6 +372,91 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: 0
             decimals: 0
+            implicitWidth: root.spinBoxWidth
+        }
+        ExpandingSpacer {
+
+        }
+    }
+
+    Label {
+        text: qsTr("Margins")
+    }
+
+    SecondColumnLayout {
+        Layout.fillWidth: true
+
+        Label {
+            text: "Top"
+            width: 28
+        }
+
+        SpinBox {
+            backendValue: backendValues.Layout_topMargin
+            maximumValue: 0xffff
+            minimumValue: 0
+            decimals: 0
+            implicitWidth: root.spinBoxWidth
+        }
+
+        Item {
+            width: 4
+            height: 4
+        }
+
+        Label {
+            text: "Bottom"
+            width: 28
+        }
+
+        SpinBox {
+            backendValue: backendValues.Layout_bottomMargin
+            maximumValue: 0xffff
+            minimumValue: 0
+            decimals: 0
+            implicitWidth: root.spinBoxWidth
+        }
+        ExpandingSpacer {
+
+        }
+    }
+
+    Label {
+        text: ("")
+    }
+
+    SecondColumnLayout {
+        Layout.fillWidth: true
+
+        Label {
+            text: "Left"
+            width: 28
+        }
+
+        SpinBox {
+            backendValue: backendValues.Layout_leftMargin
+            maximumValue: 0xffff
+            minimumValue: 0
+            decimals: 0
+            implicitWidth: root.spinBoxWidth
+        }
+
+        Item {
+            width: 4
+            height: 4
+        }
+
+        Label {
+            text: "Right"
+            width: 28
+        }
+
+        SpinBox {
+            backendValue: backendValues.Layout_rightMargin
+            maximumValue: 0xffff
+            minimumValue: 0
+            decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
         ExpandingSpacer {
 
@@ -379,7 +473,7 @@ SectionLayout {
 
         Item {
             height: 4
-            width: 12
+             width: 28
         }
 
         SpinBox {
@@ -387,6 +481,7 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: 0
             decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
 
         ExpandingSpacer {
@@ -404,7 +499,7 @@ SectionLayout {
 
         Item {
             height: 4
-            width: 12
+             width: 28
         }
 
         SpinBox {
@@ -412,6 +507,7 @@ SectionLayout {
             maximumValue: 0xffff
             minimumValue: 0
             decimals: 0
+            implicitWidth: root.spinBoxWidth
         }
 
         ExpandingSpacer {
diff --git a/src/plugins/qmldesigner/components/propertyeditor/propertyeditorqmlbackend.cpp b/src/plugins/qmldesigner/components/propertyeditor/propertyeditorqmlbackend.cpp
index 751f444e660..284b6948ee0 100644
--- a/src/plugins/qmldesigner/components/propertyeditor/propertyeditorqmlbackend.cpp
+++ b/src/plugins/qmldesigner/components/propertyeditor/propertyeditorqmlbackend.cpp
@@ -152,6 +152,12 @@ QVariant properDefaultLayoutAttachedProperties(const QmlObjectNode &qmlObjectNod
      if ("columnSpan" == propertyName || "rowSpan" == propertyName)
          return 1;
 
+     if ("topMargin" == propertyName || "bottomMargin" == propertyName)
+         return 0;
+
+     if ("leftMargin" == propertyName || "rightMargin" == propertyName)
+         return 0;
+
     return QVariant();
 }
 
@@ -161,7 +167,8 @@ void PropertyEditorQmlBackend::setupLayoutAttachedProperties(const QmlObjectNode
 
         static const PropertyNameList propertyNames =
             {"alignment", "column", "columnSpan", "fillHeight", "fillWidth", "maximumHeight", "maximumWidth",
-             "minimumHeight", "minimumWidth", "preferredHeight", "preferredWidth", "row", "rowSpan"};
+                "minimumHeight", "minimumWidth", "preferredHeight", "preferredWidth", "row", "rowSpan",
+                "topMargin", "bottomMargin", "leftMargin", "rightMargin"};
 
         foreach (const PropertyName &propertyName, propertyNames) {
             createPropertyEditorValue(qmlObjectNode, "Layout." + propertyName, properDefaultLayoutAttachedProperties(qmlObjectNode, propertyName), propertyEditor);