70 lines
2.0 KiB
QML
70 lines
2.0 KiB
QML
import QtQuick
|
|
import QtQuick.Controls
|
|
import Qt5Compat.GraphicalEffects
|
|
|
|
Item {
|
|
id: control
|
|
property string color
|
|
property int radius: 0
|
|
property int topLeftRadius: radius
|
|
property int topRightRadius: radius
|
|
property int bottomLeftRadius: radius
|
|
property int bottomRightRadius: radius
|
|
default property alias contentItem: container.data
|
|
onWidthChanged: {
|
|
canvas.requestPaint()
|
|
}
|
|
onHeightChanged: {
|
|
canvas.requestPaint()
|
|
}
|
|
onTopLeftRadiusChanged: {
|
|
canvas.requestPaint()
|
|
}
|
|
onTopRightRadiusChanged: {
|
|
canvas.requestPaint()
|
|
}
|
|
onBottomLeftRadiusChanged: {
|
|
canvas.requestPaint()
|
|
}
|
|
onBottomRightRadiusChanged: {
|
|
canvas.requestPaint()
|
|
}
|
|
onColorChanged: {
|
|
canvas.requestPaint()
|
|
}
|
|
Canvas {
|
|
id: canvas
|
|
anchors.fill: parent
|
|
|
|
onPaint: {
|
|
var ctx = getContext("2d")
|
|
ctx.clearRect(0, 0, width, height)
|
|
ctx.beginPath()
|
|
ctx.moveTo(control.topLeftRadius, 0)
|
|
ctx.lineTo(width - control.topRightRadius, 0)
|
|
ctx.arcTo(width, 0, width, control.topRightRadius, control.topRightRadius)
|
|
ctx.lineTo(width, height - control.bottomRightRadius)
|
|
ctx.arcTo(width, height, width - control.bottomRightRadius, height, control.bottomRightRadius)
|
|
ctx.lineTo(control.bottomLeftRadius, height)
|
|
ctx.arcTo(0, height, 0, height - control.bottomLeftRadius, control.bottomLeftRadius)
|
|
ctx.lineTo(0, control.topLeftRadius)
|
|
ctx.arcTo(0, 0, control.topLeftRadius, 0, control.topLeftRadius)
|
|
ctx.closePath()
|
|
ctx.fillStyle = control.color
|
|
ctx.fill()
|
|
}
|
|
}
|
|
Rectangle {
|
|
id: container
|
|
anchors.fill: parent
|
|
color: control.color
|
|
opacity: 0
|
|
}
|
|
OpacityMask {
|
|
anchors.fill: canvas
|
|
source: container
|
|
maskSource: canvas
|
|
invert: control.color === "transparent"
|
|
}
|
|
}
|