Reimplement Qt5 OpacityMask using Qt6 MultiEffect

Remaining ones.
See 93b25dfa97494184493e02b75766e57bc6fe79bb
https://darapsa.org/qeduport.git/commit/?id=93b25dfa97494184493e02b75766e57bc6fe79bb

2 files changed, 41 insertions, 32 deletions

diff --git a/Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml b/Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml
index 1f34f36..9643916 100644
--- a/Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml
+++ b/Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml
@@ -1,7 +1,7 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
-import Qt5Compat.GraphicalEffects
+import QtQuick.Effects
 
 Item {
 	width: reviewItem.width
@@ -10,26 +10,29 @@ Item {
 		id:reviewItem
 		spacing: 16
 		RowLayout {
-			id: reviewAvatar
 			Layout.alignment: Qt.AlignLeft | Qt.AlignTop
-			Rectangle {
-				id: avatarMask
-				radius: 100
-				Layout.preferredHeight: 82
-				Layout.preferredWidth: 82
-				Layout.minimumHeight: 82
-				Layout.minimumWidth: 82
-				Image{
-					id: avatarImage
-					source: "https://eduport.webestica.com/assets/images/avatar/09.jpg"
-					sourceSize: Qt.size(parent.width, parent.height)
-					visible: false
+			Image {
+				id: avatarImage
+				source: "https://eduport.webestica.com/assets/images/avatar/09.jpg"
+				sourceSize {
+					width: 82
+					height: 82
+				}
+			}
+			layer {
+				enabled: true
+				effect: MultiEffect {
+					maskEnabled: true
+					maskSource: maskRectangle
 				}
 			}
-			OpacityMask {
-				anchors.fill: avatarMask
-				source: avatarImage
-				maskSource: avatarMask
+			Rectangle {
+				id: maskRectangle
+				width: avatarImage.sourceSize.width
+				height: avatarImage.sourceSize.height
+				radius: avatarImage.sourceSize.width
+				layer.enabled: true
+				visible: false
 			}
 		}
 		ColumnLayout {
diff --git a/Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml b/Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml
index 6931522..b3f6e85 100644
--- a/Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml
+++ b/Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml
@@ -1,6 +1,7 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
+import QtQuick.Effects
 import Qt5Compat.GraphicalEffects
 
 Item {
@@ -38,20 +39,25 @@ Item {
 					id: courseVideoImage
 					source: "https://eduport.webestica.com/assets/images/courses/4by3/01.jpg"
 					fillMode: Image.PreserveAspectCrop
-					width: parent.width
-					height: parent.height
-					visible: false
-				}
-				OpacityMask {
-					id: courseVideoMask
-					anchors.fill: courseVideoThumbnail
-					source: courseVideoImage
-					maskSource: courseVideoThumbnail
-				}
-				ColorOverlay {
-					anchors.fill: courseVideoMask
-					source: courseVideoMask
-					color: "#80000000"
+					sourceSize {
+						width: parent.width
+						height: parent.height
+					}
+					layer {
+						enabled: true
+						effect: MultiEffect {
+							maskEnabled: true
+							maskSource: maskRectangle
+						}
+					}
+					Rectangle {
+						id: maskRectangle
+						width: courseVideoImage.sourceSize.width
+						height: courseVideoImage.sourceSize.height
+						radius: 8
+						layer.enabled: true
+						visible: false
+					}
 				}
 				Button {
 					id: playVideoButton