[vlc-commits] [Git][videolan/vlc][master] qt: optimize the frosted glass effect by not using second pass layering

Steve Lhomme (@robUx4) gitlab at videolan.org
Sun Dec 15 10:43:04 UTC 2024



Steve Lhomme pushed to branch master at VideoLAN / VLC


Commits:
988b7bb2 by Fatih Uzunoglu at 2024-12-15T10:23:02+00:00
qt: optimize the frosted glass effect by not using second pass layering

Currently layering (second pass) is used to render
the blurred source offscreen, and then apply the
rest of the effects (tint, exclusion and noise) to
the offscreen source when drawing the result in the
interface. Note that the first pass layering for the
source item is necessary for blurring and can not
be disabled.

This is not ideal, because layering requires
allocating resources for offscreen rendering.

The most ideal solution would be to modify
the fragment shader of the blur effect. But we
currently do not do run time shader compilation,
and MultiEffect does not accept overriding its
shader effect.

At the same time, FastBlur from Qt 5 Compat is
used as fallback when Qt Quick Effects is not
available. In a hypothetical scenario where we
could override the fragment shader, it would
mean that we would need to handle these two
cases differently because MultiEffect and
FastBlur use different shaders.

As a workaround, I propose having an underlay
filter rectangle that acts as exclusion (due
to opacity) and colorization (tint), and having
an overlay as the noise layer.

- - - - -


6 changed files:

- modules/gui/qt/Makefile.am
- modules/gui/qt/maininterface/qml/MainDisplay.qml
- modules/gui/qt/shaders/FrostedGlass.frag → modules/gui/qt/shaders/Noise.frag
- modules/gui/qt/shaders/meson.build
- modules/gui/qt/shaders/shaders.qrc
- modules/gui/qt/widgets/qml/FrostedGlassEffect.qml


Changes:

=====================================
modules/gui/qt/Makefile.am
=====================================
@@ -1339,7 +1339,7 @@ libqt_plugin_la_ALL_QML = \
 libqt_plugin_la_SHADER := shaders/FadingEdge.frag \
                           shaders/FadingEdgeX.vert \
                           shaders/FadingEdgeY.vert \
-                          shaders/FrostedGlass.frag \
+                          shaders/Noise.frag \
                           shaders/RectFilter.frag \
                           shaders/SubTexture.vert \
                           shaders/PlayerBlurredBackground.frag \


=====================================
modules/gui/qt/maininterface/qml/MainDisplay.qml
=====================================
@@ -247,8 +247,6 @@ FocusScope {
                                 colorSet: ColorContext.Window
                             }
 
-                            blending: stackViewParentLayerEffect.blending
-
                             tint: frostedTheme.bg.secondary
                         }
                     }


=====================================
modules/gui/qt/shaders/FrostedGlass.frag → modules/gui/qt/shaders/Noise.frag
=====================================
@@ -19,34 +19,21 @@
  *****************************************************************************/
 
 layout(location = 0) in vec2 qt_TexCoord0;
+
 layout(location = 0) out vec4 fragColor;
+
 layout(std140, binding = 0) uniform buf {
   mat4 qt_Matrix;
   float qt_Opacity;
-  vec4 tint;
-  float exclusionStrength;
-  float noiseStrength;
-  float tintStrength;
+  float strength;
 };
-layout(binding = 1) uniform sampler2D source;
 
 float rand(vec2 co){
     return fract(sin(dot(co.xy, vec2(12.9898, 78.233))) * 43758.5453);
 }
 
-vec4 exclude(vec4 src, vec4 dst)
-{
-    return src + dst - 2.0 * src * dst;
-}
-
 void main() {
    float r = rand(qt_TexCoord0) - 0.5;
-   vec4 noise = vec4(r,r,r,1.0) * noiseStrength;
-   vec4 blurred  = texture(source, qt_TexCoord0);
-
-   vec4 exclColor = vec4(exclusionStrength, exclusionStrength, exclusionStrength, 0.0);
-
-   blurred = exclude(blurred, exclColor);
-
-   fragColor = (mix(blurred, tint, tintStrength) + noise) * qt_Opacity;
+   vec4 noise = vec4(r,r,r,1.0) * strength;
+   fragColor = noise * qt_Opacity;
 }


=====================================
modules/gui/qt/shaders/meson.build
=====================================
@@ -10,7 +10,7 @@ shader_sources = [
     'FadingEdge.frag',
     'FadingEdgeX.vert',
     'FadingEdgeY.vert',
-    'FrostedGlass.frag',
+    'Noise.frag',
     'RectFilter.frag',
     'SubTexture.vert',
     'PlayerBlurredBackground.frag',


=====================================
modules/gui/qt/shaders/shaders.qrc
=====================================
@@ -4,7 +4,7 @@
         <file alias="FadingEdge.frag.qsb">FadingEdge.frag.qsb</file>
         <file alias="FadingEdgeX.vert.qsb">FadingEdgeX.vert.qsb</file>
         <file alias="FadingEdgeY.vert.qsb">FadingEdgeY.vert.qsb</file>
-        <file alias="FrostedGlass.frag.qsb">FrostedGlass.frag.qsb</file>
+        <file alias="Noise.frag.qsb">Noise.frag.qsb</file>
         <file alias="RectFilter.frag.qsb">RectFilter.frag.qsb</file>
         <file alias="SubTexture.vert.qsb">SubTexture.vert.qsb</file>
         <file alias="PlayerBlurredBackground.frag.qsb">PlayerBlurredBackground.frag.qsb</file>


=====================================
modules/gui/qt/widgets/qml/FrostedGlassEffect.qml
=====================================
@@ -29,24 +29,37 @@ Widgets.BlurEffect {
 
     radius: 64
 
-    property bool blending: false
-
     property color tint: "transparent"
     property real tintStrength: Qt.colorEqual(tint, "transparent") ? 0.0 : 0.7
     property real noiseStrength: 0.02
-    property real exclusionStrength: 0.09
 
-    layer.enabled: true
-    layer.effect: ShaderEffect {
-        readonly property color tint: root.tint
-        readonly property real tintStrength: root.tintStrength
-        readonly property real noiseStrength: root.noiseStrength
-        readonly property real exclusionStrength: root.exclusionStrength
+    // Have a semi-opaque filter blended with the source.
+    // This is intended to act as both colorization (tint),
+    // and exclusion effects.
+    Rectangle {
+        id: filter
+
+        // Underlay for the blur effect:
+        parent: root.source?.sourceItem ?? root.source
+        anchors.fill: parent
+        z: 999
+
+        visible: root.tintStrength > 0.0
+
+        color: Qt.alpha(root.tint, root.tintStrength)
+    }
+
+    ShaderEffect {
+        id: noise
+
+        // Overlay for the blur effect:
+        anchors.fill: parent
+        z: 999
 
-        cullMode: ShaderEffect.BackFaceCulling
+        visible: root.noiseStrength > 0.0
 
-        blending: root.blending
+        readonly property real strength: root.noiseStrength
 
-        fragmentShader: "qrc:///shaders/FrostedGlass.frag.qsb"
+        fragmentShader: "qrc:///shaders/Noise.frag.qsb"
     }
 }



View it on GitLab: https://code.videolan.org/videolan/vlc/-/commit/988b7bb2ebe3612ee38c1179c60b739ed15ef823

-- 
View it on GitLab: https://code.videolan.org/videolan/vlc/-/commit/988b7bb2ebe3612ee38c1179c60b739ed15ef823
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