From c0c1fcf949508e293632bf1dec61511f374a2396 Mon Sep 17 00:00:00 2001 From: Daniel Teichmann Date: Tue, 29 Jun 2021 17:02:25 +0200 Subject: Add theme switch to side navigation menu --- src/main.qml | 42 ++++++++++++++++++++++++++++++++++-------- 1 file changed, 34 insertions(+), 8 deletions(-) diff --git a/src/main.qml b/src/main.qml index d91c962..f8e0df4 100644 --- a/src/main.qml +++ b/src/main.qml @@ -231,7 +231,8 @@ ApplicationWindow { } // Set dark/light theme based on the slider setting - Material.theme: theme.position < 1 ? Material.Light : Material.Dark + Material.theme: inPortrait ? (theme_portrait.position < 1 ? Material.Light : Material.Dark) + : (theme_landscape.position < 1 ? Material.Light : Material.Dark) ToolBar { id: top_menu_bar_frame @@ -250,10 +251,11 @@ ApplicationWindow { anchors.top: parent.top Switch { - id: theme + id: theme_landscape width: 150 implicitWidth: 100 visible: !inPortrait + parent: inPortrait ? sidebar_listview : top_menu_bar_frame height: parent.height anchors.margins: 10 @@ -262,25 +264,49 @@ ApplicationWindow { anchors.verticalCenterOffset: 0 anchors.leftMargin: 0 anchors.verticalCenter: parent.verticalCenter + + /*! + Here is the default setting for dark/light mode + */ checked: true + + onCheckedChanged: { + theme_portrait.checked = checked + } + } + + Switch { + id: theme_portrait + visible: inPortrait + parent: sidebar_listview + + height: 50 + width: parent.width + + anchors.bottom: parent.bottom + text: qsTr("Dark theme") + + checked: theme_landscape.checked + onCheckedChanged: { + theme_landscape.checked = checked + } } Label { id: header_text height: parent.height - color: "#ffffff" + color: "white" text: qsTr("Allow Remote Control") - anchors.left: inPortrait ? burger_button.right : theme.right - anchors.leftMargin: 5 - horizontalAlignment: Text.AlignRight - padding: 5 - font.family: "Verdana" font.pointSize: 20 fontSizeMode: Text.Fit + horizontalAlignment: Text.AlignRight verticalAlignment: Text.AlignVCenter + anchors.left: inPortrait ? burger_button.right : parent.left + anchors.leftMargin: inPortrait ? 5 : theme_landscape.width anchors.right: parent.right anchors.rightMargin: 5 anchors.verticalCenter: parent.verticalCenter + padding: 5 } Button { -- cgit v1.2.3