Skip to content

Commit 02e7ce7

Browse files
johnny9johnny9
committed
qml: Introduce the CoinSelection page
The CoinSelection page is opened up from the Send page. The button to push CoinSelection on the Send page stack is enabled in the ellipsis menu. The toggle in the ellipsis menu can set a QSetting for enabled/disabled. All of these components are added to the DesktopWallets and Send page.
1 parent 15f115c commit 02e7ce7

File tree

10 files changed

+614
-131
lines changed

10 files changed

+614
-131
lines changed

‎qml/bitcoin_qml.qrc

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,14 @@
44
<file>components/BlockClock.qml</file>
55
<file>components/BlockClockDisplayMode.qml</file>
66
<file>components/BlockCounter.qml</file>
7-
<file>controls/CaretRightIcon.qml</file>
87
<file>components/ConnectionOptions.qml</file>
98
<file>components/ConnectionSettings.qml</file>
10-
<file>components/PeersIndicator.qml</file>
119
<file>components/DeveloperOptions.qml</file>
1210
<file>components/ExternalPopup.qml</file>
1311
<file>components/NetworkTrafficGraph.qml</file>
1412
<file>components/NetworkIndicator.qml</file>
13+
<file>components/OptionPopup.qml</file>
14+
<file>components/PeersIndicator.qml</file>
1515
<file>components/ProxySettings.qml</file>
1616
<file>components/StorageLocations.qml</file>
1717
<file>components/Separator.qml</file>
@@ -21,7 +21,9 @@
2121
<file>components/TotalBytesIndicator.qml</file>
2222
<file>components/Tooltip.qml</file>
2323
<file>controls/AddWalletButton.qml</file>
24+
<file>controls/CaretRightIcon.qml</file>
2425
<file>controls/ContinueButton.qml</file>
26+
<file>controls/CoreCheckBox.qml</file>
2527
<file>controls/CoreText.qml</file>
2628
<file>controls/CoreTextField.qml</file>
2729
<file>controls/ExternalLink.qml</file>
@@ -32,6 +34,9 @@
3234
<file>controls/IPAddressValueInput.qml</file>
3335
<file>controls/KeyValueRow.qml</file>
3436
<file>controls/LabeledTextInput.qml</file>
37+
<file>controls/LabeledCoinControlButton.qml</file>
38+
<file>controls/EllipsisMenuButton.qml</file>
39+
<file>controls/EllipsisMenuToggleItem.qml</file>
3540
<file>controls/NavButton.qml</file>
3641
<file>controls/NavigationBar.qml</file>
3742
<file>controls/NavigationBar2.qml</file>
@@ -43,6 +48,7 @@
4348
<file>controls/PageStack.qml</file>
4449
<file>controls/ProgressIndicator.qml</file>
4550
<file>controls/qmldir</file>
51+
<file>controls/SendOptionsPopup.qml</file>
4652
<file>controls/Setting.qml</file>
4753
<file>controls/TextButton.qml</file>
4854
<file>controls/Theme.qml</file>
@@ -74,6 +80,7 @@
7480
<file>pages/settings/SettingsTheme.qml</file>
7581
<file>pages/wallet/Activity.qml</file>
7682
<file>pages/wallet/ActivityDetails.qml</file>
83+
<file>pages/wallet/CoinSelection.qml</file>
7784
<file>pages/wallet/CreateBackup.qml</file>
7885
<file>pages/wallet/CreateConfirm.qml</file>
7986
<file>pages/wallet/CreateIntro.qml</file>

‎qml/components/OptionPopup.qml

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
// Copyright (c) 2025 The Bitcoin Core developers
2+
// Distributed under the MIT software license, see the accompanying
3+
// file COPYING or http://www.opensource.org/licenses/mit-license.php.
4+
5+
import QtQuick 2.15
6+
import QtQuick.Controls 2.15
7+
import QtQuick.Layouts 1.15
8+
9+
import "../controls"
10+
11+
Popup {
12+
id: root
13+
14+
background: Item {
15+
anchors.fill: parent
16+
Rectangle {
17+
color: Theme.color.neutral0
18+
border.color: Theme.color.neutral4
19+
radius: 5
20+
border.width: 1
21+
anchors.fill: parent
22+
}
23+
}
24+
}

