2023-06-29 17:38:10 +00:00
|
|
|
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: [ ]
|
|
|
|
|
2023-06-30 13:50:09 +00:00
|
|
|
Canvas {
|
|
|
|
id: canvas
|
|
|
|
anchors.fill: parent
|
|
|
|
contextType: "2d"
|
|
|
|
onPaint: {
|
|
|
|
var context = getContext("2d");
|
|
|
|
context.reset();
|
|
|
|
context.lineWidth = 2;
|
|
|
|
context.moveTo(stackLayout.x, stackLayout.y);
|
|
|
|
context.lineTo(stackLayout.x, stackLayout.y + stackLayout.height);
|
|
|
|
context.lineTo(stackLayout.x + stackLayout.width, stackLayout.y + stackLayout.height);
|
|
|
|
context.lineTo(stackLayout.x + stackLayout.width, stackLayout.y);
|
|
|
|
context.lineTo(/*settingsTabBar.currentItem.x + */settingsTabBar.currentItem.width, stackLayout.y);
|
|
|
|
context.strokeStyle = theme.tabBorder;
|
|
|
|
context.stroke();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-06-29 17:38:10 +00:00
|
|
|
TabBar {
|
|
|
|
id: settingsTabBar
|
|
|
|
width: parent.width / 1.25
|
|
|
|
z: 200
|
2023-06-30 13:50:09 +00:00
|
|
|
visible: tabTitlesModel.count > 1
|
2023-06-29 17:38:10 +00:00
|
|
|
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
|
2023-06-30 13:50:09 +00:00
|
|
|
// 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
|
|
|
|
// }
|
2023-06-29 17:38:10 +00:00
|
|
|
}
|
|
|
|
Accessible.role: Accessible.Button
|
|
|
|
Accessible.name: model.title
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
StackLayout {
|
|
|
|
id: stackLayout
|
2023-06-30 13:50:09 +00:00
|
|
|
anchors.top: tabTitlesModel.count > 1 ? settingsTabBar.bottom : parent.top
|
2023-06-29 17:38:10 +00:00
|
|
|
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 });
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|