opaque/Icon.qml

64 lines
1.3 KiB
QML

import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.3
import "fonts/Twemoji.js" as T
import "." as Widgets
import "theme"
Rectangle {
id: root
property color backgroundColor: parent.color
property color hilightBackgroundColor: backgroundColor
property bool isHover: false
color: isHover ? backgroundColor : hilightBackgroundColor
property alias iconColor: iconColorOverlay.color
property alias source: srcImg.source
signal clicked()
Image {
id: srcImg
anchors.fill: parent
antialiasing: true
smooth: true
visible: false
// Apparently qml can now only DOWN-SCALE/SHRINK the SVG, so with this hack it which won't cause blurriness/pixelation
sourceSize.width: root.width*2
sourceSize.height: root.height*2
}
ColorOverlay{
id: iconColorOverlay
anchors.fill: srcImg
source: srcImg
antialiasing: true
smooth: true
}
MouseArea { // Full row mouse area triggering onClick
id: ma
anchors.fill: parent
hoverEnabled: true
onClicked: { root.clicked() }
onEntered: {
isHover = true
}
onExited: {
isHover = false
}
}
}