Refactor the settings dialog so that it uses a set of components/abstractions

for all of the tabs and stacks
This commit is contained in:
Adam Treat
2023-06-29 13:38:10 -04:00
committed by AT
parent b3c29e4179
commit dedb0025be
4 changed files with 96 additions and 154 deletions

View File

@@ -0,0 +1,87 @@
import QtCore
import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Basic
import QtQuick.Layouts
import mysettings
Item {
id: settingsStack
Theme {
id: theme
}
property ListModel tabTitlesModel: ListModel { }
property list<Component> tabs: [ ]
TabBar {
id: settingsTabBar
width: parent.width / 1.25
z: 200
Repeater {
model: settingsStack.tabTitlesModel
TabButton {
id: tabButton
contentItem: IconLabel {
color: theme.textColor
font.bold: tabButton.checked
text: model.title
}
background: Rectangle {
color: tabButton.checked ? theme.backgroundDarkest : theme.backgroundLight
Rectangle {
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
height: tabButton.checked
color: theme.tabBorder
}
Rectangle {
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.right: parent.right
height: !tabButton.checked
color: theme.tabBorder
}
Rectangle {
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.left: parent.left
width: tabButton.checked
color: theme.tabBorder
}
Rectangle {
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.right: parent.right
width: tabButton.checked
color: theme.tabBorder
}
}
Accessible.role: Accessible.Button
Accessible.name: model.title
}
}
}
StackLayout {
id: stackLayout
anchors.top: settingsTabBar.bottom
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
currentIndex: settingsTabBar.currentIndex
Repeater {
model: settingsStack.tabs
delegate: Loader {
id: loader
sourceComponent: model.modelData
onLoaded: {
settingsStack.tabTitlesModel.append({ "title": loader.item.title });
}
}
}
}
}