contents/ui/VolumeSlider.qml

0001 /*
0002     SPDX-FileCopyrightText: 2014-2015 Harald Sitter <sitter@kde.org>
0003     SPDX-FileCopyrightText: 2019 Sefa Eyeoglu <contact@scrumplex.net>
0004     SPDX-FileCopyrightText: 2022 ivan (@ratijas) tkachenko <me@ratijas.tk>
0005
0006     SPDX-License-Identifier: GPL-2.0-only OR GPL-3.0-only OR LicenseRef-KDE-Accepted-GPL
0007 */
0008 import QtQuick 2.15
0009 import QtQuick.Layouts 1.15
0010
0011 import org.kde.kquickcontrolsaddons 2.0
0012 import org.kde.plasma.components 3.0 as PC3
0013 import org.kde.plasma.core 2.1 as PlasmaCore
0014 import org.kde.plasma.private.volume 0.1
0015
0016 // Audio volume slider. Value represents desired volume level in
0017 // device-specific units, while volume property reports current volume level
0018 // normalized to 0..1 range.
0019 PC3.Slider {
0020     id: control
0021
0022     property VolumeObject volumeObject
0023
0024     // When muted, the whole slider will appear slightly faded, but remain
0025     // functional and interactive.
0026     property bool muted: false
0027
0028     // Current (monitored) volume. To be animated. Do not update too fast
0029     // (i.e. faster or close to screen refresh rate), otherwise it won't
0030     // animate smoothly.
0031     property real volume: meter.volume
0032
0033     VolumeMonitor {
0034         id: meter
0035         target: control.visible ? control.volumeObject : null
0036     }
0037
0038     Behavior on volume {
0039         NumberAnimation  {
0040             id: animate
0041             duration: PlasmaCore.Units.shortDuration
0042             easing.type: Easing.OutQuad
0043         }
0044     }
0045
0046     // When a maximum volume limit is raised/lower, animate the change.
0047     Behavior on to {
0048         NumberAnimation {
0049             duration: PlasmaCore.Units.shortDuration
0050             easing.type: Easing.InOutQuad
0051         }
0052     }
0053
0054     opacity: muted ? 0.5 : 1
0055     // Prevents the groove from showing through the handle
0056     layer.enabled: opacity < 1
0057
0058     background: PlasmaCore.FrameSvgItem {
0059         imagePath: "widgets/slider"
0060         prefix: "groove"
0061         colorGroup: PlasmaCore.ColorScope.colorGroup
0062
0063         implicitWidth: control.horizontal ? PlasmaCore.Units.gridUnit * 12 : fixedMargins.left + fixedMargins.right
0064         implicitHeight: control.vertical ? PlasmaCore.Units.gridUnit * 12 : fixedMargins.top + fixedMargins.bottom
0065
0066         width: control.horizontal ? Math.max(fixedMargins.left + fixedMargins.right, control.availableWidth) : implicitWidth
0067         height: control.vertical ? Math.max(fixedMargins.top + fixedMargins.bottom, control.availableHeight) : implicitHeight
0068
0069         x: control.leftPadding + (control.horizontal ? 0 : Math.round((control.availableWidth - width) / 2))
0070         y: control.topPadding + (control.vertical ? 0 : Math.round((control.availableHeight - height) / 2))
0071
0072         PlasmaCore.FrameSvgItem {
0073             imagePath: "widgets/slider"
0074             prefix: "groove-highlight"
0075             colorGroup: PlasmaCore.ColorScope.colorGroup
0076
0077             anchors.left: parent.left
0078             anchors.bottom: parent.bottom
0079             LayoutMirroring.enabled: control.mirrored
0080
0081             width: control.horizontal ? Math.max(fixedMargins.left + fixedMargins.right, Math.round(control.position * (control.availableWidth - control.handle.width / 2) + (control.handle.width / 2))) : parent.width
0082             height: control.vertical ? Math.max(fixedMargins.top + fixedMargins.bottom, Math.round(control.position * (control.availableHeight - control.handle.height / 2) + (control.handle.height / 2))) : parent.height
0083         }
0084
0085         PlasmaCore.FrameSvgItem {
0086             imagePath: "widgets/slider"
0087             prefix: "groove-highlight"
0088             status: PlasmaCore.FrameSvgItem.Selected
0089             visible: meter.available && control.volume > 0
0090
0091             anchors.left: parent.left
0092             anchors.bottom: parent.bottom
0093             LayoutMirroring.enabled: control.mirrored
0094
0095             width: control.horizontal ? Math.max(fixedMargins.left + fixedMargins.right, Math.round(control.volume * control.position * control.availableWidth)) : parent.width
0096             height: control.vertical ? Math.max(fixedMargins.top + fixedMargins.bottom, Math.round(control.volume * control.position * control.availableHeight)) : parent.height
0097         }
0098     }
0099 }