Jack.Le
9f8c6e1a4c
- Updated to include new files for the project. - Modified to improve layout and navigation, including new properties for tab and action management. - Introduced for file selection with metadata editing capabilities. - Created for managing application settings and integrating the file selection dialog.
205 lines
8.2 KiB
QML
205 lines
8.2 KiB
QML
import QtQuick
|
|
import QtQuick.Controls
|
|
import QtQuick.Layouts
|
|
import ISC
|
|
|
|
// ===== Home Workspace Shell =====
|
|
Rectangle {
|
|
id: root
|
|
anchors.fill: parent
|
|
color: Theme.pageBackground
|
|
clip: true
|
|
border.color: Theme.outerFrameBorder
|
|
border.width: Theme.borderStrong
|
|
|
|
// ===== Navigation Model =====
|
|
// Primary navigation shown in the left rail.
|
|
property var sideActions: ["DETECT WAFER", "READ MEMORY", "OPEN CSV IN EXCEL", "ERASE MEMORY", "IMPORT DATA", "STORED DATA"]
|
|
|
|
// ===== Footer Tab Model =====
|
|
// Footer tabs drive the active workspace section.
|
|
property var bottomTabs: ["Status", "Graph", "Data", "Wafer Map", "Compare", "Split", "Settings", "About"]
|
|
|
|
// ===== View State =====
|
|
property int selectedTabIndex: 0
|
|
property int selectedSideActionIndex: 0
|
|
|
|
// ===== Main Two-Column Layout =====
|
|
RowLayout {
|
|
anchors.fill: parent
|
|
spacing: 0
|
|
|
|
// ===== Left Action Rail =====
|
|
// Left control rail.
|
|
Rectangle {
|
|
id: sideRail
|
|
Layout.preferredWidth: Theme.sideRailWidth
|
|
Layout.fillHeight: true
|
|
color: Theme.sideRailBackground
|
|
border.color: Theme.workspaceBorder
|
|
border.width: Theme.borderThin
|
|
|
|
readonly property int actionCount: root.sideActions.length
|
|
readonly property real computedButtonHeight: Math.min(Theme.sideButtonHeight, (height - (Theme.panelPadding * 2) - (Theme.sideRailSpacing * Math.max(0, actionCount - 1))) / Math.max(1, actionCount))
|
|
|
|
ColumnLayout {
|
|
anchors.fill: parent
|
|
anchors.margins: Theme.panelPadding
|
|
spacing: Theme.sideRailSpacing
|
|
|
|
Repeater {
|
|
model: root.sideActions
|
|
|
|
Button {
|
|
id: control
|
|
text: modelData
|
|
property bool isActive: index === root.selectedSideActionIndex
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: Math.max(Theme.sideButtonMinHeight, sideRail.computedButtonHeight)
|
|
hoverEnabled: true
|
|
onClicked: root.selectedSideActionIndex = index
|
|
|
|
background: Rectangle {
|
|
color: {
|
|
if (control.down) {
|
|
return Theme.buttonPressed;
|
|
}
|
|
if (control.isActive) {
|
|
return Theme.sideActiveBackground;
|
|
}
|
|
return "transparent";
|
|
}
|
|
border.color: control.isActive ? Theme.cardBorder : "transparent"
|
|
border.width: 1
|
|
radius: Theme.radiusSm
|
|
|
|
Rectangle {
|
|
anchors.left: parent.left
|
|
anchors.top: parent.top
|
|
anchors.bottom: parent.bottom
|
|
width: 3
|
|
visible: control.isActive
|
|
color: Theme.primaryAccent
|
|
radius: Theme.radiusXs
|
|
}
|
|
}
|
|
|
|
contentItem: Text {
|
|
text: control.text
|
|
color: control.isActive ? Theme.headingColor : Theme.bodyColor
|
|
font.bold: control.isActive
|
|
font.pixelSize: 18
|
|
wrapMode: Text.WordWrap
|
|
horizontalAlignment: Text.AlignHCenter
|
|
verticalAlignment: Text.AlignVCenter
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Main workspace and footer navigation.
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.fillHeight: true
|
|
color: Theme.workspaceBackground
|
|
border.color: Theme.workspaceBorder
|
|
border.width: Theme.borderThin
|
|
|
|
ColumnLayout {
|
|
anchors.fill: parent
|
|
anchors.margins: Theme.mainAreaPadding
|
|
spacing: Theme.rightPaneGap
|
|
|
|
// ===== Active Tab Content Area =====
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.fillHeight: true
|
|
Layout.minimumHeight: 220
|
|
color: Theme.responseBackground
|
|
border.color: Theme.responseBorder
|
|
border.width: 1
|
|
radius: Theme.radiusMd
|
|
|
|
StackLayout {
|
|
anchors.fill: parent
|
|
currentIndex: root.selectedTabIndex
|
|
|
|
// ===== Tab Content Routing =====
|
|
Repeater {
|
|
model: root.bottomTabs
|
|
|
|
Item {
|
|
property string tabName: modelData
|
|
|
|
Loader {
|
|
anchors.fill: parent
|
|
active: parent.tabName === "Settings"
|
|
source: parent.tabName === "Settings" ? "Tabs/SettingsTab.qml" : ""
|
|
}
|
|
|
|
Label {
|
|
anchors.centerIn: parent
|
|
visible: parent.tabName !== "Settings"
|
|
text: parent.tabName + " content"
|
|
color: Theme.bodyColor
|
|
font.pixelSize: 20
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Keep the tab strip evenly distributed across the footer.
|
|
// ===== Footer Tab Strip =====
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: Theme.tabBarHeight + (Theme.tabBarPadding * 2)
|
|
color: Theme.tabBarBackground
|
|
border.color: Theme.workspaceBorder
|
|
border.width: Theme.borderThin
|
|
|
|
RowLayout {
|
|
anchors.fill: parent
|
|
anchors.margins: Theme.tabBarPadding
|
|
spacing: Theme.tabSpacing
|
|
|
|
Repeater {
|
|
model: root.bottomTabs
|
|
|
|
Button {
|
|
id: botTabBtn
|
|
property bool isActive: index === root.selectedTabIndex
|
|
|
|
text: modelData
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: Theme.tabBarHeight
|
|
Layout.minimumWidth: Theme.tabButtonMinWidth
|
|
onClicked: root.selectedTabIndex = index
|
|
hoverEnabled: true
|
|
|
|
background: Rectangle {
|
|
color: botTabBtn.isActive ? Theme.tabActiveBackground : (botTabBtn.hovered ? Theme.tabHoverBackground : Theme.tabBackground)
|
|
border.color: Theme.tabBorder
|
|
border.width: 1
|
|
radius: Theme.tabRadius
|
|
}
|
|
|
|
contentItem: Text {
|
|
text: botTabBtn.text
|
|
color: botTabBtn.isActive ? Theme.tabActiveText : Theme.tabText
|
|
font.pixelSize: Theme.tabFontSize
|
|
font.bold: botTabBtn.isActive
|
|
horizontalAlignment: Text.AlignHCenter
|
|
verticalAlignment: Text.AlignVCenter
|
|
elide: Text.ElideRight
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|