Initial Template for Request Payment page #435
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,239 @@ | ||
| // Copyright (c) 2024 The Bitcoin Core developers | ||
| // Distributed under the MIT software license, see the accompanying | ||
| // file COPYING or http://www.opensource.org/licenses/mit-license.php. | ||
|
|
||
| import QtQuick 2.15 | ||
| import QtQuick.Controls 2.15 | ||
| import QtQuick.Layouts 1.15 | ||
| import org.bitcoincore.qt 1.0 | ||
|
|
||
| import "../../controls" | ||
| import "../../components" | ||
| import "../settings" | ||
|
|
||
| Page { | ||
| id: root | ||
| background: null | ||
|
|
||
| property int requestCounter: 0 | ||
|
|
||
| ScrollView { | ||
| clip: true | ||
| width: parent.width | ||
| height: parent.height | ||
| contentWidth: width | ||
|
|
||
| CoreText { | ||
| id: title | ||
| anchors.left: contentRow.left | ||
| anchors.top: parent.top | ||
| anchors.topMargin: 20 | ||
| text: qsTr("Request a payment") | ||
| font.pixelSize: 21 | ||
| bold: true | ||
| } | ||
|
|
||
| RowLayout { | ||
| id: contentRow | ||
| anchors.top: title.bottom | ||
| anchors.topMargin: 40 | ||
| anchors.horizontalCenter: parent.horizontalCenter | ||
| spacing: 30 | ||
| ColumnLayout { | ||
| id: columnLayout | ||
| Layout.minimumWidth: 450 | ||
| Layout.maximumWidth: 470 | ||
|
|
||
| spacing: 5 | ||
|
|
||
| Item { | ||
| BitcoinAmount { | ||
| id: bitcoinAmount | ||
| } | ||
|
|
||
| height: amountInput.height | ||
| Layout.fillWidth: true | ||
| CoreText { | ||
| id: amountLabel | ||
| width: 110 | ||
| anchors.left: parent.left | ||
| anchors.verticalCenter: parent.verticalCenter | ||
| horizontalAlignment: Text.AlignLeft | ||
| color: Theme.color.neutral9 | ||
|
There was a problem hiding this comment. nit: should be There was a problem hiding this comment. I'll double check this. There has been some flip flopping on the design side but it should be decided now |
||
| text: "Amount" | ||
| font.pixelSize: 18 | ||
| } | ||
|
|
||
| TextField { | ||
| id: amountInput | ||
| anchors.left: amountLabel.right | ||
| anchors.verticalCenter: parent.verticalCenter | ||
| leftPadding: 0 | ||
| font.family: "Inter" | ||
| font.styleName: "Regular" | ||
| font.pixelSize: 18 | ||
| color: Theme.color.neutral9 | ||
| placeholderTextColor: Theme.color.neutral7 | ||
| background: Item {} | ||
| placeholderText: "0.00000000" | ||
| selectByMouse: true | ||
| onTextEdited: { | ||
| amountInput.text = bitcoinAmount.sanitize(amountInput.text) | ||
| } | ||
| } | ||
| Item { | ||
| width: unitLabel.width + flipIcon.width | ||
| height: Math.max(unitLabel.height, flipIcon.height) | ||
| anchors.right: parent.right | ||
| anchors.verticalCenter: parent.verticalCenter | ||
| MouseArea { | ||
| anchors.fill: parent | ||
| onClicked: { | ||
| if (bitcoinAmount.unit == BitcoinAmount.BTC) { | ||
| amountInput.text = bitcoinAmount.convert(amountInput.text, BitcoinAmount.BTC) | ||
| bitcoinAmount.unit = BitcoinAmount.SAT | ||
| } else { | ||
| amountInput.text = bitcoinAmount.convert(amountInput.text, BitcoinAmount.SAT) | ||
| bitcoinAmount.unit = BitcoinAmount.BTC | ||
| } | ||
| } | ||
| } | ||
| CoreText { | ||
| id: unitLabel | ||
| anchors.right: flipIcon.left | ||
| anchors.verticalCenter: parent.verticalCenter | ||
| text: bitcoinAmount.unitLabel | ||
| font.pixelSize: 18 | ||
| color: Theme.color.neutral7 | ||
| } | ||
| Icon { | ||
| id: flipIcon | ||
| anchors.right: parent.right | ||
| anchors.verticalCenter: parent.verticalCenter | ||
| source: "image://images/flip-vertical" | ||
| color: Theme.color.neutral8 | ||
| size: 30 | ||
| } | ||
| } | ||
| } | ||
|
|
||
| Separator { | ||
| Layout.fillWidth: true | ||
| } | ||
|
|
||
| LabeledTextInput { | ||
| id: label | ||
| Layout.fillWidth: true | ||
| labelText: qsTr("Label") | ||
| placeholderText: qsTr("Enter label...") | ||
| } | ||
|
|
||
| Separator { | ||
| Layout.fillWidth: true | ||
| } | ||
|
|
||
| LabeledTextInput { | ||
| id: message | ||
| Layout.fillWidth: true | ||
| labelText: qsTr("Message") | ||
| placeholderText: qsTr("Enter message...") | ||
| } | ||
|
|
||
| Separator { | ||
| Layout.fillWidth: true | ||
| } | ||
|
|
||
| Item { | ||
| Layout.fillWidth: true | ||
| Layout.minimumHeight: addressLabel.height + copyLabel.height | ||
| Layout.topMargin: 10 | ||
| height: addressLabel.height + copyLabel.height | ||
| CoreText { | ||
| id: addressLabel | ||
| anchors.left: parent.left | ||
| anchors.top: parent.top | ||
| horizontalAlignment: Text.AlignLeft | ||
| width: 110 | ||
| text: qsTr("Address") | ||
| font.pixelSize: 18 | ||
| color: Theme.color.neutral9 | ||
| } | ||
| CoreText { | ||
| id: copyLabel | ||
| anchors.left: parent.left | ||
| anchors.top: addressLabel.bottom | ||
| horizontalAlignment: Text.AlignLeft | ||
| width: 110 | ||
| text: qsTr("copy") | ||
| font.pixelSize: 18 | ||
| color: Theme.color.neutral7 | ||
| } | ||
|
|
||
| Rectangle { | ||
| anchors.left: addressLabel.right | ||
| anchors.right: parent.right | ||
| anchors.top: parent.top | ||
| anchors.bottom: parent.bottom | ||
| color: Theme.color.neutral2 | ||
| radius: 5 | ||
| CoreText { | ||
| id: address | ||
| anchors.fill: parent | ||
| anchors.leftMargin: 5 | ||
| horizontalAlignment: Text.AlignLeft | ||
| font.pixelSize: 18 | ||
| color: Theme.color.neutral9 | ||
| wrap: true | ||
| } | ||
| } | ||
| } | ||
|
|
||
| ContinueButton { | ||
| id: continueButton | ||
| Layout.fillWidth: true | ||
| Layout.topMargin: 30 | ||
| text: qsTr("Create bitcoin address") | ||
| onClicked: { | ||
| if (!clearRequest.visible) { | ||
| requestCounter = requestCounter + 1 | ||
| clearRequest.visible = true | ||
| title.text = qsTr("Payment request #" + requestCounter) | ||
| address.text = "bc1q f5xe y2tf 89k9 zy6k gnru wszy 5fsa truy 9te1 bu" | ||
|
There was a problem hiding this comment. Not likely to happen, but it seems to me like a bad idea to put a placeholder address here when someone curious might build this branch and try to use it with mainnet funds, maybe insert an invalid character or something else to indicate this is a placeholder? There was a problem hiding this comment. Ill remove the address from the code asap |
||
| continueButton.text = qsTr("Copy payment request") | ||
| } | ||
| } | ||
| } | ||
|
|
||
| ContinueButton { | ||
| id: clearRequest | ||
| Layout.fillWidth: true | ||
| Layout.topMargin: 10 | ||
| visible: false | ||
| borderColor: Theme.color.neutral6 | ||
| borderHoverColor: Theme.color.orangeLight1 | ||
| borderPressedColor: Theme.color.orangeLight2 | ||
| backgroundColor: "transparent" | ||
| backgroundHoverColor: "transparent" | ||
| backgroundPressedColor: "transparent" | ||
| text: qsTr("Clear") | ||
| onClicked: { | ||
| clearRequest.visible = false | ||
| title.text = qsTr("Request a payment") | ||
| address.text = "" | ||
| continueButton.text = qsTr("Create bitcoin address") | ||
| } | ||
| } | ||
| } | ||
|
|
||
| Rectangle { | ||
| id: qrPlaceholder | ||
| Layout.alignment: Qt.AlignTop | ||
| Layout.minimumWidth: 150 | ||
| Layout.maximumWidth: 150 | ||
| color: Theme.color.neutral2 | ||
| width: 150 | ||
| height: 150 | ||
| } | ||
| } | ||
| } | ||
| } | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: Maybe amount input deserves it's own control?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, it will be. I haven't committed to doing that just yet as I don't have a clear idea of exactly how the BitcoinAmounts and the Bitcoin Address inputs will be handled. I think the PR to do the input formatting of the amounts should take care of having this component extracted out with clear signals/properties.