From 52aef114fab755d2a58c19252cdc1bcbedd1c122 Mon Sep 17 00:00:00 2001 From: rating89us <45968869+rating89us@users.noreply.github.com> Date: Wed, 9 Jun 2021 05:42:43 +0200 Subject: [PATCH] LineEdit: use ColumnLayout instead of Item (also used in LineEditMulti) --- components/LineEdit.qml | 209 +++++++++++++++++---------------- components/RemoteNodeEdit.qml | 8 +- pages/History.qml | 28 +++-- pages/Transfer.qml | 20 +++- pages/settings/SettingsLog.qml | 3 + wizard/WizardWalletInput.qml | 5 +- 6 files changed, 150 insertions(+), 123 deletions(-) diff --git a/components/LineEdit.qml b/components/LineEdit.qml index 0356b83b..8695dadd 100644 --- a/components/LineEdit.qml +++ b/components/LineEdit.qml @@ -33,14 +33,21 @@ import QtQuick.Layouts 1.1 import "../components" as MoneroComponents -Item { +ColumnLayout { id: item + Layout.fillWidth: true default property alias content: inlineButtons.children property alias input: input property alias text: input.text + property int inputPaddingLeft: 10 + property int inputPaddingRight: 10 + property int inputPaddingTop: 10 + property int inputPaddingBottom: 10 + property int inputRadius: 4 + property bool password: false property bool passwordHidden: true property var passwordLinked: null @@ -55,10 +62,8 @@ Item { property real placeholderLeftMargin: { if (placeholderCenter) { return undefined; - } else if (inlineIcon.visible) { - return inlineIcon.width + inlineIcon.anchors.leftMargin + inputPadding; } else { - return inputPadding; + return inputPaddingLeft; } } @@ -66,8 +71,8 @@ Item { property alias validator: input.validator property alias readOnly : input.readOnly property alias cursorPosition: input.cursorPosition - property alias inlineIcon: inlineIcon.visible property bool copyButton: false + property bool pasteButton: false property alias copyButtonText: copyButtonId.text property alias copyButtonEnabled: copyButtonId.enabled @@ -97,16 +102,13 @@ Item { property alias labelWrapMode: inputLabel.wrapMode property alias labelHorizontalAlignment: inputLabel.horizontalAlignment property bool showingHeader: inputLabel.text !== "" || copyButton - property int inputHeight: 42 - property int inputPadding: 10 + property int inputHeight: 39 signal labelLinkActivated(); // input label, rich text signal signal editingFinished(); signal accepted(); signal textUpdated(); - height: showingHeader ? (inputLabel.height + inputItem.height + 2) : inputHeight - onActiveFocusChanged: activeFocus && input.forceActiveFocus() onTextUpdated: { // check to remove placeholder text when there is content @@ -152,45 +154,100 @@ Item { } } - MoneroComponents.TextPlain { - id: inputLabel - 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 - onLinkActivated: item.labelLinkActivated() + spacing: 0 + Rectangle { + id: inputLabelRect + color: "transparent" + Layout.fillWidth: true + height: (inputLabel.height + 10) + visible: showingHeader ? true : false - MouseArea { - anchors.fill: parent - acceptedButtons: Qt.NoButton - cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor - } - } + MoneroComponents.TextPlain { + id: inputLabel + 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 + onLinkActivated: item.labelLinkActivated() - MoneroComponents.LabelButton { - id: copyButtonId - text: qsTr("Copy") + translationManager.emptyString - anchors.right: parent.right - onClicked: { - if (input.text.length > 0) { - console.log("Copied to clipboard"); - clipboard.setText(input.text); - appWindow.showStatusMessage(qsTr("Copied to clipboard"), 3); + MouseArea { + anchors.fill: parent + acceptedButtons: Qt.NoButton + cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor + } + } + + RowLayout { + anchors.right: parent.right + spacing: 16 + + MoneroComponents.LabelButton { + id: copyButtonId + text: qsTr("Copy") + translationManager.emptyString + onClicked: { + if (input.text.length > 0) { + console.log("Copied to clipboard"); + clipboard.setText(input.text); + appWindow.showStatusMessage(qsTr("Copied to clipboard"), 3); + } + } + visible: copyButton && input.text !== "" + } + + MoneroComponents.LabelButton { + id: pasteButtonId + onClicked: { + input.clear(); + input.paste(); + } + text: qsTr("Paste") + translationManager.emptyString + visible: pasteButton } } - visible: copyButton && input.text !== "" } - Item{ - id: inputItem - height: inputHeight - anchors.top: showingHeader ? inputLabel.bottom : parent.top - anchors.topMargin: showingHeader ? 12 : 0 - width: parent.width - clip: true + MoneroComponents.Input { + id: input + KeyNavigation.backtab: item.KeyNavigation.backtab + KeyNavigation.tab: item.KeyNavigation.tab + Layout.fillWidth: true + Layout.preferredHeight: inputHeight + + leftPadding: item.inputPaddingLeft + rightPadding: (inlineButtons.width > 0 ? inlineButtons.width + inlineButtons.spacing : 0) + inputPaddingRight + topPadding: item.inputPaddingTop + bottomPadding: item.inputPaddingBottom + + font.family: item.fontFamily + font.pixelSize: item.fontSize + font.bold: item.fontBold + onEditingFinished: item.editingFinished() + onAccepted: item.accepted(); + onTextChanged: item.textUpdated() + echoMode: isPasswordHidden() ? TextInput.Password : TextInput.Normal + + MoneroComponents.Label { + visible: password || passwordLinked + fontSize: 20 + text: isPasswordHidden() ? FontAwesome.eye : FontAwesome.eyeSlash + opacity: eyeMouseArea.containsMouse ? 0.9 : 0.7 + fontFamily: FontAwesome.fontFamily + anchors.right: parent.right + anchors.rightMargin: 15 + anchors.verticalCenter: parent.verticalCenter + anchors.verticalCenterOffset: 1 + + MouseArea { + id: eyeMouseArea + anchors.fill: parent + cursorShape: Qt.PointingHandCursor + hoverEnabled: true + onClicked: passwordToggle() + } + } MoneroComponents.TextPlain { id: placeholderLabel @@ -221,69 +278,15 @@ Item { anchors.fill: parent border.width: borderDisabled ? 0 : 1 border.color: borderColor - radius: 4 + radius: item.inputRadius } - Image { - id: inlineIcon - width: 26 - height: 26 - anchors.top: parent.top - anchors.topMargin: 8 - anchors.left: parent.left - anchors.leftMargin: 12 - source: "qrc:///images/moneroIcon-28x28.png" - visible: false - } - - MoneroComponents.Input { - id: input - anchors.fill: parent - anchors.leftMargin: inlineIcon.visible ? 44 : 0 - font.family: item.fontFamily - font.pixelSize: item.fontSize - font.bold: item.fontBold - KeyNavigation.backtab: item.KeyNavigation.backtab - KeyNavigation.tab: item.KeyNavigation.tab - onEditingFinished: item.editingFinished() - onAccepted: item.accepted(); - onTextChanged: item.textUpdated() - leftPadding: inputPadding - rightPadding: (inlineButtons.width > 0 ? inlineButtons.width + inlineButtons.spacing : 0) + inputPadding - topPadding: inputPadding - bottomPadding: inputPadding - echoMode: isPasswordHidden() ? TextInput.Password : TextInput.Normal - - MoneroComponents.Label { - visible: password || passwordLinked - fontSize: 20 - text: isPasswordHidden() ? FontAwesome.eye : FontAwesome.eyeSlash - opacity: eyeMouseArea.containsMouse ? 0.9 : 0.7 - fontFamily: FontAwesome.fontFamily - anchors.right: parent.right - anchors.rightMargin: 15 - anchors.verticalCenter: parent.verticalCenter - anchors.verticalCenterOffset: 1 - - MouseArea { - id: eyeMouseArea - anchors.fill: parent - cursorShape: Qt.PointingHandCursor - hoverEnabled: true - onClicked: passwordToggle() - } - } - - RowLayout { - id: inlineButtons - anchors.bottom: parent.bottom - anchors.top: parent.top - anchors.right: parent.right - anchors.topMargin: inputPadding - anchors.bottomMargin: inputPadding - anchors.rightMargin: inputPadding - spacing: 4 - } + RowLayout { + id: inlineButtons + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.right + anchors.rightMargin: inputPaddingRight + spacing: 4 } } } diff --git a/components/RemoteNodeEdit.qml b/components/RemoteNodeEdit.qml index 7b4b4773..255f6673 100644 --- a/components/RemoteNodeEdit.qml +++ b/components/RemoteNodeEdit.qml @@ -82,9 +82,9 @@ GridLayout { return addr + ":" + port; } - LineEdit { + MoneroComponents.LineEdit { id: daemonAddr - Layout.fillWidth: true + Layout.preferredWidth: root.width/3 placeholderText: qsTr("Remote Node Hostname / IP") + translationManager.emptyString placeholderFontFamily: root.placeholderFontFamily placeholderFontBold: root.placeholderFontBold @@ -104,9 +104,9 @@ GridLayout { text: initialHostPort[1] } - LineEdit { + MoneroComponents.LineEdit { id: daemonPort - Layout.fillWidth: true + Layout.preferredWidth: root.width/3 placeholderText: qsTr("Port") + translationManager.emptyString placeholderFontFamily: root.placeholderFontFamily placeholderFontBold: root.placeholderFontBold diff --git a/pages/History.qml b/pages/History.qml index 8711aca7..a7a56f92 100644 --- a/pages/History.qml +++ b/pages/History.qml @@ -171,19 +171,25 @@ Rectangle { } } - MoneroComponents.InlineButton { - Layout.topMargin: -8 + Rectangle { + color: "transparent" + height: cleanButton.height + width: cleanButton.width Layout.rightMargin: -8 Layout.leftMargin: -2 - buttonColor: "transparent" - fontFamily: FontAwesome.fontFamilySolid - fontStyleName: "Solid" - fontPixelSize: 18 - text: FontAwesome.times - tooltip: qsTr("Clean") + translationManager.emptyString - tooltipLeft: true - visible: searchInput.text != "" - onClicked: searchInput.text = "" + + MoneroComponents.InlineButton { + id: cleanButton + buttonColor: "transparent" + fontFamily: FontAwesome.fontFamilySolid + fontStyleName: "Solid" + fontPixelSize: 18 + text: FontAwesome.times + tooltip: qsTr("Clean") + translationManager.emptyString + tooltipLeft: true + visible: searchInput.text != "" + onClicked: searchInput.text = "" + } } } } diff --git a/pages/Transfer.qml b/pages/Transfer.qml index bf56ed24..a2c5a1ae 100644 --- a/pages/Transfer.qml +++ b/pages/Transfer.qml @@ -468,10 +468,14 @@ Rectangle { Layout.bottomMargin: recipientLayout.rowSpacing / 2 Layout.rightMargin: recipientLayout.colSpacing / 2 Layout.preferredWidth: 125 + Layout.maximumWidth: 125 borderDisabled: true fontFamily: MoneroComponents.Style.fontMonoRegular.name fontSize: 14 - inputPadding: 0 + inputPaddingLeft: 0 + inputPaddingRight: 0 + inputPaddingTop: 0 + inputPaddingBottom: 0 placeholderFontFamily: MoneroComponents.Style.fontMonoRegular.name placeholderFontSize: 14 placeholderLeftMargin: 0 @@ -586,11 +590,15 @@ Rectangle { Layout.column: 1 Layout.row: 0 Layout.preferredWidth: recipientLayout.secondRowWidth + Layout.maximumWidth: recipientLayout.secondRowWidth borderDisabled: true fontFamily: MoneroComponents.Style.fontMonoRegular.name fontSize: 14 inputHeight: 30 - inputPadding: 0 + inputPaddingLeft: 0 + inputPaddingRight: 0 + inputPaddingTop: 0 + inputPaddingBottom: 0 readOnly: true text: Utils.removeTrailingZeros(walletManager.displayAmount(recipientModel.getAmountTotal())) visible: recipientModel.count > 1 @@ -600,6 +608,7 @@ Rectangle { Layout.column: 2 Layout.row: 0 Layout.preferredWidth: recipientLayout.thirdRowWidth + Layout.maximumWidth: recipientLayout.thirdRowWidth horizontalAlignment: Text.AlignHCenter font.family: MoneroComponents.Style.fontRegular.name text: "XMR" @@ -611,11 +620,15 @@ Rectangle { Layout.row: recipientModel.count > 1 ? 1 : 0 Layout.preferredWidth: recipientLayout.secondRowWidth Layout.topMargin: recipientModel.count > 1 ? 0 : 5 + Layout.maximumWidth: recipientLayout.secondRowWidth borderDisabled: true fontFamily: MoneroComponents.Style.fontMonoRegular.name fontSize: 14 inputHeight: 30 - inputPadding: 0 + inputPaddingLeft: 0 + inputPaddingRight: 0 + inputPaddingTop: 0 + inputPaddingBottom: 0 opacity: 0.7 readOnly: true text: fiatApiConvertToFiat(walletManager.displayAmount(recipientModel.getAmountTotal())) @@ -627,6 +640,7 @@ Rectangle { Layout.row: recipientModel.count > 1 ? 1 : 0 Layout.preferredWidth: recipientLayout.thirdRowWidth Layout.topMargin: recipientModel.count > 1 ? 0 : 5 + Layout.maximumWidth: recipientLayout.thirdRowWidth font.family: MoneroComponents.Style.fontRegular.name horizontalAlignment: Text.AlignHCenter opacity: 0.7 diff --git a/pages/settings/SettingsLog.qml b/pages/settings/SettingsLog.qml index 2b84ed60..4c393ee9 100644 --- a/pages/settings/SettingsLog.qml +++ b/pages/settings/SettingsLog.qml @@ -226,10 +226,13 @@ Rectangle { MoneroComponents.LineEdit { id: sendCommandText Layout.fillWidth: true + inputPaddingTop: 0 + inputPaddingBottom: 0 property var lastCommands: [] property int currentCommandIndex enabled: !persistentSettings.useRemoteNode fontBold: false + fontSize: 16 placeholderText: qsTr("Type a command (e.g '%1' or '%2') and press Enter").arg("help").arg("status") + translationManager.emptyString placeholderFontSize: 16 Keys.onUpPressed: { diff --git a/wizard/WizardWalletInput.qml b/wizard/WizardWalletInput.qml index e754a4f1..024f2eb4 100644 --- a/wizard/WizardWalletInput.qml +++ b/wizard/WizardWalletInput.qml @@ -36,6 +36,7 @@ import "../components" import "../components" as MoneroComponents GridLayout { + id: grid Layout.fillWidth: true property alias walletName: walletName property alias walletLocation: walletLocation @@ -61,7 +62,7 @@ GridLayout { MoneroComponents.LineEdit { id: walletName - Layout.fillWidth: true + Layout.preferredWidth: grid.width/3 function verify(){ if(walletLocation === "" || /[\\\/]/.test(walletName.text)) return false; @@ -82,7 +83,7 @@ GridLayout { MoneroComponents.LineEdit { id: walletLocation - Layout.fillWidth: true + Layout.preferredWidth: grid.width/3 labelText: qsTr("Wallet location") + translationManager.emptyString labelFontSize: 14