[vlc-devel] [PATCH 2/5] qml: implement ShadowCoverGenerator

Prince Gupta guptaprince8832 at gmail.com
Fri Apr 9 14:47:29 UTC 2021


can generate shadows in a Component which then can be reused at
different places, note that shadows are only created once
---
 modules/gui/qt/Makefile.am                    |   1 +
 modules/gui/qt/vlc.qrc                        |   1 +
 .../qt/widgets/qml/ShadowCoverGenerator.qml   | 103 ++++++++++++++++++
 3 files changed, 105 insertions(+)
 create mode 100644 modules/gui/qt/widgets/qml/ShadowCoverGenerator.qml

diff --git a/modules/gui/qt/Makefile.am b/modules/gui/qt/Makefile.am
index ca5509a76b..52cf6b4344 100644
--- a/modules/gui/qt/Makefile.am
+++ b/modules/gui/qt/Makefile.am
@@ -751,6 +751,7 @@ libqt_plugin_la_QML = \
 	gui/qt/widgets/qml/ExpandGridView.qml \
 	gui/qt/widgets/qml/FocusBackground.qml \
 	gui/qt/widgets/qml/GridItem.qml \
+	gui/qt/widgets/qml/GridShadow.qml \
 	gui/qt/widgets/qml/HorizontalResizeHandle.qml \
 	gui/qt/widgets/qml/IconLabel.qml \
 	gui/qt/widgets/qml/IconButton.qml \
diff --git a/modules/gui/qt/vlc.qrc b/modules/gui/qt/vlc.qrc
index b2458b6e08..01809a40fd 100644
--- a/modules/gui/qt/vlc.qrc
+++ b/modules/gui/qt/vlc.qrc
@@ -251,6 +251,7 @@
         <file alias="ListCoverShadow.qml">widgets/qml/ListCoverShadow.qml</file>
         <file alias="OverlayMenu.qml">widgets/qml/OverlayMenu.qml</file>
         <file alias="IconControlButton.qml">widgets/qml/IconControlButton.qml</file>
+        <file alias="ShadowCoverGenerator.qml">widgets/qml/ShadowCoverGenerator.qml</file>
     </qresource>
     <qresource prefix="/network">
         <file alias="AddressbarButton.qml">network/qml/AddressbarButton.qml</file>
diff --git a/modules/gui/qt/widgets/qml/ShadowCoverGenerator.qml b/modules/gui/qt/widgets/qml/ShadowCoverGenerator.qml
new file mode 100644
index 0000000000..9c1213c90f
--- /dev/null
+++ b/modules/gui/qt/widgets/qml/ShadowCoverGenerator.qml
@@ -0,0 +1,103 @@
+/*****************************************************************************
+ * Copyright (C) 2021 VLC authors and VideoLAN
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * ( at your option ) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston MA 02110-1301, USA.
+ *****************************************************************************/
+
+import QtQuick 2.11
+import QtGraphicalEffects 1.0
+
+import "qrc:///style/"
+
+Item {
+    id: root
+
+    property real leftPadding: 0
+    property real topPadding: 0
+    property real coverMargins: 0
+    property real coverWidth: 0
+    property real coverHeight: 0
+    property real coverRadius: 0
+    property color coverColor: VLCStyle.colors.bg
+
+    property alias primaryVerticalOffset: primaryShadow.verticalOffset
+    property alias primaryRadius: primaryShadow.radius
+    property alias primarySamples: primaryShadow.samples
+    property alias secondaryVerticalOffset: secondaryShadow.verticalOffset
+    property alias secondaryRadius: secondaryShadow.radius
+    property alias secondarySamples: secondaryShadow.samples
+
+    readonly property real _kernalRadius: Math.max(0, root.primarySamples / 2)
+    property real _reference: 0
+
+    property Component imageComponent: ShaderEffectSource {
+        sourceItem: container
+        live: true
+        x: - root._kernalRadius + root.leftPadding
+        y: - root._kernalRadius + root.primaryVerticalOffset + root.topPadding
+        width: container.width
+        height: container.height
+        hideSource: true
+
+        Component.onCompleted: root._reference++;
+        Component.onDestruction: root._reference--;
+    }
+
+    Item {
+        id: container
+
+        // it imageComponent is used with invisible root container, generated shadows are too dark
+        // another possible fix is to set DropShadow::cached = false, but that has performance penalty
+        visible: root._reference > 0
+
+        width: baseRect.width + 2 * root._kernalRadius
+        height: baseRect.height + 2 * root._kernalRadius
+
+        Rectangle {
+            id: baseRect
+
+            x: root._kernalRadius + root.coverMargins
+            y: root._kernalRadius - root.primaryVerticalOffset + root.coverMargins
+            width: root.coverWidth - root.coverMargins * 2
+            height: root.coverHeight - root.coverMargins * 2
+            radius: root.coverRadius
+            color: root.coverColor
+        }
+
+        DropShadow {
+            id: primaryShadow
+
+            anchors.fill: baseRect
+            source: baseRect
+            horizontalOffset: 0
+            spread: 0
+            color: Qt.rgba(0, 0, 0, .22)
+            samples: 1 + radius * 2
+            cached: true
+        }
+
+        DropShadow {
+            id: secondaryShadow
+
+            anchors.fill: baseRect
+            source: baseRect
+            horizontalOffset: 0
+            spread: 0
+            color: Qt.rgba(0, 0, 0, .18)
+            samples: 1 + radius * 2
+            cached: true
+        }
+    }
+}
-- 
2.27.0



More information about the vlc-devel mailing list