mirror of
https://github.com/AvengeMedia/DankMaterialShell.git
synced 2026-01-30 00:12:50 -05:00
also use shader for DankCircularImage
This commit is contained in:
@@ -1,34 +1,41 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Effects
|
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import qs.Common
|
import qs.Common
|
||||||
import qs.Widgets
|
import qs.Widgets
|
||||||
|
|
||||||
Rectangle {
|
Item {
|
||||||
id: root
|
id: root
|
||||||
|
|
||||||
property string imageSource: ""
|
property string imageSource: ""
|
||||||
property string fallbackIcon: "notifications"
|
property string fallbackIcon: "notifications"
|
||||||
property string fallbackText: ""
|
property string fallbackText: ""
|
||||||
property bool hasImage: imageSource !== ""
|
property bool hasImage: imageSource !== ""
|
||||||
property alias imageStatus: internalImage.status
|
property alias imageStatus: sourceImage.status
|
||||||
|
property color borderColor: "transparent"
|
||||||
|
property real borderWidth: 0
|
||||||
|
property real imageOpacity: 1.0
|
||||||
|
|
||||||
radius: width / 2
|
width: 64
|
||||||
|
height: 64
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
id: background
|
||||||
|
anchors.fill: parent
|
||||||
color: Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1)
|
color: Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.1)
|
||||||
border.color: "transparent"
|
radius: width * 0.5
|
||||||
border.width: 0
|
|
||||||
|
|
||||||
Image {
|
Image {
|
||||||
id: internalImage
|
id: sourceImage
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: 2
|
anchors.margins: 2
|
||||||
asynchronous: true
|
source: root.imageSource
|
||||||
|
visible: false
|
||||||
fillMode: Image.PreserveAspectCrop
|
fillMode: Image.PreserveAspectCrop
|
||||||
smooth: true
|
smooth: true
|
||||||
mipmap: true
|
mipmap: true
|
||||||
|
asynchronous: true
|
||||||
|
antialiasing: true
|
||||||
cache: true
|
cache: true
|
||||||
visible: false
|
|
||||||
source: root.imageSource
|
|
||||||
|
|
||||||
Component.onCompleted: {
|
Component.onCompleted: {
|
||||||
sourceSize.width = 128
|
sourceSize.width = 128
|
||||||
@@ -36,32 +43,24 @@ Rectangle {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
MultiEffect {
|
ShaderEffect {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: 2
|
anchors.margins: 2
|
||||||
source: internalImage
|
visible: sourceImage.status === Image.Ready && root.imageSource !== ""
|
||||||
maskEnabled: true
|
|
||||||
maskSource: circularMask
|
property var source: ShaderEffectSource {
|
||||||
visible: internalImage.status === Image.Ready && root.imageSource !== ""
|
sourceItem: sourceImage
|
||||||
maskThresholdMin: 0.5
|
hideSource: true
|
||||||
maskSpreadAtMin: 1
|
live: true
|
||||||
|
recursive: false
|
||||||
|
format: ShaderEffectSource.RGBA
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
property real imageOpacity: root.imageOpacity
|
||||||
id: circularMask
|
|
||||||
width: parent.width - 4
|
|
||||||
height: parent.height - 4
|
|
||||||
anchors.centerIn: parent
|
|
||||||
layer.enabled: true
|
|
||||||
layer.smooth: true
|
|
||||||
visible: false
|
|
||||||
|
|
||||||
Rectangle {
|
fragmentShader: Qt.resolvedUrl("../Shaders/qsb/circled_image.frag.qsb")
|
||||||
anchors.fill: parent
|
supportsAtlasTextures: false
|
||||||
radius: width / 2
|
blending: true
|
||||||
color: "black"
|
|
||||||
antialiasing: true
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
DankIcon {
|
DankIcon {
|
||||||
@@ -69,18 +68,7 @@ Rectangle {
|
|||||||
name: root.fallbackIcon
|
name: root.fallbackIcon
|
||||||
size: parent.width * 0.5
|
size: parent.width * 0.5
|
||||||
color: Theme.surfaceVariantText
|
color: Theme.surfaceVariantText
|
||||||
visible: internalImage.status !== Image.Ready && root.imageSource === "" && root.fallbackIcon !== ""
|
visible: sourceImage.status !== Image.Ready && root.imageSource === "" && root.fallbackIcon !== ""
|
||||||
}
|
|
||||||
|
|
||||||
Rectangle {
|
|
||||||
anchors.fill: parent
|
|
||||||
anchors.margins: 0
|
|
||||||
radius: width / 2
|
|
||||||
color: "transparent"
|
|
||||||
border.color: Theme.popupBackground()
|
|
||||||
border.width: 3
|
|
||||||
visible: root.hasImage && internalImage.status === Image.Ready
|
|
||||||
antialiasing: true
|
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledText {
|
StyledText {
|
||||||
@@ -91,4 +79,14 @@ Rectangle {
|
|||||||
font.weight: Font.Bold
|
font.weight: Font.Bold
|
||||||
color: Theme.primaryText
|
color: Theme.primaryText
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
anchors.fill: parent
|
||||||
|
radius: width / 2
|
||||||
|
color: "transparent"
|
||||||
|
border.color: root.borderColor !== "transparent" ? root.borderColor : Theme.popupBackground()
|
||||||
|
border.width: root.hasImage && sourceImage.status === Image.Ready ? (root.borderWidth > 0 ? root.borderWidth : 3) : 0
|
||||||
|
antialiasing: true
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user