refractor navrail tab array

This commit is contained in:
end-4
2025-06-19 00:36:37 +02:00
parent 9f4c75a75c
commit 3f294416ea
2 changed files with 58 additions and 42 deletions
@@ -0,0 +1,44 @@
import "root:/modules/common"
import "root:/modules/common/widgets"
import "root:/modules/common/functions/color_utils.js" as ColorUtils
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Quickshell.Io
Item {
id: root
property int currentIndex: 0
property bool expanded: false
default property alias data: tabBarColumn.data
implicitHeight: tabBarColumn.implicitHeight
implicitWidth: tabBarColumn.implicitWidth
Layout.topMargin: 25
Rectangle {
property real itemHeight: tabBarColumn.children[0].baseSize
property real baseHighlightHeight: tabBarColumn.children[0].baseHighlightHeight
anchors {
top: tabBarColumn.top
left: tabBarColumn.left
topMargin: itemHeight * root.currentIndex + (root.expanded ? 0 : ((itemHeight - baseHighlightHeight) / 2))
}
radius: Appearance.rounding.full
color: Appearance.colors.colSecondaryContainer
implicitHeight: root.expanded ? itemHeight : baseHighlightHeight
implicitWidth: tabBarColumn.children[root.currentIndex].visualWidth
Behavior on anchors.topMargin {
NumberAnimation {
duration: Appearance.animationCurves.expressiveFastSpatialDuration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animationCurves.expressiveFastSpatial
}
}
}
ColumnLayout {
id: tabBarColumn
anchors.fill: parent
spacing: 0
}
}
+14 -42
View File
@@ -142,48 +142,20 @@ ApplicationWindow {
}
}
Item {
implicitHeight: tabBarColumn.implicitHeight
implicitWidth: tabBarColumn.implicitWidth
Layout.topMargin: 25
Rectangle {
property real itemHeight: tabBarColumn.children[0].baseSize
property real baseHighlightHeight: tabBarColumn.children[0].baseHighlightHeight
anchors {
top: tabBarColumn.top
left: tabBarColumn.left
topMargin: itemHeight * root.currentPage + (navRail.expanded ? 0 : ((itemHeight - baseHighlightHeight) / 2))
}
radius: Appearance.rounding.full
color: Appearance.colors.colSecondaryContainer
implicitHeight: navRail.expanded ? itemHeight : baseHighlightHeight
implicitWidth: tabBarColumn.children[root.currentPage].visualWidth
Behavior on anchors.topMargin {
NumberAnimation {
duration: Appearance.animationCurves.expressiveFastSpatialDuration
easing.type: Appearance.animation.elementMove.type
easing.bezierCurve: Appearance.animationCurves.expressiveFastSpatial
}
}
}
ColumnLayout {
id: tabBarColumn
anchors.fill: parent
spacing: 0
Repeater {
model: root.pages
NavigationRailButton {
required property var index
required property var modelData
toggled: root.currentPage === index
onClicked: root.currentPage = index;
expanded: navRail.expanded
buttonIcon: modelData.icon
buttonText: modelData.name
showToggledHighlight: false
}
NavigationRailTabArray {
currentIndex: root.currentPage
expanded: navRail.expanded
Repeater {
model: root.pages
NavigationRailButton {
required property var index
required property var modelData
toggled: root.currentPage === index
onClicked: root.currentPage = index;
expanded: navRail.expanded
buttonIcon: modelData.icon
buttonText: modelData.name
showToggledHighlight: false
}
}
}