From 378806087d9b3170bb76872e771ff51d8892e847 Mon Sep 17 00:00:00 2001 From: jarolrod Date: Sat, 19 Oct 2024 20:16:37 -0400 Subject: [PATCH] qml: Swap existing SwipeViews for PageStack Vertical PageStacks used to replace vertical SwipeViews. --- src/qml/pages/main.qml | 26 ++-- .../pages/onboarding/OnboardingConnection.qml | 76 ++++++----- src/qml/pages/onboarding/OnboardingCover.qml | 75 ++++++----- .../onboarding/OnboardingStorageAmount.qml | 86 +++++++----- src/qml/pages/settings/SettingsAbout.qml | 111 ++++++++-------- src/qml/pages/settings/SettingsConnection.qml | 124 +++++++++--------- src/qml/pages/settings/SettingsProxy.qml | 4 - src/qml/pages/settings/SettingsStorage.qml | 12 +- 8 files changed, 279 insertions(+), 235 deletions(-) diff --git a/src/qml/pages/main.qml b/src/qml/pages/main.qml index 64dffc9ee2..7e0854a7c2 100644 --- a/src/qml/pages/main.qml +++ b/src/qml/pages/main.qml @@ -99,18 +99,24 @@ ApplicationWindow { Component { id: node - SwipeView { - id: node_swipe - interactive: false - orientation: Qt.Vertical - NodeRunner { - onSettingsClicked: { - node_swipe.incrementCurrentIndex() + PageStack { + id: nodeStack + vertical: true + initialItem: node + Component { + id: node + NodeRunner { + onSettingsClicked: { + nodeStack.push(nodeSettings) + } } } - NodeSettings { - onDoneClicked: { - node_swipe.decrementCurrentIndex() + Component { + id: nodeSettings + NodeSettings { + onDoneClicked: { + nodeStack.pop() + } } } } diff --git a/src/qml/pages/onboarding/OnboardingConnection.qml b/src/qml/pages/onboarding/OnboardingConnection.qml index e4b6bb75e7..81d981c3b3 100644 --- a/src/qml/pages/onboarding/OnboardingConnection.qml +++ b/src/qml/pages/onboarding/OnboardingConnection.qml @@ -15,46 +15,52 @@ Page { signal next background: null clip: true - SwipeView { - id: connections + PageStack { + id: connectionStack anchors.fill: parent - interactive: false - orientation: Qt.Vertical - InformationPage { - navLeftDetail: NavButton { - iconSource: "image://images/caret-left" - text: qsTr("Back") - onClicked: root.back() - } - bannerItem: Image { - Layout.topMargin: 20 - Layout.alignment: Qt.AlignCenter - source: Theme.image.storage - sourceSize.width: 200 - sourceSize.height: 200 - } - bold: true - headerText: qsTr("Starting initial download") - headerMargin: 30 - description: qsTr("The application will connect to the Bitcoin network and start downloading and verifying transactions.\n\nThis may take several hours, or even days, based on your connection.") - descriptionMargin: 10 - detailActive: true - detailTopMargin: 10 - detailItem: RowLayout { - TextButton { + vertical: true + initialItem: onboardingConnection + Component { + id: onboardingConnection + InformationPage { + navLeftDetail: NavButton { + iconSource: "image://images/caret-left" + text: qsTr("Back") + onClicked: root.back() + } + bannerItem: Image { + Layout.topMargin: 20 Layout.alignment: Qt.AlignCenter - text: qsTr("Connection settings") - onClicked: connections.incrementCurrentIndex() + source: Theme.image.storage + sourceSize.width: 200 + sourceSize.height: 200 } + bold: true + headerText: qsTr("Starting initial download") + headerMargin: 30 + description: qsTr("The application will connect to the Bitcoin network and start downloading and verifying transactions.\n\nThis may take several hours, or even days, based on your connection.") + descriptionMargin: 10 + detailActive: true + detailTopMargin: 10 + detailItem: RowLayout { + TextButton { + Layout.alignment: Qt.AlignCenter + text: qsTr("Connection settings") + onClicked: connectionStack.push(connectionSettings) + } + } + lastPage: true + buttonText: qsTr("Next") + buttonMargin: 20 + onNext: root.next() } - lastPage: true - buttonText: qsTr("Next") - buttonMargin: 20 - onNext: root.next() } - SettingsConnection { - onboarding: true - onBack: connections.decrementCurrentIndex() + Component { + id: connectionSettings + SettingsConnection { + onboarding: true + onBack: connectionStack.pop() + } } } } diff --git a/src/qml/pages/onboarding/OnboardingCover.qml b/src/qml/pages/onboarding/OnboardingCover.qml index cadff79cb8..09e58153e8 100644 --- a/src/qml/pages/onboarding/OnboardingCover.qml +++ b/src/qml/pages/onboarding/OnboardingCover.qml @@ -14,47 +14,50 @@ Page { signal next background: null clip: true - SwipeView { - id: introductions + PageStack { + id: coverStack anchors.fill: parent - interactive: false - orientation: Qt.Horizontal - InformationPage { - navRightDetail: NavButton { - iconSource: "image://images/info" - iconHeight: 24 - iconWidth: 24 - iconColor: Theme.color.neutral0 - iconBackground: Rectangle { - radius: 12 - color: Theme.color.neutral9 + initialItem: onboardingCover + Component { + id: onboardingCover + InformationPage { + navRightDetail: NavButton { + iconSource: "image://images/info" + iconHeight: 24 + iconWidth: 24 + iconColor: Theme.color.neutral0 + iconBackground: Rectangle { + radius: 12 + color: Theme.color.neutral9 + } + onClicked: coverStack.push(coverSettings) } - onClicked: { - introductions.incrementCurrentIndex() + bannerItem: Image { + Layout.fillWidth: true + Layout.alignment: Qt.AlignCenter + source: "image://images/app" + // Bitcoin icon has ~11% padding + sourceSize.width: 112 + sourceSize.height: 112 } + bannerMargin: 0 + bold: true + headerText: qsTr("Bitcoin Core App") + headerSize: 36 + description: qsTr("Be part of the Bitcoin network.") + descriptionMargin: 10 + descriptionSize: 24 + subtext: qsTr("100% open-source & open-design") + buttonText: qsTr("Start") + onNext: root.next() } - bannerItem: Image { - Layout.fillWidth: true - Layout.alignment: Qt.AlignCenter - source: "image://images/app" - // Bitcoin icon has ~11% padding - sourceSize.width: 112 - sourceSize.height: 112 - } - bannerMargin: 0 - bold: true - headerText: qsTr("Bitcoin Core App") - headerSize: 36 - description: qsTr("Be part of the Bitcoin network.") - descriptionMargin: 10 - descriptionSize: 24 - subtext: qsTr("100% open-source & open-design") - buttonText: qsTr("Start") - onNext: root.next() } - SettingsAbout { - onboarding: true - onBack: introductions.decrementCurrentIndex() + Component { + id: coverSettings + SettingsAbout { + onboarding: true + onBack: coverStack.pop() + } } } } diff --git a/src/qml/pages/onboarding/OnboardingStorageAmount.qml b/src/qml/pages/onboarding/OnboardingStorageAmount.qml index e590eff4ea..300fc51276 100644 --- a/src/qml/pages/onboarding/OnboardingStorageAmount.qml +++ b/src/qml/pages/onboarding/OnboardingStorageAmount.qml @@ -13,49 +13,63 @@ Page { id: root signal back signal next + property bool customStorage: false + property int customStorageAmount background: null clip: true - SwipeView { - id: storages + PageStack { + id: stack anchors.fill: parent - interactive: false - orientation: Qt.Vertical - InformationPage { - navLeftDetail: NavButton { - iconSource: "image://images/caret-left" - text: qsTr("Back") - onClicked: root.back() - } - bannerActive: false - bold: true - headerText: qsTr("Storage") - headerMargin: 0 - description: qsTr("Data retrieved from the Bitcoin network is stored on your device.\nYou have 500GB of storage available.") - descriptionMargin: 10 - detailActive: true - detailItem: ColumnLayout { - spacing: 0 - StorageOptions { - customStorage: advancedStorage.loadedDetailItem.customStorage - customStorageAmount: advancedStorage.loadedDetailItem.customStorageAmount - Layout.maximumWidth: 450 - Layout.alignment: Qt.AlignCenter + vertical: true + initialItem: onboardingStorageAmount + Component { + id: onboardingStorageAmount + InformationPage { + navLeftDetail: NavButton { + iconSource: "image://images/caret-left" + text: qsTr("Back") + onClicked: root.back() } - TextButton { - Layout.topMargin: 10 - Layout.alignment: Qt.AlignCenter - text: qsTr("Detailed settings") - onClicked: storages.incrementCurrentIndex() + bannerActive: false + bold: true + headerText: qsTr("Storage") + headerMargin: 0 + description: qsTr("Data retrieved from the Bitcoin network is stored on your device.\nYou have 500GB of storage available.") + descriptionMargin: 10 + detailActive: true + detailItem: ColumnLayout { + spacing: 0 + StorageOptions { + customStorage: advancedStorage.loadedDetailItem.customStorage + customStorageAmount: advancedStorage.loadedDetailItem.customStorageAmount + Layout.maximumWidth: 450 + Layout.alignment: Qt.AlignCenter + } + TextButton { + Layout.topMargin: 10 + Layout.alignment: Qt.AlignCenter + text: qsTr("Detailed settings") + onClicked: stack.push(storageAmountSettings) + } } + buttonText: qsTr("Next") + buttonMargin: 20 + onNext: root.next() } - buttonText: qsTr("Next") - buttonMargin: 20 - onNext: root.next() } - SettingsStorage { - id: advancedStorage - onboarding: true - onBack: storages.decrementCurrentIndex() + Component { + id: storageAmountSettings + SettingsStorage { + id: advancedStorage + onboarding: true + onBack: stack.pop() + onCustomStorageChanged: { + root.customStorage = advancedStorage.customStorage + } + onCustomStorageAmountChanged: { + root.customStorageAmount = advancedStorage.customStorageAmount + } + } } } } diff --git a/src/qml/pages/settings/SettingsAbout.qml b/src/qml/pages/settings/SettingsAbout.qml index b42d3973ee..b12f122f74 100644 --- a/src/qml/pages/settings/SettingsAbout.qml +++ b/src/qml/pages/settings/SettingsAbout.qml @@ -8,70 +8,75 @@ import QtQuick.Layouts 1.15 import "../../controls" import "../../components" -Item { +Page { id: root signal back property bool onboarding: false - SwipeView { - id: aboutSwipe + background: null + PageStack { + id: stack anchors.fill: parent - interactive: false - orientation: Qt.Horizontal - InformationPage { - id: about_settings - bannerActive: false - bannerMargin: 0 - bold: true - showHeader: root.onboarding - headerText: qsTr("About") - headerMargin: 0 - description: qsTr("Bitcoin Core is an open source project.\nIf you find it useful, please contribute.\n\n This is experimental software.") - descriptionMargin: 20 - detailActive: true - detailItem: AboutOptions { - onNext: aboutSwipe.incrementCurrentIndex() - } + initialItem: aboutPage + Component { + id: aboutPage + InformationPage { + id: about_settings + bannerActive: false + bannerMargin: 0 + bold: true + showHeader: root.onboarding + headerText: qsTr("About") + headerMargin: 0 + description: qsTr("Bitcoin Core is an open source project.\nIf you find it useful, please contribute.\n\n This is experimental software.") + descriptionMargin: 20 + detailActive: true + detailItem: AboutOptions { + onNext: stack.push(developerSettings) + } - states: [ - State { - when: root.onboarding - PropertyChanges { - target: about_settings - navLeftDetail: backButton - navMiddleDetail: null + states: [ + State { + when: root.onboarding + PropertyChanges { + target: about_settings + navLeftDetail: backButton + navMiddleDetail: null + } + }, + State { + when: !root.onboarding + PropertyChanges { + target: about_settings + navLeftDetail: backButton + navMiddleDetail: header + } } - }, - State { - when: !root.onboarding - PropertyChanges { - target: about_settings - navLeftDetail: backButton - navMiddleDetail: header - } - } - ] + ] - Component { - id: backButton - NavButton { - iconSource: "image://images/caret-left" - text: qsTr("Back") - onClicked: root.back() + Component { + id: backButton + NavButton { + iconSource: "image://images/caret-left" + text: qsTr("Back") + onClicked: root.back() + } } - } - Component { - id: header - Header { - headerBold: true - headerSize: 18 - header: qsTr("About") + Component { + id: header + Header { + headerBold: true + headerSize: 18 + header: qsTr("About") + } } } } - SettingsDeveloper { - id: about_developer - onboarding: root.onboarding - onBack: aboutSwipe.decrementCurrentIndex() + Component { + id: developerSettings + SettingsDeveloper { + onboarding: root.onboarding + onBack: stack.pop() + } } } } diff --git a/src/qml/pages/settings/SettingsConnection.qml b/src/qml/pages/settings/SettingsConnection.qml index c98b343a44..d180fa2ff2 100644 --- a/src/qml/pages/settings/SettingsConnection.qml +++ b/src/qml/pages/settings/SettingsConnection.qml @@ -8,79 +8,83 @@ import QtQuick.Layouts 1.15 import "../../controls" import "../../components" -Item { +Page { id: root signal back property bool onboarding: false - SwipeView { - id: connectionSwipe - property bool onboarding: false + background: null + PageStack { + id: stack anchors.fill: parent - interactive: false - orientation: Qt.Horizontal - InformationPage { - id: connection_settings - background: null - clip: true - bannerActive: false - bold: true - showHeader: root.onboarding - headerText: qsTr("Connection settings") - headerMargin: 0 - detailActive: true - detailItem: ConnectionSettings { - onNext: connectionSwipe.incrementCurrentIndex() - } + initialItem: connectionSettings + Component { + id: connectionSettings + InformationPage { + id: connection_settings + background: null + clip: true + bannerActive: false + bold: true + showHeader: root.onboarding + headerText: qsTr("Connection settings") + headerMargin: 0 + detailActive: true + detailItem: ConnectionSettings { + onNext: stack.push(proxySettings) + } - states: [ - State { - when: root.onboarding - PropertyChanges { - target: connection_settings - navLeftDetail: null - navMiddleDetail: null - navRightDetail: doneButton - } - }, - State { - when: !root.onboarding - PropertyChanges { - target: connection_settings - navLeftDetail: backButton - navMiddleDetail: header - navRightDetail: null + states: [ + State { + when: root.onboarding + PropertyChanges { + target: connection_settings + navLeftDetail: null + navMiddleDetail: null + navRightDetail: doneButton + } + }, + State { + when: !root.onboarding + PropertyChanges { + target: connection_settings + navLeftDetail: backButton + navMiddleDetail: header + navRightDetail: null + } } - } - ] - Component { - id: backButton - NavButton { - iconSource: "image://images/caret-left" - text: qsTr("Back") - onClicked: root.back() + ] + + Component { + id: backButton + NavButton { + iconSource: "image://images/caret-left" + text: qsTr("Back") + onClicked: root.back() + } } - } - Component { - id: header - Header { - headerBold: true - headerSize: 18 - header: qsTr("Connection settings") + Component { + id: header + Header { + headerBold: true + headerSize: 18 + header: qsTr("Connection settings") + } } - } - Component { - id: doneButton - NavButton { - text: qsTr("Done") - onClicked: root.back() + Component { + id: doneButton + NavButton { + text: qsTr("Done") + onClicked: root.back() + } } } } - SettingsProxy { - onBack: { - connectionSwipe.decrementCurrentIndex() + Component { + id: proxySettings + SettingsProxy { + onBack: stack.pop() } } } diff --git a/src/qml/pages/settings/SettingsProxy.qml b/src/qml/pages/settings/SettingsProxy.qml index 2f2d847a5b..afbed4b3f1 100644 --- a/src/qml/pages/settings/SettingsProxy.qml +++ b/src/qml/pages/settings/SettingsProxy.qml @@ -14,10 +14,6 @@ Page { id: root background: null - implicitWidth: 450 - leftPadding: 20 - rightPadding: 20 - topPadding: 30 header: NavigationBar2 { leftItem: NavButton { diff --git a/src/qml/pages/settings/SettingsStorage.qml b/src/qml/pages/settings/SettingsStorage.qml index 6dffbc49b8..2ca56742f3 100644 --- a/src/qml/pages/settings/SettingsStorage.qml +++ b/src/qml/pages/settings/SettingsStorage.qml @@ -10,6 +10,8 @@ import "../../components" InformationPage { id: root + property bool customStorage: false + property bool customStorageAmount property bool onboarding: false bannerActive: false bold: true @@ -17,7 +19,15 @@ InformationPage { headerText: qsTr("Storage settings") headerMargin: 0 detailActive: true - detailItem: StorageSettings {} + detailItem: StorageSettings { + id: storageSettings + onCustomStorageChanged: { + root.customStorage = storageSettings.customStorage + } + onCustomStorageAmountChanged: { + root.customStorageAmount = storageSettings.customStorageAmount + } + } states: [ State { when: root.onboarding