tianzixuan/Doric
Archived
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

add gradient for stack

Browse Source
This commit is contained in:
王劲鹏
2021-04-30 19:56:05 +08:00
committed by osborn
parent 7dfc7f7929
commit 6143f65f1e
2 changed files with 153 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
doric-Qt/example/doric/resources/stack.qml
View File

@@ -6,6 +6,7 @@ import QtGraphicalEffects 1.12
import "util.mjs" as Util
Rectangle {
id: root
property var wrapper
clip: true
@@ -16,10 +17,14 @@ Rectangle {
onWidthChanged: {
console.log(tag, uuid + " onWidthChanged: " + this.width)
updateGradient()
}
onHeightChanged: {
console.log(tag, uuid + " onHeightChanged: " + this.height)
updateGradient()
}
color: 'transparent'
@@ -71,4 +76,105 @@ Rectangle {
color: shadowColor
transparentBorder: true
}
property var backgroundColorIsObject: false
onBackgroundColorIsObjectChanged: {
if (backgroundColorIsObject) {
lineGradient.anchors.fill = root
} else {
lineGradient.anchors.fill = null
}
}
property variant gradientColors: []
property variant gradientLocations: []
onGradientColorsChanged: {
console.log(tag, uuid + " onGradientColorsChanged: " + gradientColors)
if (gradientColors.length > 0) {
let stops = []
if (gradientLocations.length == 0) {
let unit = 1 / (gradientColors.length - 1)
for (let i = 0;i !== gradientColors.length;i++) {
let a = ((gradientColors[i] >> 24) & 0xff) / 255;
let r = ((gradientColors[i] >> 16) & 0xff) / 255;
let g = ((gradientColors[i] >> 8) & 0xff) / 255;
let b = ((gradientColors[i] >> 0) & 0xff) / 255;
let stop = stopComponent.createObject(root, {"position": unit * i, "color": Qt.rgba(r, g, b, a)})
console.log(tag, uuid + " onGradientColorsChanged: " + "position: " + unit * i + " color: " + Qt.rgba(r, g, b, a))
stops.push(stop)
}
} else {
for (let i = 0;i !== gradientColors.length;i++) {
let a = ((gradientColors[i] >> 24) & 0xff) / 255;
let r = ((gradientColors[i] >> 16) & 0xff) / 255;
let g = ((gradientColors[i] >> 8) & 0xff) / 255;
let b = ((gradientColors[i] >> 0) & 0xff) / 255;
let stop = stopComponent.createObject(root, {"position": gradientLocations[i], "color": Qt.rgba(r, g, b, a)})
console.log(tag, uuid + " onGradientColorsChanged: " + "position: " + gradientLocations[i] + " color: " + Qt.rgba(r, g, b, a))
stops.push(stop)
}
}
innerGradient.stops = stops
}
}
property var orientation: 0
function updateGradient() {
switch (orientation) {
case 0:
lineGradient.start = Qt.point(0, 0)
lineGradient.end = Qt.point(0, root.height)
break
case 1:
lineGradient.start = Qt.point(root.width, 0)
lineGradient.end = Qt.point(0, root.height)
break
case 2:
lineGradient.start = Qt.point(root.width, 0)
lineGradient.end = Qt.point(0, 0)
break
case 3:
lineGradient.start = Qt.point(root.width, root.height)
lineGradient.end = Qt.point(0, 0)
break
case 4:
lineGradient.start = Qt.point(0, root.height)
lineGradient.end = Qt.point(0, 0)
break
case 5:
lineGradient.start = Qt.point(0, root.height)
lineGradient.end = Qt.point(root.width, 0)
break
case 6:
lineGradient.start = Qt.point(0, 0)
lineGradient.end = Qt.point(root.width, 0)
break
case 7:
lineGradient.start = Qt.point(0, 0)
lineGradient.end = Qt.point(root.width, root.height)
break
}
}
onOrientationChanged: {
console.log(tag, uuid + " onOrientationChanged: " + orientation)
updateGradient()
}
LinearGradient {
Component {
id:stopComponent
GradientStop {}
}
id: lineGradient
gradient: Gradient {
id: innerGradient
}
}
}