moment/src/gui/Base/HCircleProgressBar.qml

77 lines
2.1 KiB
QML
Raw Normal View History

2019-12-19 22:46:16 +11:00
// SPDX-License-Identifier: LGPL-3.0-or-later
2019-11-07 04:49:48 +11:00
import QtQuick 2.12
2020-05-22 09:54:35 +10:00
import QtQuick.Shapes 1.12
2019-11-07 04:49:48 +11:00
2020-05-22 09:54:35 +10:00
Item {
2019-12-05 00:08:38 +11:00
implicitWidth: 96 * (theme ? theme.uiScale : 1)
2019-11-07 06:30:51 +11:00
implicitHeight: implicitWidth
2019-11-07 04:49:48 +11:00
2020-05-22 09:54:35 +10:00
layer.enabled: true
layer.samples: 4
layer.smooth: true
2019-11-07 04:49:48 +11:00
2020-05-22 09:54:35 +10:00
property real progress: 0 // 0-1
2019-11-07 04:49:48 +11:00
2020-05-22 09:54:35 +10:00
readonly property alias baseCircle: baseCircle
readonly property alias progressCircle: progressCircle
readonly property alias label: label
2019-11-07 04:49:48 +11:00
2020-05-22 09:54:35 +10:00
HLabel {
id: label
anchors.centerIn: parent
text: progressNumber + "%"
font.pixelSize: theme ? theme.fontSize.big : 22
2019-11-07 04:49:48 +11:00
2020-05-22 09:54:35 +10:00
property int progressNumber: Math.floor(progress * 100)
2019-11-07 04:49:48 +11:00
2020-05-22 09:54:35 +10:00
Behavior on progressNumber { HNumberAnimation { factor: 2 } }
2019-11-07 04:49:48 +11:00
}
2020-05-22 09:54:35 +10:00
Shape {
id: shape
anchors.fill: parent
asynchronous: true
ShapePath {
id: baseCircle
fillColor: "transparent"
strokeColor: theme.controls.circleProgressBar.background
strokeWidth: theme.controls.circleProgressBar.thickness
capStyle: ShapePath.RoundCap
startX: shape.width / 2
startY: strokeWidth
PathAngleArc {
centerX: shape.width / 2
centerY: shape.height / 2
radiusX: shape.width / 2 - baseCircle.strokeWidth
radiusY: shape.height / 2 - baseCircle.strokeWidth
sweepAngle: 360
}
}
ShapePath {
id: progressCircle
fillColor: baseCircle.fillColor
strokeColor: theme.controls.circleProgressBar.foreground
strokeWidth: baseCircle.strokeWidth
PathAngleArc {
centerX: shape.width / 2
centerY: shape.height / 2
radiusX: shape.width / 2 - progressCircle.strokeWidth
radiusY: shape.height / 2 - progressCircle.strokeWidth
startAngle: 270
sweepAngle: progress * 360
Behavior on startAngle { HNumberAnimation {} }
Behavior on sweepAngle { HNumberAnimation {} }
}
}
2019-11-07 04:49:48 +11:00
}
}