forked from Shinonome/dots-hyprland
end-4
61 lines
2.4 KiB
QML
61 lines
2.4 KiB
QML
import "root:/modules/common/"
|
|
import QtQuick
|
|
import QtQuick.Layouts
|
|
import QtQuick.Controls
|
|
import Qt5Compat.GraphicalEffects
|
|
|
|
/**
|
|
* Material 3 switch. See https://m3.material.io/components/switch/overview
|
|
*/
|
|
Switch {
|
|
id: root
|
|
property real scale: 0.6 // Default in m3 spec is huge af
|
|
implicitHeight: 32 * root.scale
|
|
implicitWidth: 52 * root.scale
|
|
property color activeColor: Appearance?.colors.colPrimary ?? "#685496"
|
|
property color inactiveColor: Appearance?.colors.colSurfaceContainerHighest ?? "#45464F"
|
|
|
|
PointingHandInteraction {}
|
|
|
|
// Custom track styling
|
|
background: Rectangle {
|
|
width: parent.width
|
|
height: parent.height
|
|
radius: Appearance?.rounding.full ?? 9999
|
|
color: root.checked ? root.activeColor : root.inactiveColor
|
|
border.width: 2 * root.scale
|
|
border.color: root.checked ? root.activeColor : Appearance.m3colors.m3outline
|
|
|
|
Behavior on color {
|
|
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
|
|
}
|
|
Behavior on border.color {
|
|
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
|
|
}
|
|
}
|
|
|
|
// Custom thumb styling
|
|
indicator: Rectangle {
|
|
width: (root.pressed || root.down) ? (28 * root.scale) : root.checked ? (24 * root.scale) : (16 * root.scale)
|
|
height: (root.pressed || root.down) ? (28 * root.scale) : root.checked ? (24 * root.scale) : (16 * root.scale)
|
|
radius: Appearance.rounding.full
|
|
color: root.checked ? Appearance.m3colors.m3onPrimary : Appearance.m3colors.m3outline
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: root.checked ? ((root.pressed || root.down) ? (22 * root.scale) : 24 * root.scale) : ((root.pressed || root.down) ? (2 * root.scale) : 8 * root.scale)
|
|
|
|
Behavior on anchors.leftMargin {
|
|
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
|
|
}
|
|
Behavior on width {
|
|
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
|
|
}
|
|
Behavior on height {
|
|
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
|
|
}
|
|
Behavior on color {
|
|
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
|
|
}
|
|
}
|
|
}
|