Skip to content

Commit f4f9b79

Browse files
johnny9johnny9
committed
qml: Introduce FeeSelection to Send
The FeeSelection component provides the standard fee options via a drop down menu.
1 parent 0ff0688 commit f4f9b79

File tree

4 files changed

+194
-16
lines changed

4 files changed

+194
-16
lines changed

‎src/Makefile.qt.include

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -403,6 +403,7 @@ QML_RES_QML = \
403403
qml/components/ConnectionSettings.qml \
404404
qml/components/DeveloperOptions.qml \
405405
qml/components/ExternalPopup.qml \
406+
qml/components/FeeSelection.qml \
406407
qml/components/NetworkTrafficGraph.qml \
407408
qml/components/NetworkIndicator.qml \
408409
qml/components/OptionPopup.qml \

‎src/qml/bitcoin_qml.qrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
<file>components/ConnectionSettings.qml</file>
99
<file>components/DeveloperOptions.qml</file>
1010
<file>components/ExternalPopup.qml</file>
11+
<file>components/FeeSelection.qml</file>
1112
<file>components/NetworkTrafficGraph.qml</file>
1213
<file>components/NetworkIndicator.qml</file>
1314
<file>components/OptionPopup.qml</file>

‎src/qml/components/FeeSelection.qml

Lines changed: 187 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,187 @@
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+
import "../components"
11+
12+
Item {
13+
id: root
14+
15+
property int selectedIndex: 1
16+
property string selectedLabel: feeModel.get(selectedIndex).feeLabel
17+
18+
signal feeChanged(int target)
19+
20+
width: parent ? parent.width : 300
21+
height: 40
22+
23+
CoreText {
24+
id: label
25+
anchors.left: parent.left
26+
anchors.verticalCenter: parent.verticalCenter
27+
text: qsTr("Fee")
28+
font.pixelSize: 15
29+
}
30+
31+
Button {
32+
id: dropDownButton
33+
anchors.right: parent.right
34+
anchors.verticalCenter: parent.verticalCenter
35+
text: root.selectedLabel
36+
font.pixelSize: 15
37+
38+
hoverEnabled: true
39+
40+
HoverHandler {
41+
cursorShape: Qt.PointingHandCursor
42+
}
43+
44+
onPressed: feePopup.open()
45+
46+
contentItem: RowLayout {
47+
spacing: 5
48+
anchors.centerIn: parent
49+
50+
CoreText {
51+
id: value
52+
text: root.selectedLabel
53+
font.pixelSize: 15
54+
55+
Behavior on color {
56+
ColorAnimation { duration: 150 }
57+
}
58+
}
59+
60+
Icon {
61+
id: caret
62+
source: "image://images/caret-down-medium-filled"
63+
Layout.preferredWidth: 30
64+
size: 30
65+
color: dropDownButton.enabled ? Theme.color.orange : Theme.color.neutral4
66+
67+
Behavior on color {
68+
ColorAnimation { duration: 150 }
69+
}
70+
}
71+
}
72+
73+
background: Rectangle {
74+
id: dropDownButtonBg
75+
color: Theme.color.background
76+
radius: 6
77+
Behavior on color {
78+
ColorAnimation { duration: 150 }
79+
}
80+
}
81+
82+
states: [
83+
State {
84+
name: "CHECKED"; when: dropDownButton.checked
85+
PropertyChanges { target: icon; color: activeColor }
86+
},
87+
State {
88+
name: "HOVER"; when: dropDownButton.hovered
89+
PropertyChanges { target: dropDownButtonBg; color: Theme.color.neutral2 }
90+
},
91+
State {
92+
name: "DISABLED"; when: !dropDownButton.enabled
93+
PropertyChanges { target: dropDownButtonBg; color: Theme.color.background }
94+
}
95+
]
96+
}
97+
98+
Popup {
99+
id: feePopup
100+
modal: true
101+
dim: false
102+
103+
background: Rectangle {
104+
color: Theme.color.background
105+
radius: 6
106+
border.color: Theme.color.neutral3
107+
}
108+
109+
width: 260
110+
height: Math.min(feeModel.count * 40 + 20, 300)
111+
x: parent.width - width
112+
y: parent.height
113+
114+
contentItem: ListView {
115+
id: feeList
116+
model: feeModel
117+
interactive: false
118+
width: 260
119+
height: contentHeight
120+
delegate: ItemDelegate {
121+
required property string feeLabel
122+
required property int index
123+
required property int target
124+
125+
width: ListView.view.width
126+
height: 40
127+
128+
background: Rectangle {
129+
width: parent.width - 4
130+
height: parent.height - 4
131+
radius: 6
132+
color: Theme.color.neutral3
133+
visible: mouseArea.containsMouse
134+
}
135+
136+
RowLayout {
137+
anchors.fill: parent
138+
anchors.margins: 12
139+
spacing: 10
140+
141+
CoreText {
142+
text: feeLabel
143+
font.pixelSize: 15
144+
}
145+
146+
Item { Layout.fillWidth: true }
147+
148+
Icon {
149+
visible: index === root.selectedIndex
150+
source: "image://images/check"
151+
color: Theme.color.orange
152+
size: 20
153+
}
154+
}
155+
156+
MouseArea {
157+
id: mouseArea
158+
anchors.fill: parent
159+
hoverEnabled: true
160+
cursorShape: Qt.PointingHandCursor
161+
onClicked: {
162+
root.selectedIndex = index
163+
root.selectedLabel = feeLabel
164+
root.feeChanged(target)
165+
feePopup.close()
166+
}
167+
}
168+
169+
Rectangle {
170+
anchors.left: parent.left
171+
anchors.right: parent.right
172+
anchors.bottom: parent.bottom
173+
height: 1
174+
color: Theme.color.neutral3
175+
visible: index < feeModel.count - 1
176+
}
177+
}
178+
}
179+
}
180+
181+
ListModel {
182+
id: feeModel
183+
ListElement { feeLabel: qsTr("High (~10 mins)"); target: 1 }
184+
ListElement { feeLabel: qsTr("Default (~60 mins)"); target: 6 }
185+
ListElement { feeLabel: qsTr("Low (~24 hrs)"); target: 144 }
186+
}
187+
}

‎src/qml/pages/wallet/Send.qml

Lines changed: 5 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -199,23 +199,12 @@ PageStack {
199199
Layout.fillWidth: true
200200
}
201201

202-
Item {
203-
height: feeLabel.height + feeValue.height
202+
FeeSelection {
203+
id: feeSelection
204204
Layout.fillWidth: true
205-
CoreText {
206-
id: feeLabel
207-
anchors.left: parent.left
208-
anchors.top: parent.top
209-
text: "Fee"
210-
font.pixelSize: 15
211-
}
212-
213-
CoreText {
214-
id: feeValue
215-
anchors.right: parent.right
216-
anchors.top: parent.top
217-
text: qsTr("Default (~2,000 sats)")
218-
font.pixelSize: 15
205+
Layout.preferredHeight: 50
206+
onFeeChanged: {
207+
root.wallet.targetBlocks = target
219208
}
220209
}
221210

0 commit comments

Comments
 (0)