[vlc-commits] [Git][videolan/vlc][master] 7 commits: qml: add `effectiveRadius` property to `RoundImage.qml`

[Felix Paul Kühne (@fkuehne)]

Felix Paul Kühne pushed to branch master at VideoLAN / VLC


Commits:
3e6970f3 by Fatih Uzunoglu at 2024-12-16T17:35:54+00:00
qml: add `effectiveRadius` property to `RoundImage.qml`

Rounding is done within the shader now. Since shaders
are only supported with RHI now, there is no rounding
when RHI is not used. In that case, we can represent
the effective radius with a read-only `effectiveRadius`
property which would be 0 with non-RHI (software or
openvg mode) cases.

- - - - -
7309f3c1 by Fatih Uzunoglu at 2024-12-16T17:35:54+00:00
qml: add `effectiveRadius` property to `MediaCover.qml`

- - - - -
99caa2db by Fatih Uzunoglu at 2024-12-16T17:35:54+00:00
qml: use `effectiveRadius` if available instead of `radius` in `DoubleShadow.qml`

- - - - -
aaf143de by Fatih Uzunoglu at 2024-12-16T17:35:54+00:00
qml: use `effectiveRadius` if available instead of `radius` in `DropShadowImage.qml`

- - - - -
ca70ae1d by Fatih Uzunoglu at 2024-12-16T17:35:54+00:00
qml: use effective radius in `MediaCover.qml` background

- - - - -
2f62e6f6 by Fatih Uzunoglu at 2024-12-16T17:35:54+00:00
qml: use `effectiveRadius` in ArtistTopBanner image background

- - - - -
ec2645d1 by Fatih Uzunoglu at 2024-12-16T17:35:54+00:00
qml: use `effectiveRadius` in MusicArtistDelegate image background

- - - - -


6 changed files:

- modules/gui/qt/medialibrary/qml/ArtistTopBanner.qml
- modules/gui/qt/medialibrary/qml/MusicArtistDelegate.qml
- modules/gui/qt/widgets/qml/DoubleShadow.qml
- modules/gui/qt/widgets/qml/DropShadowImage.qml
- modules/gui/qt/widgets/qml/MediaCover.qml
- modules/gui/qt/widgets/qml/RoundImage.qml


Changes:

=====================================
modules/gui/qt/medialibrary/qml/ArtistTopBanner.qml
=====================================
@@ -102,6 +102,7 @@ FocusScope {
             implicitWidth: VLCStyle.cover_normal
 
             Widgets.RoundImage {
+                id: roundImage
                 source: artist.cover || VLCStyle.noArtArtist
                 sourceSize.width: width * Screen.devicePixelRatio
                 sourceSize.height: height * Screen.devicePixelRatio
@@ -111,7 +112,7 @@ FocusScope {
 
             Rectangle {
                 anchors.fill: parent
-                radius: VLCStyle.cover_normal
+                radius: roundImage.effectiveRadius
                 color: "transparent"
                 border.width: VLCStyle.dp(1, VLCStyle.scale)
                 border.color: theme.border


=====================================
modules/gui/qt/medialibrary/qml/MusicArtistDelegate.qml
=====================================
@@ -159,6 +159,8 @@ T.ItemDelegate {
         spacing: VLCStyle.margin_xsmall
 
         Widgets.RoundImage {
+            id: roundImage
+
             Layout.preferredHeight: VLCStyle.play_cover_small
             Layout.fillHeight: true
             Layout.preferredWidth: height
@@ -178,7 +180,7 @@ T.ItemDelegate {
                 anchors.margins: -border.width
                 z: -1
 
-                radius: VLCStyle.play_cover_small
+                radius: roundImage.effectiveRadius
 
                 color: "transparent"
 


=====================================
modules/gui/qt/widgets/qml/DoubleShadow.qml
=====================================
@@ -37,8 +37,8 @@ ScaledImage {
 
     property real rectWidth: sourceItem ? Math.min(sourceItem.paintedWidth ?? Number.MAX_VALUE, sourceItem.width) : 0
     property real rectHeight: sourceItem ? Math.min(sourceItem.paintedHeight ?? Number.MAX_VALUE, sourceItem.height) : 0
-    property real xRadius: sourceItem?.radius ?? 0
-    property real yRadius: sourceItem?.radius ?? 0
+    property real xRadius: (sourceItem ? (sourceItem.effectiveRadius ?? sourceItem.radius) : 0) ?? 0
+    property real yRadius: (sourceItem ? (sourceItem.effectiveRadius ?? sourceItem.radius) : 0) ?? 0
 
     property color primaryColor: Qt.rgba(0, 0, 0, .18)
     property real primaryVerticalOffset: 0


=====================================
modules/gui/qt/widgets/qml/DropShadowImage.qml
=====================================
@@ -35,8 +35,8 @@ ScaledImage {
 
     property real xOffset: 0
     property real yOffset: 0
-    property real xRadius: sourceItem?.radius ?? 0
-    property real yRadius: sourceItem?.radius ?? 0
+    property real xRadius: (sourceItem ? (sourceItem.effectiveRadius ?? sourceItem.radius) : 0) ?? 0
+    property real yRadius: (sourceItem ? (sourceItem.effectiveRadius ?? sourceItem.radius) : 0) ?? 0
 
     sourceSize: Qt.size(viewportWidth, viewportHeight)
 


=====================================
modules/gui/qt/widgets/qml/MediaCover.qml
=====================================
@@ -27,7 +27,7 @@ import VLC.Style
 
 // NOTE: This rectangle is useful to discern the item against a similar background.
 // FIXME: Maybe we could refactor this to draw the background directly in the RoundImage.
-Rectangle {
+Item {
     id: root
 
     // Properties
@@ -36,6 +36,14 @@ Rectangle {
 
     property bool playCoverShowPlay: true
 
+    readonly property real effectiveRadius: image.visible ? image.effectiveRadius
+                                                          : (fallbackImage.visible ? fallbackImage.effectiveRadius
+                                                                                   : 0.0)
+
+    property alias radius: image.radius
+
+    property alias color: background.color
+
     // Aliases
 
     property alias source: image.source
@@ -68,6 +76,12 @@ Rectangle {
 
     // Children
 
+    Rectangle {
+        id: background
+        anchors.fill: parent
+        radius: root.effectiveRadius
+    }
+
     //delay placeholder showing up
     Timer {
         id: timer
@@ -81,8 +95,6 @@ Rectangle {
 
         anchors.fill: parent
 
-        radius: root.radius
-
         sourceSize.width: root.pictureWidth * Screen.devicePixelRatio
         sourceSize.height: root.pictureHeight * Screen.devicePixelRatio
 


=====================================
modules/gui/qt/widgets/qml/RoundImage.qml
=====================================
@@ -38,6 +38,7 @@ Item {
     // so it is not provided as an alias here
 
     property real radius
+    readonly property real effectiveRadius: (shaderEffect.readyForVisibility ?? shaderEffect.visible) ? radius : 0.0
 
     // NOTE: Note the distinction between ShaderEffect and
     //       ShaderEffectSource. ShaderEffect is no different



View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/f938f458c16aa3182e51242eca3b1f2d99f56528...ec2645d1accbd2f666577fca8f74d61d6045f4d4

-- 
View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/f938f458c16aa3182e51242eca3b1f2d99f56528...ec2645d1accbd2f666577fca8f74d61d6045f4d4
You're receiving this email because of your account on code.videolan.org.


VideoLAN code repository instance