Replace Rectangle mask with Quickshell.Widgets.ClippingRectangle
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import Quickshell
|
||||
import Quickshell.Widgets
|
||||
import Quickshell.Services.Notifications
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
@@ -14,35 +15,21 @@ Rectangle {
|
||||
radius: 20
|
||||
color: "#181818"
|
||||
|
||||
Image {
|
||||
id: notifIcon
|
||||
visible: false
|
||||
ClippingRectangle {
|
||||
antialiasing: true
|
||||
anchors {
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
leftMargin: 12
|
||||
}
|
||||
radius: 8
|
||||
width: 40
|
||||
height: 40
|
||||
source: notification?.image ?? source
|
||||
layer.enabled: true
|
||||
}
|
||||
Rectangle {
|
||||
id: iconMask
|
||||
antialiasing: true
|
||||
layer.enabled: true
|
||||
visible: false
|
||||
anchors.fill: notifIcon
|
||||
layer.smooth: true
|
||||
radius: 8
|
||||
}
|
||||
MultiEffect {
|
||||
anchors.fill: notifIcon
|
||||
source: notifIcon
|
||||
maskEnabled: true
|
||||
maskSource: iconMask
|
||||
maskThresholdMin: 0.5
|
||||
maskSpreadAtMin: 1
|
||||
Image {
|
||||
id: notifIcon
|
||||
anchors.fill: parent
|
||||
source: notification?.image ?? source
|
||||
}
|
||||
}
|
||||
Column {
|
||||
id: notifContent
|
||||
|
||||
52
Wall.qml
52
Wall.qml
@@ -17,18 +17,8 @@ Variants {
|
||||
screen: modelData
|
||||
color: "#222222"
|
||||
|
||||
RectangularShadow {
|
||||
anchors.fill: imageWrapper
|
||||
transform: imageWrapper.transform
|
||||
radius: roundMask.radius
|
||||
blur: 30
|
||||
spread: 10
|
||||
color: "#000000"
|
||||
}
|
||||
Item {
|
||||
id: imageWrapper
|
||||
anchors.fill: parent
|
||||
layer.enabled: true
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
fillMode: Image.PreserveAspectCrop
|
||||
@@ -37,48 +27,6 @@ Variants {
|
||||
return _source.substring(0, _source.length - 1)
|
||||
}
|
||||
}
|
||||
transform: [Scale {
|
||||
origin {x: width/2; y: height/2}
|
||||
xScale: 0.8
|
||||
yScale: xScale
|
||||
NumberAnimation on xScale {
|
||||
id: scaleAnim
|
||||
running: false
|
||||
to: 1
|
||||
duration: 800
|
||||
easing.type: Easing.InOutCubic
|
||||
}
|
||||
}, Translate {
|
||||
NumberAnimation on y {
|
||||
from: 100
|
||||
to: 0
|
||||
duration: 500
|
||||
easing.type: Easing.OutQuint
|
||||
onFinished: scaleAnim.start()
|
||||
}
|
||||
}]
|
||||
layer.effect: MultiEffect {
|
||||
maskSource: roundMask
|
||||
maskEnabled: true
|
||||
}
|
||||
NumberAnimation on opacity {
|
||||
from: 0
|
||||
to: 1
|
||||
duration: 250
|
||||
}
|
||||
}
|
||||
Rectangle {
|
||||
id: roundMask
|
||||
visible: false
|
||||
antialiasing: true
|
||||
anchors.fill: imageWrapper
|
||||
radius: 40
|
||||
layer.enabled: true
|
||||
NumberAnimation on radius {
|
||||
running: scaleAnim.running
|
||||
to: 0
|
||||
duration: 800
|
||||
}
|
||||
}
|
||||
|
||||
FileView {
|
||||
|
||||
Reference in New Issue
Block a user