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

NSlide: improved id handling

Browse source
This commit is contained in:
quadbyte 2025-08-09 15:44:03 -04:00
parent 43eacb7e67
commit 4a4564fe5f
1 changed files with 11 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

23
Widgets/NSlider.qml
View file

@ -5,7 +5,7 @@ import qs.Services
import qs.Theme import qs.Theme
Slider { Slider {
id: slider id: root
readonly property real scaling: Scaling.scale(screen) readonly property real scaling: Scaling.scale(screen)
readonly property real knobDiameter: Style.baseWidgetHeight * 0.75 * scaling readonly property real knobDiameter: Style.baseWidgetHeight * 0.75 * scaling
@ -21,18 +21,18 @@ Slider {
implicitHeight: Math.max(trackHeight, knobDiameter) implicitHeight: Math.max(trackHeight, knobDiameter)
background: Rectangle { background: Rectangle {
x: slider.leftPadding x: root.leftPadding
y: slider.topPadding + slider.availableHeight / 2 - height / 2 y: root.topPadding + root.availableHeight / 2 - height / 2
implicitWidth: Style.sliderWidth implicitWidth: Style.sliderWidth
implicitHeight: trackHeight implicitHeight: trackHeight
width: slider.availableWidth width: root.availableWidth
height: implicitHeight height: implicitHeight
radius: height / 2 radius: height / 2
color: Theme.surfaceVariant color: Theme.surfaceVariant
Rectangle { Rectangle {
id: activeTrack id: activeTrack
width: slider.visualPosition * parent.width width: root.visualPosition * parent.width
height: parent.height height: parent.height
color: Theme.accentPrimary color: Theme.accentPrimary
radius: parent.radius radius: parent.radius
@ -52,21 +52,20 @@ Slider {
width: knobDiameter + cutoutExtra width: knobDiameter + cutoutExtra
height: knobDiameter + cutoutExtra height: knobDiameter + cutoutExtra
radius: width / 2 radius: width / 2
color: slider.cutoutColor !== undefined ? slider.cutoutColor : Theme.backgroundPrimary color: root.cutoutColor !== undefined ? root.cutoutColor : Theme.backgroundPrimary
x: Math.max( x: Math.max(
0, Math.min( 0, Math.min(
parent.width - width, parent.width - width,
slider.visualPosition * (parent.width - slider.knobDiameter) - cutoutExtra / 2)) root.visualPosition * (parent.width - root.knobDiameter) - cutoutExtra / 2))
y: (parent.height - height) / 2 y: (parent.height - height) / 2
} }
} }
handle: Item { handle: Item {
id: handleRoot
width: knob.implicitWidth width: knob.implicitWidth
height: knob.implicitHeight height: knob.implicitHeight
x: slider.leftPadding + slider.visualPosition * (slider.availableWidth - width) x: root.leftPadding + root.visualPosition * (root.availableWidth - width)
y: slider.topPadding + slider.availableHeight / 2 - height / 2 y: root.topPadding + root.availableHeight / 2 - height / 2
// Subtle shadow for a more polished look (keeps theme colors) // Subtle shadow for a more polished look (keeps theme colors)
MultiEffect { MultiEffect {
@ -85,7 +84,7 @@ Slider {
implicitWidth: knobDiameter implicitWidth: knobDiameter
implicitHeight: knobDiameter implicitHeight: knobDiameter
radius: width * 0.5 radius: width * 0.5
color: slider.pressed ? Theme.surfaceVariant : Theme.surface color: root.pressed ? Theme.surfaceVariant : Theme.surface
border.color: Theme.accentPrimary border.color: Theme.accentPrimary
border.width: Math.max(1, 2 * scaling) border.width: Math.max(1, 2 * scaling)
// Press feedback halo (using accent color, low opacity) // Press feedback halo (using accent color, low opacity)
@ -95,7 +94,7 @@ Slider {
height: parent.height + 8 * scaling height: parent.height + 8 * scaling
radius: width / 2 radius: width / 2
color: Theme.accentPrimary color: Theme.accentPrimary
opacity: slider.pressed ? 0.16 : 0.0 opacity: root.pressed ? 0.16 : 0.0
} }
} }
} }