‎qml/controls/CoreCheckBox.qml

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
// Copyright (c) 2025 The Bitcoin Core developers
2+
// Distributed under the MIT software license, see the accompanying
3+
// file COPYING or http://www.opensource.org/licenses/mit-license.php.
4+
5+
import QtQuick 2.15
6+
import QtQuick.Controls 2.15
7+
8+
AbstractButton {
9+
id: root
10+
implicitWidth: 20
11+
implicitHeight: 20
12+
13+
property color borderColor: Theme.color.neutral9
14+
property color fillColor: Theme.color.neutral9
15+
16+
background: null
17+
18+
checkable: true
19+
hoverEnabled: AppMode.isDesktop
20+
21+
contentItem: Rectangle {
22+
radius: 3
23+
border.color: root.checked ? root.fillColor : root.borderColor
24+
border.width: 1
25+
color: root.checked ? root.fillColor : "transparent"
26+
}
27+
}

‎qml/controls/EllipsisMenuButton.qml

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
// Copyright (c) 2025 The Bitcoin Core developers
2+
// Distributed under the MIT software license, see the accompanying
3+
// file COPYING or http://www.opensource.org/licenses/mit-license.php.
4+
5+
import QtQuick 2.15
6+
import QtQuick.Controls 2.15
7+
import QtQuick.Layouts 1.15
8+
9+
import org.bitcoincore.qt 1.0
10+
11+
Button {
12+
id: root
13+
14+
property color hoverColor: Theme.color.orange
15+
property color activeColor: Theme.color.orange
16+
17+
hoverEnabled: AppMode.isDesktop
18+
implicitHeight: 35
19+
implicitWidth: 35
20+
21+
MouseArea {
22+
anchors.fill: parent
23+
enabled: false
24+
hoverEnabled: true
25+
cursorShape: Qt.PointingHandCursor
26+
}
27+
28+
background: null
29+
30+
contentItem: Icon {
31+
id: ellipsisIcon
32+
anchors.fill: parent
33+
source: "image://images/ellipsis"
34+
color: Theme.color.neutral9
35+
size: 35
36+
}
37+
38+
states: [
39+
State {
40+
name: "CHECKED"; when: root.checked
41+
PropertyChanges { target: ellipsisIcon; color: activeColor }
42+
},
43+
State {
44+
name: "HOVER"; when: root.hovered
45+
PropertyChanges { target: ellipsisIcon; color: hoverColor }
46+
}
47+
]
48+
}

