Merge pull request #1511

Settings overhaul (27 commits by skftn)
2018-08-14 16:15:31 -05:00
parent eece475fb8 034f83bfb3
commit 3483b8dbec
29 changed files with 2270 additions and 956 deletions
--- a/components/HistoryTableInnerColumn.qml
+++ b/components/HistoryTableInnerColumn.qml
@@ -53,7 +53,7 @@ Rectangle{
        font.family: MoneroComponents.Style.fontRegular.name
        font.pixelSize: 14 * scaleRatio
        text: labelHeader
-        color: MoneroComponents.Style.greyFontColor
+        color: MoneroComponents.Style.dimmedFontColor
    }

    Text {
@@ -77,7 +77,7 @@ Rectangle{
            label2.color = MoneroComponents.Style.defaultFontColor;
        }
        onExited: {
-            label1.color = MoneroComponents.Style.greyFontColor;
+            label1.color = MoneroComponents.Style.dimmedFontColor
            label2.color = MoneroComponents.Style.dimmedFontColor;
        }
        onClicked: {
--- a/components/InputDialog.qml
+++ b/components/InputDialog.qml
@@ -103,6 +103,8 @@ Item {
                leftPadding: 10
                topPadding: 10
                color: MoneroComponents.Style.defaultFontColor
+                selectionColor: MoneroComponents.Style.dimmedFontColor
+                selectedTextColor: MoneroComponents.Style.defaultFontColor

                background: Rectangle {
                    radius: 2
--- a/components/InputMulti.qml
+++ b/components/InputMulti.qml
@@ -32,31 +32,25 @@ import QtQuick 2.7
 import "../js/TxUtils.js" as TxUtils
 import "../components" as MoneroComponents

-
 TextArea {
-    property bool error: false
-    property bool addressValidation: false
-    property bool wrapAnywhere: true
    property int fontSize: 18 * scaleRatio
    property bool fontBold: false
+    property string fontColor: MoneroComponents.Style.defaultFontColor
+
+    property bool mouseSelection: true
+    property bool error: false
+    property bool addressValidation: false

    id: textArea
    font.family: MoneroComponents.Style.fontRegular.name
+    color: fontColor
    font.pixelSize: fontSize
    font.bold: fontBold
    horizontalAlignment: TextInput.AlignLeft
-    selectByMouse: true
-    color: MoneroComponents.Style.defaultFontColor
+    selectByMouse: mouseSelection
    selectionColor: MoneroComponents.Style.dimmedFontColor
    selectedTextColor: MoneroComponents.Style.defaultFontColor

-    wrapMode: {
-        if(wrapAnywhere){
-            return Text.WrapAnywhere;
-        } else {
-            return Text.WordWrap;
-        }
-    }
    onTextChanged: {
        if(addressValidation){
            // js replacement for `RegExpValidator { regExp: /[0-9A-Fa-f]{95}/g }`
--- a/components/LineEdit.qml
+++ b/components/LineEdit.qml
@@ -50,6 +50,8 @@ Item {
    property alias inlineButtonText: inlineButtonId.text
    property alias inlineIcon: inlineIcon.visible
    property bool copyButton: false
+
+    property bool borderDisabled: false
    property string borderColor: {
        if(input.activeFocus){
            return MoneroComponents.Style.inputBorderColorActive;
@@ -57,9 +59,8 @@ Item {
            return MoneroComponents.Style.inputBorderColorInActive;
        }
    }
-    property bool borderDisabled: false
+
    property int fontSize: 18 * scaleRatio
-    property bool showBorder: true
    property bool fontBold: false
    property alias fontColor: input.color
    property bool error: false
@@ -140,6 +141,7 @@ Item {
        anchors.top: showingHeader ? inputLabel.bottom : parent.top
        anchors.topMargin: showingHeader ? 12 * scaleRatio : 2 * scaleRatio
        width: parent.width
+        clip: true

        Text {
            id: placeholderLabel
@@ -200,6 +202,8 @@ Item {
            onEditingFinished: item.editingFinished()
            onAccepted: item.accepted();
            onTextChanged: item.textUpdated()
+            topPadding: 10 * scaleRatio
+            bottomPadding: 10 * scaleRatio
        }

        MoneroComponents.InlineButton {
--- a/components/LineEditMulti.qml
+++ b/components/LineEditMulti.qml
@@ -32,25 +32,56 @@ import QtQuick.Layouts 1.1
 import "../components" as MoneroComponents

 ColumnLayout {
-    id: lineditmulti
-    property alias text: multiLine.text
-    property alias placeholderText: placeholderLabel.text
+    id: item
+
+    Layout.fillWidth: true
+    Layout.preferredHeight: childrenRect.height
+
+    property alias text: input.text
    property alias labelText: inputLabel.text
-    property alias error: multiLine.error
-    property alias readOnly: multiLine.readOnly
-    property alias addressValidation: multiLine.addressValidation
    property alias labelButtonText: labelButton.text
+    property alias placeholderText: placeholderLabel.text
+
+    property bool placeholderCenter: false
+    property string placeholderFontFamily: MoneroComponents.Style.fontRegular.name
+    property bool placeholderFontBold: false
+    property int placeholderFontSize: 18 * scaleRatio
+    property string placeholderColor: MoneroComponents.Style.defaultFontColor
+    property real placeholderOpacity: 0.35
+
+    property bool borderDisabled: false
+    property string borderColor: {
+        if(input.error && input.text !== ""){
+            return MoneroComponents.Style.inputBorderColorInvalid;
+        } else if(input.activeFocus){
+            return MoneroComponents.Style.inputBorderColorActive;
+        } else {
+            return MoneroComponents.Style.inputBorderColorInActive;
+        }
+    }
+
+    property bool error: false
+
+    property string labelFontColor: MoneroComponents.Style.defaultFontColor
    property bool labelFontBold: false
+    property int labelFontSize: 16 * scaleRatio
    property bool labelButtonVisible: false
-    property bool copyButton: false
-    property bool wrapAnywhere: true
-    property bool showingHeader: true
-    property bool showBorder: true
+
+    property string fontColor: "white"
    property bool fontBold: false
    property int fontSize: 16 * scaleRatio

+    property bool mouseSelection: true
+    property alias readOnly: input.readOnly
+    property bool copyButton: false
+    property bool showingHeader: true
+    property var wrapMode: Text.NoWrap
+    property alias addressValidation: input.addressValidation
+    property string backgroundColor: "" // mock
+
    signal labelButtonClicked();
    signal inputLabelLinkActivated();
+    signal editingFinished();

    spacing: 0
    Rectangle {
@@ -65,11 +96,17 @@ ColumnLayout {
            anchors.top: parent.top
            anchors.left: parent.left
            font.family: MoneroComponents.Style.fontRegular.name
-            font.pixelSize: 16 * scaleRatio
+            font.pixelSize: item.labelFontSize
            font.bold: labelFontBold
            textFormat: Text.RichText
-            color: MoneroComponents.Style.defaultFontColor
+            color: item.labelFontColor
            onLinkActivated: inputLabelLinkActivated()
+
+            MouseArea {
+                anchors.fill: parent
+                acceptedButtons: Qt.NoButton
+                cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor
+            }
        }

        MoneroComponents.LabelButton {
@@ -80,14 +117,14 @@ ColumnLayout {

        MoneroComponents.LabelButton {
            id: copyButtonId
-            visible: copyButton && multiLine.text !== ""
+            visible: copyButton && input.text !== ""
            text: qsTr("Copy")
            anchors.right: labelButton.visible ? inputLabel.right : parent.right
            anchors.rightMargin: labelButton.visible? 4 : 0
            onClicked: {
-                if (multiLine.text.length > 0) {
+                if (input.text.length > 0) {
                    console.log("Copied to clipboard");
-                    clipboard.setText(multiLine.text);
+                    clipboard.setText(input.text);
                    appWindow.showStatusMessage(qsTr("Copied to clipboard"), 3);
                }
            }
@@ -95,27 +132,32 @@ ColumnLayout {
    }

    MoneroComponents.InputMulti {
-        id: multiLine
+        id: input
        readOnly: false
-        addressValidation: true
-        anchors.top: parent.showingHeader ? inputLabelRect.bottom : parent.top
+        addressValidation: false
+        anchors.top: item.showingHeader ? inputLabelRect.bottom : item.top
        Layout.fillWidth: true
-        topPadding: parent.showingHeader ? 10 * scaleRatio : 0
+        topPadding: item.showingHeader ? 10 * scaleRatio : 0
        bottomPadding: 10 * scaleRatio
-        wrapAnywhere: parent.wrapAnywhere
-        fontSize: parent.fontSize
-        fontBold: parent.fontBold
+        wrapMode: item.wrapMode
+        fontSize: item.fontSize
+        fontBold: item.fontBold
+        fontColor: item.fontColor
+        mouseSelection: item.mouseSelection
+        onEditingFinished: item.editingFinished()
+        error: item.error

        Text {
            id: placeholderLabel
-            visible: multiLine.text ? false : true
+            visible: input.text ? false : true
            anchors.verticalCenter: parent.verticalCenter
            anchors.left: parent.left
            anchors.leftMargin: 10 * scaleRatio
-            opacity: 0.35
-            color: MoneroComponents.Style.defaultFontColor
-            font.family: MoneroComponents.Style.fontRegular.name
-            font.pixelSize: 18 * scaleRatio
+            opacity: item.placeholderOpacity
+            color: item.placeholderColor
+            font.family: item.placeholderFontFamily
+            font.bold: item.placeholderFontBold
+            font.pixelSize: item.placeholderFontSize
            text: ""
            z: 3
        }
@@ -123,18 +165,10 @@ ColumnLayout {
        Rectangle {
            color: "transparent"
            border.width: 1
-            border.color: {
-              if(multiLine.error && multiLine.text !== ""){
-                  return MoneroComponents.Style.inputBorderColorInvalid;
-              } else if(multiLine.activeFocus){
-                  return MoneroComponents.Style.inputBorderColorActive;
-              } else {
-                  return MoneroComponents.Style.inputBorderColorInActive;
-              }
-            }
+            border.color: item.borderColor
            radius: 4
            anchors.fill: parent
-            visible: lineditmulti.showBorder
+            visible: !item.borderDisabled
        }
    }
 }
--- a/components/PasswordDialog.qml
+++ b/components/PasswordDialog.qml
@@ -108,6 +108,8 @@ Item {
                leftPadding: 10
                topPadding: 10
                color: MoneroComponents.Style.defaultFontColor
+                selectionColor: MoneroComponents.Style.dimmedFontColor
+                selectedTextColor: MoneroComponents.Style.defaultFontColor

                background: Rectangle {
                    radius: 2
--- a/components/RemoteNodeEdit.qml
+++ b/components/RemoteNodeEdit.qml
@@ -53,6 +53,8 @@ GridLayout {
    property string lineEditBorderColor: Qt.rgba(0, 0, 0, 0.15)
    property string lineEditBackgroundColor: "white"
    property string lineEditFontColor: "black"
+    property int lineEditFontSize: 18 * scaleRatio
+    property int labelFontSize: 16 * scaleRatio
    property bool lineEditFontBold: true

    signal editingFinished()
@@ -61,7 +63,7 @@ GridLayout {
        return daemonAddr.text.trim() + ":" + daemonPort.text.trim()
    }

-    LineEdit {
+    LineEditMulti {
        id: daemonAddr
        Layout.fillWidth: true
        placeholderText: qsTr("Remote Node Hostname / IP") + translationManager.emptyString
@@ -70,14 +72,16 @@ GridLayout {
        placeholderFontSize: root.placeholderFontSize
        placeholderColor: root.placeholderColor
        placeholderOpacity: root.placeholderOpacity
-        onEditingFinished: root.editingFinished()
+        labelFontSize: root.labelFontSize
        borderColor: lineEditBorderColor
        backgroundColor: lineEditBackgroundColor
        fontColor: lineEditFontColor
        fontBold: lineEditFontBold
+        fontSize: lineEditFontSize
+        onEditingFinished: root.editingFinished()
    }

-    LineEdit {
+    LineEditMulti {
        id: daemonPort
        Layout.fillWidth: true
        placeholderText: qsTr("Port") + translationManager.emptyString
@@ -86,10 +90,13 @@ GridLayout {
        placeholderFontSize: root.placeholderFontSize
        placeholderColor: root.placeholderColor
        placeholderOpacity: root.placeholderOpacity
-        onEditingFinished: root.editingFinished()
+        labelFontSize: root.labelFontSize
        borderColor: lineEditBorderColor
        backgroundColor: lineEditBackgroundColor
        fontColor: lineEditFontColor
        fontBold: lineEditFontBold
+        fontSize: lineEditFontSize
+
+        onEditingFinished: root.editingFinished()
    }
 }
--- a/components/StandardDropdown.qml
+++ b/components/StandardDropdown.qml
@@ -32,6 +32,7 @@ import "../components" as MoneroComponents

 Item {
    id: dropdown
+    property int itemTopMargin: 0
    property alias dataModel: repeater.model
    property string shadowPressedColor
    property string shadowReleasedColor
@@ -76,6 +77,7 @@ Item {
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.top: parent.top
+        anchors.topMargin: parent.itemTopMargin
        height: dropdown.dropdownHeight

        Rectangle {
--- a/components/Style.qml
+++ b/components/Style.qml
@@ -11,7 +11,6 @@ QtObject {
    property string grey: "#404040"

    property string defaultFontColor: "white"
-    property string greyFontColor: "#808080"
    property string dimmedFontColor: "#BBBBBB"
    property string inputBoxBackground: "black"
    property string inputBoxBackgroundError: "#FFDDDD"
--- a/components/WarningBox.qml
+++ b/components/WarningBox.qml
@@ -0,0 +1,63 @@
+import QtQuick 2.7
+import QtQuick.Layouts 1.1
+import QtQuick.Controls 2.0
+
+import "." as MoneroComponents
+
+Rectangle {
+    id: root
+    property alias text: content.text
+    property int fontSize: 15 * scaleRatio
+
+    Layout.fillWidth: true
+    Layout.preferredHeight: warningLayout.height
+
+    color: "#09FFFFFF"
+    radius: 4
+    border.color: MoneroComponents.Style.inputBorderColorInActive
+    border.width: 1
+    
+    signal linkActivated;
+    
+    RowLayout {
+        id: warningLayout
+        spacing: 0
+        anchors.left: parent.left
+        anchors.right: parent.right
+
+        Image {
+            Layout.alignment: Qt.AlignVCenter
+            Layout.preferredHeight: 33
+            Layout.preferredWidth: 33
+            Layout.rightMargin: 14
+            Layout.leftMargin: 14
+            Layout.topMargin: 12
+            Layout.bottomMargin: 12
+            source: "../images/warning.png"
+        }
+
+        TextArea {
+            id: content
+            Layout.fillWidth: true
+            color: MoneroComponents.Style.defaultFontColor
+            font.family: MoneroComponents.Style.fontRegular.name
+            font.pixelSize: root.fontSize
+            horizontalAlignment: TextInput.AlignLeft
+            selectByMouse: false
+            textFormat: Text.RichText
+            wrapMode: Text.WordWrap
+            textMargin: 0
+            leftPadding: 0
+            topPadding: 6
+            readOnly: true
+            onLinkActivated: root.linkActivated();
+
+            // @TODO: Legacy. Remove after Qt 5.8.
+            // https://stackoverflow.com/questions/41990013
+            MouseArea {
+                anchors.fill: parent
+                enabled: false
+            }
+        }
+    }
+}