[vlc-commits] [Git][videolan/vlc][master] 4 commits: qml: use sourceItem opacity by default in FrostedGlassEffect

Rémi Denis-Courmont (@Courmisch) gitlab at videolan.org
Fri Sep 2 18:01:13 UTC 2022



Rémi Denis-Courmont pushed to branch master at VideoLAN / VLC


Commits:
7d11b0e8 by Fatih Uzunoglu at 2022-09-02T17:37:38+00:00
qml: use sourceItem opacity by default in FrostedGlassEffect

- - - - -
2e7277f6 by Fatih Uzunoglu at 2022-09-02T17:37:38+00:00
qml: add loader to FrostedGlassEffect

- - - - -
e14a0233 by Fatih Uzunoglu at 2022-09-02T17:37:38+00:00
qml: enable layering in stackView when miniPlayer effect is available

- - - - -
65bd3a1a by Fatih Uzunoglu at 2022-09-02T17:37:38+00:00
qml: remove the effect from playlist overlay menu

Visual pleasure the effect provides is not justified due to the side effects the effect causes.

- - - - -


5 changed files:

- modules/gui/qt/maininterface/qml/MainDisplay.qml
- modules/gui/qt/player/qml/MiniPlayer.qml
- modules/gui/qt/playlist/qml/PlaylistListView.qml
- modules/gui/qt/widgets/qml/FrostedGlassEffect.qml
- modules/gui/qt/widgets/qml/OverlayMenu.qml


Changes:

=====================================
modules/gui/qt/maininterface/qml/MainDisplay.qml
=====================================
@@ -266,6 +266,27 @@ FocusScope {
                             leftMargin: VLCStyle.applicationHorizontalMargin
                         }
 
