harbour-seaprint/qml/components/CylinderGraph.qml

87 lines
2.5 KiB
QML
Raw Permalink Normal View History

2021-07-11 15:27:03 +03:00
import QtQuick 2.6
2020-10-10 14:01:56 +03:00
import Sailfish.Silica 1.0
Item {
id: cylinderGraph
2021-08-06 20:44:51 +03:00
property string color
2020-10-10 14:01:56 +03:00
property real value
width: Theme.itemSizeSmall/2
height: Theme.itemSizeSmall
anchors.verticalCenter: parent.verticalCenter
Rectangle {
id: effect
z: 1
anchors.centerIn: parent
2020-10-10 17:59:22 +03:00
width: Theme.itemSizeExtraSmall
height: Theme.itemSizeExtraSmall/3
2021-08-06 20:44:51 +03:00
rotation: 270
2020-10-10 14:01:56 +03:00
transformOrigin: Item.Center
gradient: Gradient {
2021-08-06 20:44:51 +03:00
GradientStop { position: 0.0; color: "#40888888"}
GradientStop { position: 0.1; color: "#20FFFFFF"}
GradientStop { position: 0.2; color: "#00000000"}
GradientStop { position: 0.6; color: "#00000000"}
GradientStop { position: 0.8; color: "#20FFFFFF"}
GradientStop { position: 1.0; color: "#40888888"}
2020-10-10 14:01:56 +03:00
}
}
Rectangle {
2021-08-06 20:44:51 +03:00
id: fill
2020-10-10 17:59:22 +03:00
width: Theme.itemSizeExtraSmall*parent.value
height: (Theme.itemSizeExtraSmall/3)
2021-08-06 20:44:51 +03:00
rotation: 270
2020-10-10 14:01:56 +03:00
transformOrigin: Item.Center
2020-10-10 17:59:22 +03:00
gradient: Gradient {
2021-08-06 20:44:51 +03:00
id: gradient
}
Component
{
id: stopComponent
GradientStop {}
}
function splitColors(color) {
if(color.indexOf("#") != 0)
{
return ["black"];
}
var colors = [];
var parts = color.split("#");
for(var i = 1; i < parts.length; i++)
{
colors.push("#"+parts[i])
}
return colors;
}
Component.onCompleted: {
var colors = splitColors(cylinderGraph.color);
var stops = [];
stops.push(stopComponent.createObject(fill, {"position": 0.0, "color": "#00000000"}));
stops.push(stopComponent.createObject(fill, {"position": 0.1, "color": colors[0]}));
for(var i = 0; i < colors.length; i++)
{
var pos = 0.1+(i+0.5)*(0.8/colors.length);
stops.push(stopComponent.createObject(fill, {"position": pos, "color": colors[i]}));
}
stops.push(stopComponent.createObject(fill, {"position": 0.9, "color": colors[colors.length-1]}));
stops.push(stopComponent.createObject(fill, {"position": 1.0, "color": "#00000000"}));
gradient.stops = stops;
2020-10-10 17:59:22 +03:00
}
2020-10-10 14:01:56 +03:00
anchors.horizontalCenter: effect.horizontalCenter
anchors.bottom: effect.bottom
2021-08-06 20:44:51 +03:00
anchors.bottomMargin: -1*(effect.width-width)/2
2020-10-10 17:59:22 +03:00
}
2020-10-10 14:01:56 +03:00
}