mirror of
https://github.com/AvengeMedia/DankMaterialShell.git
synced 2026-01-24 21:42:51 -05:00
make the volume knob in media player consistent
This commit is contained in:
bbedward
@@ -1056,7 +1056,8 @@ Item {
|
||||
}
|
||||
}
|
||||
onWheel: wheelEvent => {
|
||||
adjustVolume(wheelEvent.angleDelta.y > 0 ? 3 : -3)
|
||||
const step = Math.max(0.5, 100 / 100)
|
||||
adjustVolume(wheelEvent.angleDelta.y > 0 ? step : -step)
|
||||
volumeButton.volumeExpanded = true
|
||||
wheelEvent.accepted = true
|
||||
}
|
||||
@@ -1093,31 +1094,115 @@ Item {
|
||||
anchors.margins: Theme.spacingS
|
||||
|
||||
Item {
|
||||
width: parent.width * 0.6
|
||||
height: parent.height - Theme.spacingXL * 2
|
||||
id: volumeSlider
|
||||
width: parent.width * 0.5
|
||||
height: parent.height - Theme.spacingXL * 2
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: Theme.spacingS
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
|
||||
property bool dragging: false
|
||||
property bool containsMouse: volumeSliderArea.containsMouse
|
||||
|
||||
property bool active: volumeSliderArea.containsMouse || volumeSliderArea.pressed || dragging
|
||||
|
||||
function withAlpha(c, a) { return Qt.rgba(c.r, c.g, c.b, a) }
|
||||
|
||||
Rectangle {
|
||||
id: sliderTrack
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
anchors.centerIn: parent
|
||||
color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.5)
|
||||
radius: width / 2
|
||||
radius: Theme.cornerRadius
|
||||
}
|
||||
|
||||
|
||||
Rectangle {
|
||||
id: sliderFill
|
||||
width: parent.width
|
||||
height: defaultSink ? (Math.min(1.0, defaultSink.audio.volume) * parent.height) : 0
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.primary
|
||||
radius: width / 2
|
||||
bottomLeftRadius: Theme.cornerRadius
|
||||
bottomRightRadius: Theme.cornerRadius
|
||||
topLeftRadius: 0
|
||||
topRightRadius: 0
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: sliderHandle
|
||||
width: parent.width + 8
|
||||
height: 8
|
||||
radius: Theme.cornerRadius
|
||||
y: {
|
||||
const ratio = defaultSink ? Math.min(1.0, defaultSink.audio.volume) : 0
|
||||
const travel = parent.height - height
|
||||
return Math.max(0, Math.min(travel, travel * (1 - ratio)))
|
||||
}
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
color: Theme.primary
|
||||
border.width: 3
|
||||
border.color: Qt.rgba(Theme.surfaceContainer.r, Theme.surfaceContainer.g, Theme.surfaceContainer.b, 1.0)
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
radius: Theme.cornerRadius
|
||||
color: Theme.onPrimary
|
||||
opacity: volumeSliderArea.pressed ? 0.16 : (volumeSliderArea.containsMouse ? 0.08 : 0)
|
||||
visible: opacity > 0
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: ripple
|
||||
anchors.centerIn: parent
|
||||
width: 0
|
||||
height: 0
|
||||
radius: width / 2
|
||||
color: Theme.onPrimary
|
||||
opacity: 0
|
||||
|
||||
function start() {
|
||||
opacity = 0.16
|
||||
width = 0
|
||||
height = 0
|
||||
rippleAnimation.start()
|
||||
}
|
||||
|
||||
SequentialAnimation {
|
||||
id: rippleAnimation
|
||||
NumberAnimation {
|
||||
target: ripple
|
||||
properties: "width,height"
|
||||
to: 28
|
||||
duration: 180
|
||||
}
|
||||
NumberAnimation {
|
||||
target: ripple
|
||||
property: "opacity"
|
||||
to: 0
|
||||
duration: 150
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
TapHandler {
|
||||
acceptedButtons: Qt.LeftButton
|
||||
onPressedChanged: {
|
||||
if (pressed) {
|
||||
ripple.start()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
scale: active ? 1.05 : 1.0
|
||||
|
||||
Behavior on scale {
|
||||
NumberAnimation {
|
||||
duration: Anims.durShort
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Anims.standard
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
@@ -1126,6 +1211,7 @@ Item {
|
||||
anchors.margins: -12
|
||||
enabled: defaultSink !== null
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
preventStealing: true
|
||||
|
||||
onEntered: {
|
||||
@@ -1155,7 +1241,11 @@ Item {
|
||||
updateVolume(mouse)
|
||||
}
|
||||
|
||||
onWheel: wheel => adjustVolume(wheel.angleDelta.y > 0 ? 3 : -3)
|
||||
onWheel: wheelEvent => {
|
||||
const step = Math.max(0.5, 100 / 100)
|
||||
adjustVolume(wheelEvent.angleDelta.y > 0 ? step : -step)
|
||||
wheelEvent.accepted = true
|
||||
}
|
||||
|
||||
function updateVolume(mouse) {
|
||||
if (defaultSink) {
|
||||
|
||||
@@ -687,7 +687,7 @@ Item {
|
||||
}
|
||||
|
||||
StyledText {
|
||||
text: "Transparency Settings"
|
||||
text: "Widget Styling"
|
||||
font.pixelSize: Theme.fontSizeLarge
|
||||
font.weight: Font.Medium
|
||||
color: Theme.surfaceText
|
||||
@@ -818,6 +818,40 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
width: parent.width
|
||||
height: 1
|
||||
color: Theme.outline
|
||||
opacity: 0.2
|
||||
}
|
||||
|
||||
Column {
|
||||
width: parent.width
|
||||
spacing: Theme.spacingS
|
||||
|
||||
StyledText {
|
||||
text: "Corner Radius (0 = square corners)"
|
||||
font.pixelSize: Theme.fontSizeSmall
|
||||
color: Theme.surfaceText
|
||||
font.weight: Font.Medium
|
||||
}
|
||||
|
||||
DankSlider {
|
||||
width: parent.width
|
||||
height: 24
|
||||
value: SettingsData.cornerRadius
|
||||
minimum: 0
|
||||
maximum: 32
|
||||
unit: ""
|
||||
showValue: true
|
||||
wheelEnabled: false
|
||||
onSliderValueChanged: newValue => {
|
||||
SettingsData.setCornerRadius(
|
||||
newValue)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -821,33 +821,6 @@ Item {
|
||||
}
|
||||
}
|
||||
|
||||
Column {
|
||||
width: parent.width
|
||||
spacing: Theme.spacingS
|
||||
|
||||
StyledText {
|
||||
text: "Corner Radius (0 = square corners)"
|
||||
font.pixelSize: Theme.fontSizeSmall
|
||||
color: Theme.surfaceText
|
||||
font.weight: Font.Medium
|
||||
}
|
||||
|
||||
DankSlider {
|
||||
width: parent.width
|
||||
height: 24
|
||||
value: SettingsData.cornerRadius
|
||||
minimum: 0
|
||||
maximum: 32
|
||||
unit: ""
|
||||
showValue: true
|
||||
wheelEnabled: false
|
||||
thumbOutlineColor: Theme.surfaceContainer
|
||||
onSliderValueChanged: newValue => {
|
||||
SettingsData.setCornerRadius(
|
||||
newValue)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
DankToggle {
|
||||
width: parent.width
|
||||
|
||||
Reference in New Issue
Block a user