LedDisplay/OmobiDisplayApp/ressources/qml/Chip.qml
Dorian Zedler 5a16d3ebdc
- added color indicator to main overview page
- redesigned chips and made them consistent
2020-10-15 12:52:19 +02:00

78 lines
1.9 KiB
QML

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtGraphicalEffects 1.12
Item {
id: control
property bool raised: false
property alias mouseArea: mouseArea
property string text: ""
property string color: "#fcba03"
property bool isDarkColor: control.checkIsDarkColor(color)
property double glowRadius: 0.001
property double glowSpread: 0.2
property bool glowVisible: true
property double glowScale: 0.9
property double glowOpacity: Math.pow( control.opacity, 100 )
signal clicked
function checkIsDarkColor(color) {
var c = color.substring(1); // strip #
var rgb = parseInt(c, 16); // convert rrggbb to decimal
var r = (rgb >> 16) & 0xff; // extract red
var g = (rgb >> 8) & 0xff; // extract green
var b = (rgb >> 0) & 0xff; // extract blue
var luma = 0.2126 * r + 0.7152 * g + 0.0722 * b; // per ITU-R BT.709
return luma < 150
}
RectangularGlow {
id: effect
glowRadius: control.glowRadius
spread: control.glowSpread
color: "black"
visible: control.glowVisible
cornerRadius: background.radius
anchors.fill: background
scale: control.glowScale
opacity: control.glowOpacity
}
Rectangle {
id: background
anchors.fill: parent
color: control.color
radius: height * 0.5
Behavior on color {
ColorAnimation {}
}
}
Text {
id: contentText
anchors.fill: parent
anchors.margins: parent.height * 0.25
font.pixelSize: height
fontSizeMode: Text.Fit
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
color: control.isDarkColor ? "white":"black"
text: control.text
}
MouseArea {
id: mouseArea
anchors.fill: parent
enabled: control.enabled
onClicked: control.clicked()
}
}