From af0ddf69e4a9bc75b3b61a4d31cc086ba26b6377 Mon Sep 17 00:00:00 2001 From: jarolrod Date: Fri, 31 Mar 2023 06:04:21 -0400 Subject: [PATCH] qml: introduce Display Settings page --- src/Makefile.qt.include | 1 + src/qml/bitcoin_qml.qrc | 1 + src/qml/controls/Theme.qml | 1 + src/qml/pages/node/NodeSettings.qml | 38 ++++++-- src/qml/pages/settings/SettingsDisplay.qml | 101 +++++++++++++++++++++ 5 files changed, 133 insertions(+), 9 deletions(-) create mode 100644 src/qml/pages/settings/SettingsDisplay.qml diff --git a/src/Makefile.qt.include b/src/Makefile.qt.include index 60264bc560..525199c045 100644 --- a/src/Makefile.qt.include +++ b/src/Makefile.qt.include @@ -393,6 +393,7 @@ QML_RES_QML = \ qml/pages/settings/SettingsBlockClockDisplayMode.qml \ qml/pages/settings/SettingsConnection.qml \ qml/pages/settings/SettingsDeveloper.qml \ + qml/pages/settings/SettingsDisplay.qml \ qml/pages/settings/SettingsProxy.qml \ qml/pages/settings/SettingsStorage.qml \ qml/pages/settings/SettingsTheme.qml diff --git a/src/qml/bitcoin_qml.qrc b/src/qml/bitcoin_qml.qrc index 65639aedd2..c97b095bac 100644 --- a/src/qml/bitcoin_qml.qrc +++ b/src/qml/bitcoin_qml.qrc @@ -54,6 +54,7 @@ pages/settings/SettingsBlockClockDisplayMode.qml pages/settings/SettingsConnection.qml pages/settings/SettingsDeveloper.qml + pages/settings/SettingsDisplay.qml pages/settings/SettingsProxy.qml pages/settings/SettingsStorage.qml pages/settings/SettingsTheme.qml diff --git a/src/qml/controls/Theme.qml b/src/qml/controls/Theme.qml index 3699e1fe5d..df62e0a4ad 100644 --- a/src/qml/controls/Theme.qml +++ b/src/qml/controls/Theme.qml @@ -12,6 +12,7 @@ Control { Settings { id: settings + property alias dark: root.dark property alias blockclocksize: root.blockclocksize } diff --git a/src/qml/pages/node/NodeSettings.qml b/src/qml/pages/node/NodeSettings.qml index 3acf27a0d1..931edceb75 100644 --- a/src/qml/pages/node/NodeSettings.qml +++ b/src/qml/pages/node/NodeSettings.qml @@ -38,23 +38,26 @@ Item { width: Math.min(parent.width, 450) anchors.horizontalCenter: parent.horizontalCenter Setting { + id: gotoAbout Layout.fillWidth: true - header: qsTr("Dark Mode") - actionItem: OptionSwitch { - checked: Theme.dark - onToggled: Theme.toggleDark() + header: qsTr("About") + actionItem: CaretRightButton { + stateColor: gotoAbout.stateColor + onClicked: { + nodeSettingsView.push(about_page) + } } - onClicked: loadedItem.toggled() + onClicked: loadedItem.clicked() } Separator { Layout.fillWidth: true } Setting { - id: gotoAbout + id: gotoDisplay Layout.fillWidth: true - header: qsTr("About") + header: qsTr("Display") actionItem: CaretRightButton { - stateColor: gotoAbout.stateColor + stateColor: gotoDisplay.stateColor onClicked: { - nodeSettingsView.push(about_page) + nodeSettingsView.push(display_page) } } onClicked: loadedItem.clicked() @@ -127,6 +130,23 @@ Item { } } } + Component { + id: display_page + SettingsDisplay { + navLeftDetail: NavButton { + iconSource: "image://images/caret-left" + text: qsTr("Back") + onClicked: { + nodeSettingsView.pop() + } + } + navMiddleDetail: Header { + headerBold: true + headerSize: 18 + header: qsTr("Settings") + } + } + } Component { id: storage_page SettingsStorage { diff --git a/src/qml/pages/settings/SettingsDisplay.qml b/src/qml/pages/settings/SettingsDisplay.qml new file mode 100644 index 0000000000..2a9d0b9ffe --- /dev/null +++ b/src/qml/pages/settings/SettingsDisplay.qml @@ -0,0 +1,101 @@ +// Copyright (c) 2023 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 "../../controls" +import "../../components" + +Item { + property alias navLeftDetail: displaySettingsView.navLeftDetail + property alias navMiddleDetail: displaySettingsView.navMiddleDetail + StackView { + id: displaySettingsView + property alias navLeftDetail: displaySettings.navLeftDetail + property alias navMiddleDetail: displaySettings.navMiddleDetail + property bool newcompilebool: false + anchors.fill: parent + + + initialItem: Page { + id: displaySettings + property alias navLeftDetail: navbar.leftDetail + property alias navMiddleDetail: navbar.middleDetail + background: null + implicitWidth: 450 + leftPadding: 20 + rightPadding: 20 + topPadding: 30 + + header: NavigationBar { + id: navbar + } + ColumnLayout { + spacing: 4 + width: Math.min(parent.width, 450) + anchors.horizontalCenter: parent.horizontalCenter + Setting { + id: gotoTheme + Layout.fillWidth: true + header: qsTr("Theme") + actionItem: CaretRightButton { + stateColor: gotoTheme.stateColor + onClicked: { + nodeSettingsView.push(theme_page) + } + } + onClicked: loadedItem.clicked() + } + Separator { Layout.fillWidth: true } + Setting { + id: gotoBlockClockSize + Layout.fillWidth: true + header: qsTr("Block clock display mode") + actionItem: CaretRightButton { + stateColor: gotoBlockClockSize.stateColor + onClicked: { + nodeSettingsView.push(blockclocksize_page) + } + } + onClicked: loadedItem.clicked() + } + } + } + } + Component { + id: theme_page + SettingsTheme { + navLeftDetail: NavButton { + iconSource: "image://images/caret-left" + text: qsTr("Back") + onClicked: { + nodeSettingsView.pop() + } + } + navMiddleDetail: Header { + headerBold: true + headerSize: 18 + header: qsTr("Theme") + } + } + } + Component { + id: blockclocksize_page + SettingsBlockClockDisplayMode { + navLeftDetail: NavButton { + iconSource: "image://images/caret-left" + text: qsTr("Back") + onClicked: { + nodeSettingsView.pop() + } + } + navMiddleDetail: Header { + headerBold: true + headerSize: 18 + header: qsTr("Block clock display mode") + } + } + } +}