StandardDropdown: use ColumnLayout; use same height of LineEdit; include dropdownLabel

4 files changed, 88 insertions, 96 deletions

diff --git a/components/StandardDropdown.qml b/components/StandardDropdown.qml
index d361ff39..487f233e 100644
--- a/components/StandardDropdown.qml
+++ b/components/StandardDropdown.qml
@@ -30,12 +30,15 @@ import QtQuick 2.9
 import QtQuick.Controls 2.2
 import QtGraphicalEffects 1.0
 import FontAwesome 1.0
+import QtQuick.Layouts 1.1
 
 import "../components" as MoneroComponents
 import "../components/effects/" as MoneroEffects
 
-Item {
+ColumnLayout {
     id: dropdown
+    Layout.fillWidth: true
+
     property int itemTopMargin: 0
     property alias dataModel: repeater.model
     property string shadowPressedColor
@@ -45,46 +48,66 @@ Item {
     property string textColor: MoneroComponents.Style.defaultFontColor
     property alias currentIndex: columnid.currentIndex
     readonly property alias expanded: popup.visible
-    property int dropdownHeight: 42
-    property int fontHeaderSize: 16
+    property alias labelText: dropdownLabel.text
+    property alias labelColor: dropdownLabel.color
+    property alias labelTextFormat: dropdownLabel.textFormat
+    property alias labelWrapMode: dropdownLabel.wrapMode
+    property alias labelHorizontalAlignment: dropdownLabel.horizontalAlignment
+    property bool showingHeader: dropdownLabel.text !== ""
+    property int labelFontSize: 16
+    property bool labelFontBold: false
+    property int dropdownHeight: 39
+    property int fontSize: 16
     property int fontItemSize: 14
     property string colorBorder: MoneroComponents.Style.inputBorderColorInActive
     property string colorHeaderBackground: "transparent"
     property bool headerBorder: true
     property bool headerFontBold: false
 
-    height: dropdownHeight
-
     signal changed();
 
     onExpandedChanged: if(expanded) appWindow.currentItem = dropdown
 
-    Item {
-        id: head
-        anchors.left: parent.left
-        anchors.right: parent.right
-        anchors.top: parent.top
-        anchors.topMargin: parent.itemTopMargin
-        height: dropdown.dropdownHeight
+    spacing: 0
+    Rectangle {
+        id: dropdownLabelRect
+        color: "transparent"
+        Layout.fillWidth: true
+        height: (dropdownLabel.height + 10)
+        visible: showingHeader ? true : false
 
-        Rectangle {
-            color: "transparent"
-            border.width: dropdown.headerBorder ? 1 : 0
-            border.color: dropdown.colorBorder
-            radius: 4
-            anchors.fill: parent
+        MoneroComponents.TextPlain {
+            id: dropdownLabel
+            anchors.top: parent.top
+            anchors.left: parent.left
+            font.family: MoneroComponents.Style.fontRegular.name
+            font.pixelSize: labelFontSize
+            font.bold: labelFontBold
+            textFormat: Text.RichText
+            color: MoneroComponents.Style.defaultFontColor
         }
+    }
+
+    Rectangle {
+        id: head
+        color: "transparent"
+        border.width: dropdown.headerBorder ? 1 : 0
+        border.color: dropdown.colorBorder
+        radius: 4
+        Layout.fillWidth: true
+        Layout.preferredHeight: dropdownHeight
 
         MoneroComponents.TextPlain {
             anchors.verticalCenter: parent.verticalCenter
             anchors.left: parent.left
-            anchors.leftMargin: 12
+            anchors.leftMargin: 10
             anchors.right: dropIndicator.left
             anchors.rightMargin: 12
+            width: droplist.width
             elide: Text.ElideRight
             font.family: MoneroComponents.Style.fontRegular.name
             font.bold: dropdown.headerFontBold
-            font.pixelSize: dropdown.fontHeaderSize
+            font.pixelSize: dropdown.fontSize
             color: dropdown.textColor
             text: columnid.currentIndex < repeater.model.count ? qsTr(repeater.model.get(columnid.currentIndex).column1) + translationManager.emptyString : ""
         }
@@ -126,7 +149,7 @@ Item {
 
         Rectangle {
             id: droplist
-            x: dropdown.x
+            anchors.left: parent.left
             width: dropdown.width
             y: head.y + head.height
             clip: true
diff --git a/pages/Transfer.qml b/pages/Transfer.qml
index a2c5a1ae..2f0e0a75 100644
--- a/pages/Transfer.qml
+++ b/pages/Transfer.qml
@@ -669,13 +669,6 @@ Rectangle {
             spacing: 0
             visible: appWindow.walletMode >= 2
 
-            Label {
-                id: transactionPriority
-                Layout.topMargin: 0
-                text: qsTr("Transaction priority") + translationManager.emptyString
-                fontBold: false
-                fontSize: 16
-            }
             // Note: workaround for translations in listElements
             // ListElement: cannot use script for property value, so
             // code like this wont work:
@@ -699,10 +692,11 @@ Rectangle {
                 spacing: 10
 
                 StandardDropdown {
-                    Layout.preferredWidth: 200
+                    Layout.maximumWidth: 200
                     id: priorityDropdown
                     currentIndex: 0
                     dataModel: priorityModelV5
+                    labelText: qsTr("Transaction priority") + translationManager.emptyString
                 }
 
                 MoneroComponents.TextPlain {
diff --git a/pages/settings/SettingsLayout.qml b/pages/settings/SettingsLayout.qml
index 8cf6cb8b..0e54f018 100644
--- a/pages/settings/SettingsLayout.qml
+++ b/pages/settings/SettingsLayout.qml
@@ -178,52 +178,34 @@ Rectangle {
             Layout.leftMargin: 36
             columnSpacing: 32
 
-            ColumnLayout {
-                spacing: 10
-                Layout.fillWidth: true
+            MoneroComponents.StandardDropdown {
+                id: fiatPriceProviderDropDown
+                Layout.maximumWidth: 200
+                labelText: qsTr("Price source") + translationManager.emptyString
+                labelFontSize: 14
+                dataModel: fiatPriceProvidersModel
+                onChanged: {
+                    var obj = dataModel.get(currentIndex);
+                    persistentSettings.fiatPriceProvider = obj.data;
 
-                MoneroComponents.Label {
-                    Layout.fillWidth: true
-                    fontSize: 14
-                    text: qsTr("Price source") + translationManager.emptyString
-                }
-
-                MoneroComponents.StandardDropdown {
-                    id: fiatPriceProviderDropDown
-                    Layout.fillWidth: true
-                    dataModel: fiatPriceProvidersModel
-                    onChanged: {
-                        var obj = dataModel.get(currentIndex);
-                        persistentSettings.fiatPriceProvider = obj.data;
-
-                        if(persistentSettings.fiatPriceEnabled)
-                            appWindow.fiatApiRefresh();
-                    }
+                    if(persistentSettings.fiatPriceEnabled)
+                        appWindow.fiatApiRefresh();
                 }
             }
 
-            ColumnLayout {
-                spacing: 10
-                Layout.fillWidth: true
+            MoneroComponents.StandardDropdown {
+                id: fiatPriceCurrencyDropdown
+                Layout.maximumWidth: 100
+                labelText: qsTr("Currency") + translationManager.emptyString
+                labelFontSize: 14
+                currentIndex: persistentSettings.fiatPriceCurrency === "xmrusd" ? 0 : 1
+                dataModel: fiatPriceCurrencyModel
+                onChanged: {
+                    var obj = dataModel.get(currentIndex);
+                    persistentSettings.fiatPriceCurrency = obj.data;
 
-                MoneroComponents.Label {
-                    Layout.fillWidth: true
-                    fontSize: 14
-                    text: qsTr("Currency") + translationManager.emptyString
-                }
-
-                MoneroComponents.StandardDropdown {
-                    id: fiatPriceCurrencyDropdown
-                    Layout.fillWidth: true
-                    currentIndex: persistentSettings.fiatPriceCurrency === "xmrusd" ? 0 : 1
-                    dataModel: fiatPriceCurrencyModel
-                    onChanged: {
-                        var obj = dataModel.get(currentIndex);
-                        persistentSettings.fiatPriceCurrency = obj.data;
-
-                        if(persistentSettings.fiatPriceEnabled)
-                            appWindow.fiatApiRefresh();
-                    }
+                    if(persistentSettings.fiatPriceEnabled)
+                        appWindow.fiatApiRefresh();
                 }
             }
 
diff --git a/wizard/WizardHome.qml b/wizard/WizardHome.qml
index 53ddd815..2ef9fa36 100644
--- a/wizard/WizardHome.qml
+++ b/wizard/WizardHome.qml
@@ -181,43 +181,36 @@ Rectangle {
                 columns: 4
                 columnSpacing: 20
                 Layout.fillWidth: true
+                Layout.topMargin: 10
 
-                ColumnLayout {
-                    Layout.topMargin: 4
-
-                    MoneroComponents.Label {
-                        text: qsTr("Change Network:") + translationManager.emptyString
-                        fontSize: 14
-                    }
-
-                    MoneroComponents.StandardDropdown {
-                        id: networkTypeDropdown
-                        currentIndex: persistentSettings.nettype
-                        dataModel: networkTypeModel
-                        Layout.fillWidth: true
-                        Layout.maximumWidth: 180
-                        Layout.topMargin: 5
+                MoneroComponents.StandardDropdown {
+                    id: networkTypeDropdown
+                    currentIndex: persistentSettings.nettype
+                    dataModel: networkTypeModel
+                    Layout.maximumWidth: 180
+                    labelText: qsTr("Network") + ":" + translationManager.emptyString
+                    labelFontSize: 14
 
-                        onChanged: {
-                            var item = dataModel.get(currentIndex).nettype.toLowerCase();
-                            if(item === "mainnet") {
-                                persistentSettings.nettype = NetworkType.MAINNET
-                            } else if(item === "stagenet"){
-                                persistentSettings.nettype = NetworkType.STAGENET
-                            } else if(item === "testnet"){
-                                persistentSettings.nettype = NetworkType.TESTNET
-                            }
-                            appWindow.disconnectRemoteNode()
+                    onChanged: {
+                        var item = dataModel.get(currentIndex).nettype.toLowerCase();
+                        if(item === "mainnet") {
+                            persistentSettings.nettype = NetworkType.MAINNET
+                        } else if(item === "stagenet"){
+                            persistentSettings.nettype = NetworkType.STAGENET
+                        } else if(item === "testnet"){
+                            persistentSettings.nettype = NetworkType.TESTNET
                         }
+                        appWindow.disconnectRemoteNode()
                     }
                 }
 
                 MoneroComponents.LineEdit {
                     id: kdfRoundsText
-                    Layout.fillWidth: true
+                    Layout.maximumWidth: 180
 
                     labelText: qsTr("Number of KDF rounds:") + translationManager.emptyString
                     labelFontSize: 14
+                    fontSize: 16
                     placeholderFontSize: 16
                     placeholderText: "0"
                     validator: IntValidator { bottom: 1 }