Introducing fragment shaders for image rounding.

Widgets/NImageRounded.qml

@@ -23,13 +23,12 @@ Rectangle {
   Rectangle {
     color: Color.transparent
     anchors.fill: parent
-    anchors.margins: borderWidth
 
     Image {
       id: img
       anchors.fill: parent
       source: imagePath
-      visible: false
+      visible: false // Hide since we're using it as shader source
       mipmap: true
       smooth: true
       asynchronous: true
@@ -37,24 +36,33 @@ Rectangle {
       fillMode: Image.PreserveAspectCrop
     }
 
-    MultiEffect {
+    ShaderEffect {
       anchors.fill: parent
-      source: img
-      maskEnabled: true
-      maskSource: mask
-      maskSpreadAtMax: 0.75
-      visible: imagePath !== ""
-    }
 
-    Item {
-      id: mask
-      anchors.fill: parent
-      layer.enabled: true
-      visible: false
+      property var source: ShaderEffectSource {
+        sourceItem: img
+        hideSource: true
+        live: true
+        recursive: false
+        format: ShaderEffectSource.RGBA
+      }
+
+      // Use custom property names to avoid conflicts with final properties
+      property real itemWidth: root.width
+      property real itemHeight: root.height
+      property real cornerRadius: root.radius
+      property real imageOpacity: root.opacity
+      fragmentShader: "file:Shaders/qsb/rounded_image.frag.qsb"
+
+      // Qt6 specific properties - ensure proper blending
+      supportsAtlasTextures: false
+      blending: true
+      // Make sure the background is transparent
       Rectangle {
+        id: background
         anchors.fill: parent
-        radius: scaledRadius
-        antialiasing: true
+        color: "transparent"
+        z: -1
       }
     }