‎qml/controls/EllipsisMenuToggleItem.qml

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
// Copyright (c) 2025 The Bitcoin Core developers
2+
// Distributed under the MIT software license, see the accompanying
3+
// file COPYING or http://www.opensource.org/licenses/mit-license.php.
4+
5+
import QtQuick 2.15
6+
import QtQuick.Controls 2.15
7+
import QtQuick.Layouts 1.15
8+
import org.bitcoincore.qt 1.0
9+
10+
Button {
11+
property int bgRadius: 5
12+
property color bgDefaultColor: "transparent"
13+
property color bgHoverColor: Theme.color.neutral2
14+
property color textColor: Theme.color.neutral7
15+
property color textHoverColor: Theme.color.neutral9
16+
property color textActiveColor: Theme.color.neutral7
17+
18+
id: root
19+
checkable: true
20+
checked: optionSwitch.checked
21+
hoverEnabled: AppMode.isDesktop
22+
23+
implicitWidth: 280
24+
25+
MouseArea {
26+
anchors.fill: parent
27+
enabled: false
28+
hoverEnabled: true
29+
cursorShape: Qt.PointingHandCursor
30+
}
31+
32+
onClicked: {
33+
optionSwitch.checked = !optionSwitch.checked
34+
}
35+
36+
contentItem: RowLayout {
37+
spacing: 7
38+
anchors.fill: parent
39+
anchors.centerIn: parent
40+
anchors.margins: 10
41+
CoreText {
42+
Layout.fillWidth: true
43+
Layout.alignment: Qt.AlignVCenter
44+
horizontalAlignment: Text.AlignLeft
45+
font.pixelSize: 15
46+
text: root.text
47+
}
48+
OptionSwitch {
49+
id: optionSwitch
50+
Layout.alignment: Qt.AlignVCenter
51+
Layout.preferredWidth: 40
52+
Layout.preferredHeight: 24
53+
checked: root.checked
54+
}
55+
}
56+
57+
background: Rectangle {
58+
id: bg
59+
color: root.bgDefaultColor
60+
radius: root.bgRadius
61+
62+
Behavior on color {
63+
ColorAnimation { duration: 150 }
64+
}
65+
}
66+
67+
states: [
68+
State {
69+
name: "HOVER"; when: root.hovered
70+
PropertyChanges { target: bg; color: root.bgHoverColor }
71+
PropertyChanges { target: buttonText; color: root.textHoverColor }
72+
}
73+
]
74+
}

‎qml/controls/LabeledCoinControlButton.qml

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
// Copyright (c) 2025 The Bitcoin Core developers
2+
// Distributed under the MIT software license, see the accompanying
3+
// file COPYING or http://www.opensource.org/licenses/mit-license.php.
4+
5+
import QtQuick 2.15
6+
import QtQuick.Controls 2.15
7+
import QtQuick.Layouts 1.15
8+
9+
Item {
10+
property int coinsSelected: 0
11+
12+
signal openCoinControl
13+
14+
id: root
15+
implicitHeight: label.height
16+
17+
CoreText {
18+
id: label
19+
anchors.left: parent.left
20+
anchors.verticalCenter: parent.verticalCenter
21+
horizontalAlignment: Text.AlignLeft
22+
width: 110
23+
color: Theme.color.neutral9
24+
font.pixelSize: 18
25+
text: qsTr("Inputs")
26+
}
27+
28+
CoreText {
29+
anchors.left: label.right
30+
anchors.verticalCenter: parent.verticalCenter
31+
horizontalAlignment: Text.AlignLeft
32+
color: Theme.color.orangeLight1
33+
font.pixelSize: 18
34+
text: {
35+
if (coinsSelected === 0) {
36+
qsTr("Select")
37+
} else {
38+
qsTr("%1 input%2 selected")
39+
.arg(coinsSelected)
40+
.arg(coinsSelected === 1 ? "" : "s")
41+
}
42+
}
43+
44+
MouseArea {
45+
anchors.fill: parent
46+
onClicked: root.openCoinControl()
47+
cursorShape: Qt.PointingHandCursor
48+
}
49+
}
50+
}

‎qml/controls/SendOptionsPopup.qml

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
// Copyright (c) 2025 The Bitcoin Core developers
2+
// Distributed under the MIT software license, see the accompanying
3+
// file COPYING or http://www.opensource.org/licenses/mit-license.php.
4+
5+
import QtQuick 2.15
6+
import QtQuick.Controls 2.15
7+
import QtQuick.Layouts 1.15
8+
9+
import "../components"
10+
import "../controls"
11+
12+
OptionPopup {
13+
id: root
14+
15+
property alias coinControlEnabled: coinControlToggle.checked
16+
17+
clip: true
18+
modal: true
19+
dim: false
20+
21+
EllipsisMenuToggleItem {
22+
id: coinControlToggle
23+
anchors.centerIn: parent
24+
text: qsTr("Enable Coin control")
25+
}
26+
}

0 commit comments

Comments
 (0)