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

Compare commits

base: baobeld:b75a2a12c752162af728bc0cd40a007956881545
Branches Tags
baobeld:main
baobeld:unify-windows
...
compare: baobeld:01f4ecf90f47bb0c4d3c3a9690ee04c0c6f3b7b8
Branches Tags
baobeld:main
baobeld:unify-windows

3 commits
b75a2a12c7 ... 01f4ecf90f

Author SHA1 Message Date
Benjamin Palko
01f4ecf90f styled slider 2025-08-27 11:35:11 -04:00
Benjamin Palko
a3ef488434 styled drawer 2025-08-27 11:16:07 -04:00
Benjamin Palko
41fe72522b styled switch 2025-08-27 09:59:49 -04:00
4 changed files with 186 additions and 6 deletions
Show stats Expand all files Collapse all files

26
components/StyledDrawer.qml Normal file
View file

@ -0,0 +1,26 @@
import qs.config
import QtQuick
import QtQuick.Controls
Drawer {
id: control
dim: false
background: Rectangle {
Component.onCompleted: {
if (control.edge == Qt.TopEdge) {
bottomLeftRadius = 8;
bottomRightRadius = 8;
} else if (control.edge == Qt.LeftEdge) {
topRightRadius = 8;
bottomRightRadius = 8;
} else if (control.edge == Qt.RightEdge) {
topLeftRadius = 8;
bottomLeftRadius = 8;
} else if (control.edge == Qt.BottomEdge) {
topLeftRadius = 8;
topRightRadius = 8;
}
}
color: Theme.palette.base200
}
}

26
components/StyledSlider.qml Normal file
View file

@ -0,0 +1,26 @@
import qs.config
import QtQuick
import QtQuick.Controls
Slider {
id: control
background: Rectangle {
x: control.leftPadding
y: control.topPadding + control.availableHeight / 2 - height / 2
implicitWidth: 200
implicitHeight: 24
width: control.availableWidth
height: implicitHeight
radius: 8
color: Theme.palette.base100
Rectangle {
width: control.visualPosition * parent.width
height: parent.height
color: Theme.palette.primary
radius: 8
}
}
handle: null
}

38
components/StyledSwitch.qml Normal file
View file

@ -0,0 +1,38 @@
import qs.config
import QtQuick
import QtQuick.Controls
Switch {
id: control
indicator: Item {
implicitWidth: 48
implicitHeight: 26
Rectangle {
implicitWidth: parent.width
implicitHeight: parent.height - 4
x: control.leftPadding
y: parent.height / 2 - height / 2
radius: 8
color: control.checked ? Theme.palette.primary : Theme.palette.base100
Behavior on color {
ColorAnimation {
duration: 150
}
}
}
Rectangle {
x: control.checked ? parent.width - 3 * width / 4 : width / 4
y: parent.height / 2 - height / 2
Behavior on x {
NumberAnimation {
duration: 150
}
}
width: 26
height: 26
radius: 8
color: Theme.palette.basecontent
}
}
}

90
modules/storybook/Storybook.qml
View file

@ -26,6 +26,8 @@ StyledWindow {
id: rect
color: Theme.palette.base300
implicitWidth: 800
implicitHeight: 1200
leftMargin: 48
rightMargin: 48
topMargin: 24
@ -41,6 +43,22 @@ StyledWindow {
}
ColumnLayout {
spacing: 12
ColumnLayout {
StyledText {
text: "Switch"
font.pixelSize: 18
}
StyledSwitch {}
}
ColumnLayout {
StyledText {
text: "ToolTip"
font.pixelSize: 18
}
Button {
id: toolTipButton
text: "Hello world!"
@ -50,5 +68,77 @@ StyledWindow {
}
}
}
ColumnLayout {
StyledText {
text: "Slider"
font.pixelSize: 18
}
StyledSlider {
id: slider
from: 0
to: 100
value: 50
}
}
ColumnLayout {
StyledText {
text: "Drawer"
font.pixelSize: 18
}
RowLayout {
Button {
text: "Top"
onClicked: {
drawer.x = root.width / 2 - drawer.width / 2;
drawer.y = 0;
drawer.edge = Qt.TopEdge;
drawer.open();
}
}
Button {
text: "Left"
onClicked: {
drawer.y = root.height / 2 - drawer.height / 2;
drawer.x = 0;
drawer.edge = Qt.LeftEdge;
drawer.open();
}
}
Button {
text: "Right"
onClicked: {
drawer.y = root.height / 2 - drawer.height / 2;
drawer.x = 0;
drawer.edge = Qt.RightEdge;
drawer.open();
}
}
Button {
text: "Bottom"
onClicked: {
drawer.x = root.width / 2 - drawer.width / 2;
drawer.y = 0;
drawer.edge = Qt.BottomEdge;
drawer.open();
}
}
}
}
}
}
StyledDrawer {
id: drawer
edge: Qt.TopEdge
width: 400
height: 200
Button {
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
text: "Close"
onClicked: drawer.close()
}
}
}