+                        // This item is the root of a large hierarchy
+                        // which requires many batches to be rendered.
+                        // When the miniPlayer effect is active, this
+                        // item (source item) gets rendered in an offscreen
+                        // surface. If we don't enable layer here,
+                        // it (along with children) gets rendered again
+                        // in the assigned window.
+                        // If layer is enabled, instead of rendering one
+                        // more time with many batches, a dynamic texture
+                        // from the offscreen surface is used. This behavior
+                        // reduces the amount of batches from 2x to x+1.
+                        // A side effect is having to draw a large texture
+                        // with blending on, but this must be cheaper redrawing
+                        // all the batches.
+                        // TODO: Reconsider this behavior when batching is optimized.
+                        layer.enabled: miniPlayer.visible && miniPlayer.effectAvailable
+
+                        // Enable clipping so that the effect does not sit
+                        // on top of the source.
+                        clip: miniPlayer.visible && miniPlayer.effectAvailable
+
                         Loader {
                             z: 1
                             anchors {


=====================================
modules/gui/qt/player/qml/MiniPlayer.qml
=====================================
@@ -35,6 +35,7 @@ FocusScope {
 
     property alias effectSource: effect.source
     property alias effectSourceRect: effect.sourceRect
+    property alias effectAvailable: effect.effectAvailable
 
     state: (Player.playingState === Player.PLAYING_STATE_STOPPED) ? ""
                                                                   : "expanded"


=====================================
modules/gui/qt/playlist/qml/PlaylistListView.qml
=====================================
@@ -20,7 +20,6 @@ import QtQuick.Controls 2.4
 import QtQuick.Templates 2.4 as T
 import QtQuick.Layouts 1.11
 import QtQml.Models 2.2
-import QtGraphicalEffects 1.0
 
 import org.videolan.vlc 0.1
 
@@ -144,8 +143,6 @@ Control {
             isRight: true
             rightPadding: VLCStyle.margin_xsmall + VLCStyle.applicationHorizontalMargin
             bottomPadding: VLCStyle.margin_large + root.bottomPadding
-
-            effectSource: contentItem
         }
     }
 


=====================================
modules/gui/qt/widgets/qml/FrostedGlassEffect.qml
=====================================
@@ -21,75 +21,98 @@ import QtGraphicalEffects 1.0
 
 import "qrc:///style/"
 
-Rectangle {
+Item {
     id: effect
 
-    property alias source: effectSource.sourceItem
-    property alias sourceRect: effectSource.sourceRect
-    property alias recursive: effectSource.recursive
-    property alias blurRadius: blurEffect.radius
-    property alias tint: effect.color
+    property Item source
+    property rect sourceRect: mapToItem(source, x, y, width, height)
+
+    property bool recursive: false
+    property real blurRadius: 64
+    property color tint
 
     property real tintStrength: 0.7
     property real noiseStrength: 0.02
     property real exclusionStrength: 0.09
 
-    FastBlur {
-        id: blurEffect
+    readonly property bool effectAvailable: (GraphicsInfo.shaderType === GraphicsInfo.GLSL) &&
+                                            (GraphicsInfo.shaderSourceType & GraphicsInfo.ShaderSourceString)
+
+    opacity: source.opacity
+
+    Loader {
+        id: loader
 
         anchors.fill: parent
 
-        source: ShaderEffectSource {
-            id: effectSource
-            sourceItem: effect.source
-            sourceRect: effect.mapToItem(effect.source,
-                                         effect.x,
-                                         effect.y,
-                                         effect.width,
-                                         effect.height)
-            visible: false
-            samples: 0
+        sourceComponent: effect.effectAvailable ? effectComponent : rectComponent
+
+        Component {
+            id: rectComponent
+
+            Rectangle {
+                color: effect.tint
+            }
         }
 
-        radius: 64
+        Component {
+            id: effectComponent
 
-        layer.enabled: true
-        layer.effect: ShaderEffect {
-            readonly property color tint: effect.tint
-            readonly property real tintStrength: effect.tintStrength
-            readonly property real noiseStrength: effect.noiseStrength
-            readonly property real exclusionStrength: effect.exclusionStrength
+            FastBlur {
+                id: blurEffect
 
-            fragmentShader: "
-                uniform lowp sampler2D source; // this item
-                varying highp vec2 qt_TexCoord0;
+                source: ShaderEffectSource {
+                    id: effectSource
+                    sourceItem: effect.source
+                    sourceRect: effect.sourceRect
+                    visible: false
+                    samples: 0
+                }
 
-                uniform lowp vec4  tint;
+                radius: effect.blurRadius
 
-                uniform lowp float exclusionStrength;
-                uniform lowp float noiseStrength;
-                uniform lowp float tintStrength;
+                layer.enabled: true
+                layer.effect: ShaderEffect {
+                    readonly property color tint: effect.tint
+                    readonly property real tintStrength: effect.tintStrength
+                    readonly property real noiseStrength: effect.noiseStrength
+                    readonly property real exclusionStrength: effect.exclusionStrength
 
-                mediump float rand(highp vec2 co){
-                    return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);
-                }
+                    fragmentShader: "
+                        uniform lowp sampler2D source; // this item
+                        varying highp vec2 qt_TexCoord0;
 
-                mediump vec4 exclude(mediump vec4 src, mediump vec4 dst)
-                {
-                    return src + dst - 2.0 * src * dst;
-                }
+                        uniform lowp float qt_Opacity;
+
+                        uniform lowp vec4  tint;
+
+                        uniform lowp float exclusionStrength;
+                        uniform lowp float noiseStrength;
+                        uniform lowp float tintStrength;
+
+                        mediump float rand(highp vec2 co){
+                            return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);
+                        }
 
-                void main() {
-                   mediump float r = rand(qt_TexCoord0) - 0.5;
-                   mediump vec4 noise = vec4(r,r,r,1.0) * noiseStrength;
-                   mediump vec4 blurred  = texture2D(source, qt_TexCoord0);
+                        mediump vec4 exclude(mediump vec4 src, mediump vec4 dst)
+                        {
+                            return src + dst - 2.0 * src * dst;
+                        }
 
-                   mediump vec4 exclColor = vec4(exclusionStrength, exclusionStrength, exclusionStrength, 0.0);
+                        void main() {
+                           mediump float r = rand(qt_TexCoord0) - 0.5;
+                           mediump vec4 noise = vec4(r,r,r,1.0) * noiseStrength;
+                           mediump vec4 blurred  = texture2D(source, qt_TexCoord0);
 
-                   blurred = exclude(blurred, exclColor);
+                           mediump vec4 exclColor = vec4(exclusionStrength, exclusionStrength, exclusionStrength, 0.0);
 
-                   gl_FragColor = mix(blurred, tint, tintStrength) + noise;
-                }"
+                           blurred = exclude(blurred, exclColor);
+
+                           gl_FragColor = (mix(blurred, tint, tintStrength) + noise) * qt_Opacity;
+                        }"
+                }
+            }
         }
+
     }
 }


=====================================
modules/gui/qt/widgets/qml/OverlayMenu.qml
=====================================
@@ -57,8 +57,6 @@ FocusScope {
         listView.resetStack()
     }
 
-    property alias effectSource: effect.source
-
     property alias scrollBarActive: scrollBar.active
 
     visible: false
@@ -103,9 +101,11 @@ FocusScope {
         }
     }
 
-    Item {
+    Rectangle {
         id: parentItem
 
+        color: root.colors.bg
+
         anchors {
             top: parent.top
             bottom: parent.bottom
@@ -114,6 +114,7 @@ FocusScope {
             left: isRight ? undefined : parent.left
         }
 
+        // TODO: Qt >= 5.12 use TapHandler
         MouseArea {
             anchors.fill: parent
             hoverEnabled: true
@@ -121,18 +122,6 @@ FocusScope {
             acceptedButtons: Qt.NoButton
         }
 
-        FrostedGlassEffect {
-            id: effect
-            anchors.fill: parent
-
-            source: backgroundItem
-
-            color: VLCStyle.colors.topBanner
-
-            tintStrength: 0.0
-            exclusionStrength: 0.1
-        }
-
         ListView {
             id: listView
 



View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/26893b16b5792eddb404662d7f1e19f795df63e6...65bd3a1a9aead42fcd353024d137277c9ec73fd7

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


VideoLAN code repository instance


More information about the vlc-commits mailing list