From b2c1a15b922b16376fe60ad1617112fadfee2af4 Mon Sep 17 00:00:00 2001 From: johnny9 <985648+johnny9@users.noreply.github.com> Date: Sat, 24 Aug 2024 00:40:20 -0400 Subject: [PATCH 1/2] qml: Introduce AddWalletButton --- src/Makefile.qt.include | 1 + src/qml/bitcoin_qml.qrc | 1 + src/qml/controls/AddWalletButton.qml | 83 +++++++++++++++++++++++++++ src/qml/pages/wallet/WalletSelect.qml | 27 ++------- 4 files changed, 90 insertions(+), 22 deletions(-) create mode 100644 src/qml/controls/AddWalletButton.qml diff --git a/src/Makefile.qt.include b/src/Makefile.qt.include index 8217d04798..6936bd0ca4 100644 --- a/src/Makefile.qt.include +++ b/src/Makefile.qt.include @@ -382,6 +382,7 @@ QML_RES_QML = \ qml/components/ThemeSettings.qml \ qml/components/TotalBytesIndicator.qml \ qml/components/Tooltip.qml \ + qml/controls/AddWalletButton.qml \ qml/controls/CaretRightIcon.qml \ qml/controls/ContinueButton.qml \ qml/controls/CoreText.qml \ diff --git a/src/qml/bitcoin_qml.qrc b/src/qml/bitcoin_qml.qrc index 61d2607fca..04c3fe7a85 100644 --- a/src/qml/bitcoin_qml.qrc +++ b/src/qml/bitcoin_qml.qrc @@ -20,6 +20,7 @@ components/ThemeSettings.qml components/TotalBytesIndicator.qml components/Tooltip.qml + controls/AddWalletButton.qml controls/ContinueButton.qml controls/CoreText.qml controls/CoreTextField.qml diff --git a/src/qml/controls/AddWalletButton.qml b/src/qml/controls/AddWalletButton.qml new file mode 100644 index 0000000000..8a2bca3dc5 --- /dev/null +++ b/src/qml/controls/AddWalletButton.qml @@ -0,0 +1,83 @@ +// 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 + +Button { + id: root + + property color bgActiveColor: Theme.color.neutral2 + property color textColor: Theme.color.neutral7 + property color textHoverColor: Theme.color.orange + property color textActiveColor: Theme.color.orange + + hoverEnabled: AppMode.isDesktop + implicitHeight: 30 + implicitWidth: 220 + + MouseArea { + anchors.fill: parent + enabled: false + hoverEnabled: true + cursorShape: Qt.PointingHandCursor + } + + contentItem: Item { + anchors.fill: parent + RowLayout { + anchors.centerIn: parent + spacing: 3 + Icon { + id: addIcon + Layout.alignment: Qt.AlignRight + source: "image://images/plus" + color: Theme.color.neutral7 + size: 16 + Layout.minimumWidth: 16 + Layout.preferredWidth: 16 + Layout.maximumWidth: 16 + } + CoreText { + id: addText + Layout.fillHeight: true + Layout.alignment: Qt.AlignLeft + text: qsTr("Add Wallet") + color: Theme.color.neutral7 + font.pixelSize: 15 + } + } + } + + background: Rectangle { + id: bg + height: 30 + width: 220 + radius: 5 + color: Theme.color.neutral3 + visible: root.hovered || root.checked + + FocusBorder { + visible: root.visualFocus + } + + Behavior on color { + ColorAnimation { duration: 150 } + } + } + + states: [ + State { + name: "CHECKED"; when: root.checked + }, + State { + name: "HOVER"; when: root.hovered + PropertyChanges { target: addText; color: textHoverColor } + PropertyChanges { target: addIcon; color: textHoverColor } + } + ] +} diff --git a/src/qml/pages/wallet/WalletSelect.qml b/src/qml/pages/wallet/WalletSelect.qml index 9905bc242f..4d0cf6f107 100644 --- a/src/qml/pages/wallet/WalletSelect.qml +++ b/src/qml/pages/wallet/WalletSelect.qml @@ -12,7 +12,7 @@ Popup { id: root property alias model: listView.model - implicitHeight: layout.height + arrow.height + implicitHeight: layout.height + arrow.height + 11 implicitWidth: 250 clip: true @@ -89,29 +89,12 @@ Popup { } } - RowLayout { + AddWalletButton { id: addWallet - Layout.preferredWidth: addIcon.size + addText.width - Layout.preferredHeight: 45 + Layout.alignment: Qt.AlignHCenter - Icon { - id: addIcon - Layout.alignment: Qt.AlignHCenter - source: "image://images/plus" - color: Theme.color.neutral8 - size: 14 - topPadding: 5 - bottomPadding: 10 - } - CoreText { - id: addText - Layout.alignment: Qt.AlignHCenter - text: qsTr("Add Wallet") - color: Theme.color.neutral9 - font.pixelSize: 15 - topPadding: 5 - bottomPadding: 10 - } + Layout.preferredWidth: 220 + Layout.preferredHeight: 30 } } } From 2d2be8c27c3d20bb6565b2560487ec158b4ffc6a Mon Sep 17 00:00:00 2001 From: johnny9 <985648+johnny9@users.noreply.github.com> Date: Sat, 24 Aug 2024 00:41:11 -0400 Subject: [PATCH 2/2] qml: Start AddWallet flow when AddWalletButton is clicked --- src/qml/pages/main.qml | 8 ++++++-- src/qml/pages/wallet/DesktopWallets.qml | 6 ++++++ src/qml/pages/wallet/WalletSelect.qml | 6 ++++++ 3 files changed, 18 insertions(+), 2 deletions(-) diff --git a/src/qml/pages/main.qml b/src/qml/pages/main.qml index 7e0854a7c2..ca52806ada 100644 --- a/src/qml/pages/main.qml +++ b/src/qml/pages/main.qml @@ -80,13 +80,17 @@ ApplicationWindow { Component { id: desktopWallets - DesktopWallets {} + DesktopWallets { + onAddWallet: { + main.push(createWalletWizard) + } + } } Component { id: createWalletWizard CreateWalletWizard { - onFinished: { + onFinished: { main.pop() } } diff --git a/src/qml/pages/wallet/DesktopWallets.qml b/src/qml/pages/wallet/DesktopWallets.qml index 1e45d8d248..ccaa787933 100644 --- a/src/qml/pages/wallet/DesktopWallets.qml +++ b/src/qml/pages/wallet/DesktopWallets.qml @@ -19,6 +19,8 @@ Page { ButtonGroup { id: navigationTabs } + signal addWallet() + header: NavigationBar2 { id: navBar leftItem: WalletBadge { @@ -41,6 +43,10 @@ Page { closePolicy: Popup.CloseOnPressOutside x: 0 y: parent.height + + onAddWallet: { + root.addWallet() + } } } centerItem: RowLayout { diff --git a/src/qml/pages/wallet/WalletSelect.qml b/src/qml/pages/wallet/WalletSelect.qml index 4d0cf6f107..54bc6c5e6c 100644 --- a/src/qml/pages/wallet/WalletSelect.qml +++ b/src/qml/pages/wallet/WalletSelect.qml @@ -16,6 +16,8 @@ Popup { implicitWidth: 250 clip: true + signal addWallet() + background: Item { anchors.fill: parent Rectangle { @@ -95,6 +97,10 @@ Popup { Layout.alignment: Qt.AlignHCenter Layout.preferredWidth: 220 Layout.preferredHeight: 30 + onClicked: { + root.addWallet() + root.close() + } } } }