From 5f777bca13beadd0a56d2264225b0c09e49541a2 Mon Sep 17 00:00:00 2001
From: Erik Prabowo Kamal <erik@darapsa.org>
Date: Thu, 11 Dec 2025 15:09:38 +0800
Subject: Reimplement Qt5 OpacityMask using Qt6 MultiEffect

Therefore no longer depends on Qt5Compat GraphicalEffects.
The mask Rectangle needs to be put outside of the MultiEffect,
and referred to by the Rectangle's ID.
It wouldn't work if it's put directly on MultiEffect's maskSource.
---
 Card.ui.qml      | 22 ++++++++++++++--------
 ChatForm.ui.qml  |  1 -
 ChatGroup.ui.qml | 19 ++++++++++++-------
 3 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/Card.ui.qml b/Card.ui.qml
index c713a7b..44da57a 100644
--- a/Card.ui.qml
+++ b/Card.ui.qml
@@ -1,7 +1,7 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
-import Qt5Compat.GraphicalEffects
+import QtQuick.Effects
 import Bootstrap
 
 Item {
@@ -33,15 +33,21 @@ Item {
 				width: 44
 				height: 44
 			}
-			layer.enabled: true
-			layer.effect: OpacityMask {
-				maskSource: Rectangle {
-					width: 44
-					height: 44
-					radius: 22
+			layer {
+				enabled: true
+				effect: MultiEffect {
+					maskEnabled: true
+					maskSource: maskRectangle
 				}
 			}
-
+			Rectangle {
+				id: maskRectangle
+				width: 44
+				height: 44
+				radius: 22
+				layer.enabled: true
+				visible: false
+			}
 			MouseArea {
 				id: imageArea
 				anchors.fill: parent
diff --git a/ChatForm.ui.qml b/ChatForm.ui.qml
index 962d64d..330096d 100644
--- a/ChatForm.ui.qml
+++ b/ChatForm.ui.qml
@@ -1,7 +1,6 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
-import Qt5Compat.GraphicalEffects
 import Bootstrap
 
 Item {
diff --git a/ChatGroup.ui.qml b/ChatGroup.ui.qml
index e3165fa..bb16852 100644
--- a/ChatGroup.ui.qml
+++ b/ChatGroup.ui.qml
@@ -1,7 +1,7 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
-import Qt5Compat.GraphicalEffects
+import QtQuick.Effects
 
 Page {
 	property string titleText: qsTr("Bootstrap Community")
@@ -72,14 +72,19 @@ Page {
 				}
 				layer {
 					enabled: true
-					effect: OpacityMask {
-						maskSource: Rectangle {
-							width: 26
-							height: 26
-							radius: 13
-						}
+					effect: MultiEffect {
+						maskEnabled: true
+						maskSource: maskRectangle
 					}
 				}
+				Rectangle {
+					id: maskRectangle
+					width: 26
+					height: 26
+					radius: 13
+					layer.enabled: true
+					visible: false
+				}
 			}
 		}
 	}
-- 
cgit v1.2.3