Page MenuHomePhorge
Files F85598023

D332.1784601350.diff
No OneTemporary
Actions

Size
5 KB
Referenced Files
None
Subscribers
None

D332.1784601350.diff
View Options

diff --git a/src/CMakeLists.txt b/src/CMakeLists.txt
--- a/src/CMakeLists.txt
+++ b/src/CMakeLists.txt
@@ -225,6 +225,7 @@
SelectableText.qml
ReactToEventPopup.qml
FileHandler.qml
+ media/PlayButton.qml
ActionSettingsPage.qml
CreateRoomPage.qml
diff --git a/src/contents/ui/event-types/Video.qml b/src/contents/ui/event-types/Video.qml
--- a/src/contents/ui/event-types/Video.qml
+++ b/src/contents/ui/event-types/Video.qml
@@ -14,6 +14,7 @@
import '.' as Types
import '..' as Kazv
+import '../media' as M
Simple {
id: upper
@@ -83,43 +84,62 @@
Layout.preferredHeight: width < privWidth ? privHeight / privWidth * width : privHeight
fillMode: VideoOutput.PreserveAspectFit
+ M.PlayButton {
+ id: playButton
+ z: 10
+ anchors.centerIn: parent
+ height: Math.min(video.height, video.width, Kirigami.Units.iconSizes.large)
+ width: Math.min(video.height, video.width, Kirigami.Units.iconSizes.large)
+ states: [
+ State {
+ name: 'shown'
+ when: video.playbackState !== MediaPlayer.PlayingState
+ PropertyChanges {
+ target: playButton
+ visible: true
+ opacity: 1
+ }
+ },
+ State {
+ name: 'hidden'
+ when: video.playbackState === MediaPlayer.PlayingState
+ PropertyChanges {
+ target: playButton
+ opacity: 0
+ visible: false
+ }
+ }
+ ]
+ transitions: [
+ Transition {
+ NumberAnimation {
+ properties: "opacity,visible"
+ duration: Kirigami.Units.shortDuration
+ }
+ }
+ ]
+ onClicked: video.playOrPause();
+ }
+
TapHandler {
onSingleTapped: {
video.playOrPause();
}
}
- Image {
- anchors.fill: parent
- source: thumbnailUri
- visible: video.playbackState == MediaPlayer.StoppedState && hasThumbnail
- fillMode: Image.PreserveAspectFit
- data: [bubble.mediaFileMenu]
- }
-
- Rectangle {
+ Loader {
anchors.fill: parent
- color: Kirigami.Theme.negativeBackgroundColor //Kirigami.ColorUtils.tintWithAlpha(color, Kirigami.Theme.textColor, 0.15)
- visible: {
- video.playbackState == MediaPlayer.StoppedState &&
- ! hasThumbnail
+ property Component thumbnail: Image {
+ source: thumbnailUri
+ fillMode: Image.PreserveAspectFit
+ data: [bubble.mediaFileMenu]
}
- }
-
- Control {
- anchors.centerIn: parent
- height: Math.min(video.height, video.width, Kirigami.Units.iconSizes.large)
- width: Math.min(video.height, video.width, Kirigami.Units.iconSizes.large)
- visible: video.playbackState !== MediaPlayer.PlayingState
- background: Rectangle {
- radius: width / 2
- color: Qt.alpha(Kirigami.Theme.backgroundColor, 0.4)
+ property Component cover: Rectangle {
+ color: Kirigami.Theme.negativeBackgroundColor //Kirigami.ColorUtils.tintWithAlpha(color, Kirigami.Theme.textColor, 0.15)
}
- contentItem: Kirigami.Icon {
- source: /* iconName: */ 'media-playback-start'
- }
+ sourceComponent: (video.playbackState !== MediaPlayer.StoppedState) ? undefined : (upper.hasThumbnail ? thumbnail : cover)
}
function playOrPause() {
diff --git a/src/contents/ui/media/PlayButton.qml b/src/contents/ui/media/PlayButton.qml
new file mode 100644
--- /dev/null
+++ b/src/contents/ui/media/PlayButton.qml
@@ -0,0 +1,52 @@
+/*
+ * This file is part of kazv.
+ * SPDX-FileCopyrightText: 2020-2026 tusooa <tusooa@kazv.moe>
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+import QtQuick.Shapes
+import '..' as Kazv
+
+import org.kde.kirigami as Kirigami
+
+AbstractButton {
+ id: button
+ focusPolicy: Qt.StrongFocus
+
+ background: Kazv.FocusRingBackground {
+ target: button
+ radius: width / 2
+ }
+
+ Rectangle {
+ id: r
+ anchors.centerIn: parent
+ implicitWidth: Kirigami.Units.iconSizes.large
+ implicitHeight: Kirigami.Units.iconSizes.large
+ radius: width / 2
+ color: Qt.alpha(Kirigami.Theme.backgroundColor, 0.4)
+ Shape {
+ /*
+ * Center a triangle inside a circle
+ */
+ id: s
+ property real w: r.width
+ property real t: r.width / 5
+
+ ShapePath {
+ strokeColor: 'transparent'
+ fillColor: Qt.alpha(Kirigami.Theme.textColor, 0.8)
+ PathPolyline {
+ path: [
+ Qt.point(s.w/2 - s.t/Math.sqrt(3), s.w/2 - s.t),
+ Qt.point(s.w/2 - s.t/Math.sqrt(3), s.w/2 + s.t),
+ Qt.point((Math.sqrt(3) - 1 / Math.sqrt(3))*s.t + s.w/2, s.w/2),
+ ]
+ }
+ }
+ }
+ }
+}

File Metadata

Mime Type
text/plain
Expires
Mon, Jul 20, 7:35 PM (5 h, 42 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1697504
Default Alt Text
D332.1784601350.diff (5 KB)

Event Timeline