baobeld/lux-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style tab bar

Browse source
This commit is contained in:
Benjamin Palko 2025-09-16 08:36:07 -04:00
parent f687e17c94
commit 185121d0d7
2 changed files with 22 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
components/StyledTabBar.qml
View file

@ -1,18 +1,23 @@
import QtQuick import QtQuick
import QtQuick.Controls.Basic import QtQuick.Controls
TabBar { TabBar {
id: control id: control
property alias orientation: view.orientation property alias orientation: view.orientation
contentItem: ListView { contentItem: Item {
id: view ListView {
model: control.contentModel id: view
currentIndex: control.currentIndex anchors.centerIn: parent
spacing: control.spacing implicitWidth: parent.width - 20
orientation: ListView.Horizontal implicitHeight: parent.height - 20
boundsBehavior: Flickable.StopAtBounds model: control.contentModel
currentIndex: control.currentIndex
spacing: control.spacing
orientation: ListView.Horizontal
boundsBehavior: Flickable.StopAtBounds
}
} }
background: Item {} background: Item {}

21
components/StyledTabButton.qml
View file

@ -1,6 +1,6 @@
import qs.config import qs.config
import QtQuick import QtQuick
import QtQuick.Controls.Basic import QtQuick.Controls
TabButton { TabButton {
id: control id: control
@ -14,31 +14,28 @@ TabButton {
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
padding: 6 padding: 6
color: control.hovered ? Styling.theme.primarycontent : control.checked ? Styling.theme.accent : Styling.theme.basecontent color: control.hovered ? Styling.theme.primarycontent : Styling.theme.basecontent
Behavior on color { Behavior on color {
ColorAnimation { ColorAnimation {
duration: Styling.animations.speed.normal duration: Styling.animations.speed.normal
} }
} }
rotation: control.rotation
Behavior on rotation {
RotationAnimation {
duration: Styling.animations.speed.slow
easing.type: Easing.OutQuad
}
}
} }
background: Rectangle { background: Rectangle {
id: rectangle id: rectangle
color: control.hovered ? Styling.theme.primary : Styling.theme.base200 color: control.hovered ? Styling.theme.primary : Styling.theme.base100
Behavior on color { Behavior on color {
ColorAnimation { ColorAnimation {
duration: Styling.animations.speed.normal duration: Styling.animations.speed.normal
} }
} }
border.width: 2 opacity: control.checked || control.hovered ? 1.0 : 0.0
border.color: control.checked ? Styling.theme.accent : "transparent" Behavior on opacity {
NumberAnimation {
duration: Styling.animations.speed.normal
}
}
} }
HoverHandler { HoverHandler {