src/qml/SoundPlayer.qml

0001 // SPDX-FileCopyrightText: 2023 Carl Schwan <carl@carlschwan.eu>
0002 // SPDX-License-Identifier: LGPL-2.0-or-later
0003
0004 import QtMultimedia
0005 import QtQuick
0006 import QtQuick.Layouts
0007 import QtQuick.Controls as QQC2
0008 import org.kde.kirigami as Kirigami
0009 import org.kde.kwordquiz
0010
0011 QQC2.AbstractButton {
0012     id: root
0013
0014     property alias source: audio.source
0015
0016     function play() {
0017         audio.play();
0018     }
0019
0020     onClicked: if (audio.playbackState === MediaPlayer.PlayingState) {
0021         audio.pause();
0022     } else {
0023         audio.play();
0024     }
0025
0026     leftPadding: Kirigami.Units.largeSpacing
0027     rightPadding: Kirigami.Units.largeSpacing
0028
0029     MediaPlayer {
0030         id: audio
0031         source: root.progressInfo.localPath
0032         audioOutput: AudioOutput {}
0033     }
0034
0035     contentItem: RowLayout {
0036         Kirigami.Icon {
0037             source: audio.playbackState === MediaPlayer.PlayingState ? "media-playback-pause" : "media-playback-start"
0038             Layout.preferredWidth: Kirigami.Units.iconSizes.medium
0039             Layout.preferredHeight: Kirigami.Units.iconSizes.medium
0040         }
0041
0042         QQC2.Slider {
0043             Layout.fillWidth: true
0044             from: 0.0
0045             to: 1.0
0046             enabled: audio.seekable
0047             value: audio.position / audio.duration
0048             onMoved: audio.setPosition(value * audio.duration)
0049         }
0050     }
0051
0052     background: Item {
0053         Kirigami.ShadowedRectangle {
0054             id: bubbleBackground
0055             anchors.fill: parent
0056             Kirigami.Theme.colorSet: Kirigami.Theme.View
0057             Kirigami.Theme.inherit: false
0058             color: {
0059                 if (root.hovered) {
0060                     return Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.backgroundColor, Kirigami.Theme.highlightColor, 0.15)
0061                 } else {
0062                     return Kirigami.Theme.backgroundColor
0063                 }
0064             }
0065             radius: Kirigami.Units.largeSpacing
0066             shadow {
0067                 size: Kirigami.Units.smallSpacing
0068                 color: Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.10)
0069             }
0070
0071             Behavior on color {
0072                 ColorAnimation {target: bubbleBackground; duration: Kirigami.Units.veryLongDuration; easing.type: Easing.InOutCubic}
0073             }
0074         }
0075     }
0076 }