From 6fa805df621e4dbc1ecf5f6d03cd5469421ead2e Mon Sep 17 00:00:00 2001 From: mmbyday Date: Wed, 12 Dec 2018 13:31:24 -0800 Subject: [PATCH] qrscanner: update addressbook and transfer UI --- components/InlineButton.qml | 14 +++++++-- components/LineEditMulti.qml | 12 ++++++++ images/qr.png | Bin 0 -> 2567 bytes images/qr@2x.png | Bin 0 -> 5390 bytes pages/AddressBook.qml | 56 ++++++++++++++++------------------- pages/Transfer.qml | 17 ++++------- qml.qrc | 2 ++ 7 files changed, 56 insertions(+), 45 deletions(-) create mode 100644 images/qr.png create mode 100644 images/qr@2x.png diff --git a/components/InlineButton.qml b/components/InlineButton.qml index cdbcd2ef..7bd1f7d2 100644 --- a/components/InlineButton.qml +++ b/components/InlineButton.qml @@ -42,6 +42,7 @@ Item { property string textColor: "#FFFFFF" property int fontSize: 12 * scaleRatio property alias text: inlineText.text + property alias buttonColor: rect.color signal clicked() function doClick() { @@ -55,7 +56,7 @@ Item { color: MoneroComponents.Style.buttonBackgroundColorDisabled border.color: "black" height: 28 * scaleRatio - width: inlineText.width + 22 * scaleRatio + width: inlineText.text ? (inlineText.width + 22) * scaleRatio : inlineButton.icon ? (inlineImage.width + 16) * scaleRatio : rect.height radius: 4 anchors.top: parent.top @@ -71,6 +72,13 @@ Item { anchors.horizontalCenter: parent.horizontalCenter } + Image { + id: inlineImage + visible: inlineButton.icon !== "" + anchors.centerIn: parent + source: inlineButton.icon + } + MouseArea { id: buttonArea cursorShape: rect.enabled ? Qt.PointingHandCursor : Qt.ArrowCursor @@ -78,12 +86,12 @@ Item { anchors.fill: parent onClicked: doClick() onEntered: { - rect.color = "#707070"; + rect.color = buttonColor ? buttonColor : "#707070"; rect.opacity = 0.8; } onExited: { rect.opacity = 1.0; - rect.color = "#808080"; + rect.color = buttonColor ? buttonColor : "#808080"; } } } diff --git a/components/LineEditMulti.qml b/components/LineEditMulti.qml index 17b50b2e..73033c7e 100644 --- a/components/LineEditMulti.qml +++ b/components/LineEditMulti.qml @@ -83,6 +83,9 @@ ColumnLayout { property alias addressValidation: input.addressValidation property string backgroundColor: "" // mock + property alias inlineButton: inlineButtonId + property bool inlineButtonVisible: false + signal labelButtonClicked(); signal inputLabelLinkActivated(); signal editingFinished(); @@ -183,5 +186,14 @@ ColumnLayout { anchors.fill: parent visible: !item.borderDisabled } + + MoneroComponents.InlineButton { + id: inlineButtonId + visible: (inlineButtonId.text || inlineButtonId.icon) && inlineButtonVisible ? true : false + anchors.right: parent.right + anchors.rightMargin: 8 * scaleRatio + anchors.top: parent.top + anchors.topMargin: 4 * scaleRatio + } } } diff --git a/images/qr.png b/images/qr.png new file mode 100644 index 0000000000000000000000000000000000000000..017f523b06d51a3b86eaef2fd66ae82b1e215fda GIT binary patch literal 2567 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 literal 0 HcmV?d00001 diff --git a/images/qr@2x.png b/images/qr@2x.png new file mode 100644 index 0000000000000000000000000000000000000000..36b8e479818a8f176be0aa320ac6c8f02b2a4816 GIT binary patch literal 5390 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 literal 0 HcmV?d00001 diff --git a/pages/AddressBook.qml b/pages/AddressBook.qml index 56774bb3..fecb9d05 100644 --- a/pages/AddressBook.qml +++ b/pages/AddressBook.qml @@ -28,14 +28,16 @@ import QtQuick 2.0 import QtQuick.Layouts 1.1 -import "../components" +import "../components" as MoneroComponents import moneroComponents.AddressBook 1.0 import moneroComponents.AddressBookModel 1.0 +import moneroComponents.Clipboard 1.0 ColumnLayout { id: root property var model property bool selectAndSend: false + Clipboard { id: clipboard } ColumnLayout { Layout.margins: (isMobile ? 17 : 20) * scaleRatio @@ -44,34 +46,27 @@ ColumnLayout { spacing: 26 * scaleRatio visible: !root.selectAndSend - RowLayout { - StandardButton { - id: qrfinderButton - text: qsTr("Qr Code") + translationManager.emptyString - visible : appWindow.qrScannerEnabled - enabled : visible - width: visible ? 60 * scaleRatio : 0 - onClicked: { - cameraUi.state = "Capture" - cameraUi.qrcode_decoded.connect(updateFromQrCode) - } - } - - LineEditMulti { - Layout.fillWidth: true; - id: addressLine - labelText: qsTr("Address") + translationManager.emptyString - error: true; - placeholderText: qsTr("4.. / 8..") + translationManager.emptyString - wrapMode: Text.WrapAnywhere - addressValidation: true + MoneroComponents.LineEditMulti { + id: addressLine + Layout.fillWidth: true + fontBold: true + labelText: qsTr("Address") + translationManager.emptyString + placeholderText: qsTr("4.. / 8..") + translationManager.emptyString + wrapMode: Text.WrapAnywhere + addressValidation: true + inlineButton.icon: "../images/qr.png" + inlineButton.buttonColor: MoneroComponents.Style.orange + inlineButton.onClicked: { + cameraUi.state = "Capture" + cameraUi.qrcode_decoded.connect(updateFromQrCode) } + inlineButtonVisible : appWindow.qrScannerEnabled && !addressLine.text } - LineEditMulti { + MoneroComponents.LineEditMulti { id: paymentIdLine visible: appWindow.persistentSettings.showPid - Layout.fillWidth: true; + Layout.fillWidth: true labelText: qsTr("Payment ID (Optional)") + translationManager.emptyString placeholderText: qsTr("Paste 64 hexadecimal characters") + translationManager.emptyString wrapMode: Text.WrapAnywhere @@ -79,9 +74,9 @@ ColumnLayout { // + translationManager.emptyString } - LineEditMulti { + MoneroComponents.LineEditMulti { id: descriptionLine - Layout.fillWidth: true; + Layout.fillWidth: true labelText: qsTr("Description (Optional)") + translationManager.emptyString placeholderText: qsTr("Give this entry a name or description") + translationManager.emptyString wrapMode: Text.WrapAnywhere @@ -91,7 +86,7 @@ ColumnLayout { RowLayout { id: addButton Layout.bottomMargin: 17 * scaleRatio - StandardButton { + MoneroComponents.StandardButton { text: qsTr("Add") + translationManager.emptyString enabled: checkInformation(addressLine.text, paymentIdLine.text, appWindow.persistentSettings.nettype) @@ -129,16 +124,16 @@ ColumnLayout { NumberAnimation { duration: 200; easing.type: Easing.InQuad } } - Scroll { + MoneroComponents.Scroll { id: flickableScroll anchors.right: table.right - anchors.rightMargin: -14 + anchors.rightMargin: -14 * scaleRatio anchors.top: table.top anchors.bottom: table.bottom flickable: table } - AddressBookTable { + MoneroComponents.AddressBookTable { id: table anchors.left: parent.left anchors.right: parent.right @@ -179,7 +174,6 @@ ColumnLayout { console.log("updateFromQrCode") addressLine.text = address paymentIdLine.text = payment_id - //amountLine.text = amount descriptionLine.text = recipient_name + " " + tx_description cameraUi.qrcode_decoded.disconnect(updateFromQrCode) } diff --git a/pages/Transfer.qml b/pages/Transfer.qml index aba47b45..c326ff0e 100644 --- a/pages/Transfer.qml +++ b/pages/Transfer.qml @@ -168,7 +168,7 @@ Rectangle { Layout.topMargin: 12 * scaleRatio text: qsTr("Transaction priority") + translationManager.emptyString fontBold: false - fontSize: 16 + fontSize: 16 * scaleRatio } // Note: workaround for translations in listElements // ListElement: cannot use script for property value, so @@ -235,24 +235,19 @@ Rectangle { addressLine.text = clipboardText; } } - } - - StandardButton { - id: qrfinderButton - text: qsTr("QR Code") + translationManager.emptyString - visible : appWindow.qrScannerEnabled - enabled : visible - width: visible ? 60 * scaleRatio : 0 - onClicked: { + inlineButton.icon: "../images/qr.png" + inlineButton.buttonColor: MoneroComponents.Style.orange + inlineButton.onClicked: { cameraUi.state = "Capture" cameraUi.qrcode_decoded.connect(updateFromQrCode) } + inlineButtonVisible : appWindow.qrScannerEnabled && !addressLine.text } } StandardButton { id: resolveButton - width: 80 + width: 80 * scaleRatio text: qsTr("Resolve") + translationManager.emptyString visible: TxUtils.isValidOpenAliasAddress(addressLine.text) enabled : visible diff --git a/qml.qrc b/qml.qrc index 1a234299..ee75a59a 100644 --- a/qml.qrc +++ b/qml.qrc @@ -213,6 +213,8 @@ components/RadioButton.qml images/editIcon.png images/editIcon@2x.png + images/qr.png + images/qr@2x.png pages/settings/Settings.qml pages/settings/SettingsWallet.qml pages/settings/SettingsNode.qml