Commit 52a1b455 authored by Thomas Hartmann's avatar Thomas Hartmann
Browse files

Adding EffectDemo

parent ecbe304d
import QtQuick 2.12
import QtQuick.Studio.Components 1.0
import QtQuick.Timeline 1.0
import QtQuick.Studio.Effects 1.0
import QtQuick.Studio.LogicHelper 1.0
Item {
id: item2
width: 412
height: 452
property alias value: rangeMapper.input
Item {
id: item1
x: 0
y: 48
width: 399
height: 395
layer.enabled: true
Image {
id: needle
x: 202
y: 6
source: "needle.png"
fillMode: Image.PreserveAspectFit
}
layer.effect: OpacityMaskEffect {
id: opacityMask
x: 202
y: 6
invert: false
maskSource: arc
}
}
ArcItem {
id: arc
x: 0
y: 48
width: 399
height: 395
visible: false
begin: rangeMapper.output
strokeWidth: 26
end: 110
strokeColor: "#ffffff"
fillColor: "#00000000"
}
RangeMapper {
id: rangeMapper
inputMinimum: -20
outputMaximum: 110
}
}
/* File generated by Qt Creator */
import QmlProject 1.1
Project {
mainFile: "Screen01.ui.qml"
/* Include .qml, .js, and image files from current directory and subdirectories */
QmlFiles {
directory: "."
}
JavaScriptFiles {
directory: "."
}
ImageFiles {
directory: "."
}
Files {
filter: "*.conf"
files: ["qtquickcontrols2.conf"]
}
Files {
filter: "qmldir"
directory: "."
}
Files {
filter: "*.ttf;*.otf"
}
Environment {
QT_QUICK_CONTROLS_CONF: "qtquickcontrols2.conf"
QT_AUTO_SCREEN_SCALE_FACTOR: "1"
QMLSCENE_CORE_PROFILE: "true"
}
/* List of plugin directories passed to QML runtime */
importPaths: [ "imports", "asset_imports" ]
/* Required for deployment */
targetDirectory: "/opt/Demo3D"
}
import QtQuick 2.12
import QtQuick.Studio.Components 1.0
import QtQuick.Shapes 1.0
import QtQuick.Studio.Effects 1.0
import QtQuick.Timeline 1.0
import QtQuick.Studio.LogicHelper 1.0
Rectangle {
width: 400
height: 400
color: "#000000"
GroupItem {
x: 51
y: 54
layer.effect: GaussianBlurEffect {
id: gaussianBlur
radius: rectangle.width
samples: 20
}
layer.enabled: true
Item {
id: item2
width: 320
height: 320
layer.enabled: true
layer.effect: OpacityMaskEffect {
id: opacityMask
maskSource: mask
}
PieItem {
id: pie
x: 5
y: 5
width: 315
height: 315
layer.enabled: true
gradient: ConicalGradient {
centerY: 160
centerX: 160
GradientStop {
position: 0
color: "#87d080"
}
GradientStop {
position: 0.23974
color: "#3cd62d"
}
GradientStop {
position: 0.88553
color: "#30000000"
}
angle: -90
GradientStop {
position: 1.00648
color: "#00000000"
}
}
end: 360
strokeColor: "#00000000"
}
}
Item {
id: mask
width: 320
height: 320
visible: true
ArcItem {
id: arc
width: 320
height: 320
end: 66
strokeColor: "#ffffff"
begin: -176
strokeWidth: 60
fillColor: "#00000000"
}
ArcItem {
id: arc1
x: 40
y: 45
width: 241
height: 230
end: arc.end
strokeColor: "#8d1c1c1c"
begin: -174
strokeWidth: 40
fillColor: "#00000000"
}
}
Rectangle {
id: rectangle
width: 10
height: 200
visible: false
color: "#ffffff"
}
}
Timeline {
id: timeline
animations: [
TimelineAnimation {
id: timelineAnimation
pingPong: true
loops: -1
duration: 4000
running: true
to: 1000
from: 0
}
]
startFrame: 0
endFrame: 1000
enabled: true
KeyframeGroup {
target: arc
property: "end"
Keyframe {
value: -120
frame: 0
}
Keyframe {
value: 120
frame: 1000
}
}
KeyframeGroup {
target: rectangle
property: "width"
Keyframe {
value: 2
frame: 0
}
Keyframe {
value: 18
frame: 1000
}
}
KeyframeGroup {
target: rot
property: "rotation"
Keyframe {
value: 119
frame: 1000
}
Keyframe {
value: -120
frame: 0
}
}
KeyframeGroup {
target: mask
property: "visible"
Keyframe {
value: false
frame: 0
}
}
KeyframeGroup {
target: arc2
property: "strokeColor"
Keyframe {
value: "#081e0b"
frame: 0
}
Keyframe {
value: "#0b2c0f"
frame: 1000
}
}
KeyframeGroup {
target: text2
property: "value"
Keyframe {
frame: 0
value: 10
}
Keyframe {
frame: 66
value: 0
}
}
KeyframeGroup {
target: text3
property: "value"
Keyframe {
frame: 117
value: 10
}
Keyframe {
frame: 183
value: 0
}
Keyframe {
frame: 66
value: 0
}
}
KeyframeGroup {
target: text4
property: "value"
Keyframe {
frame: 229
value: 10
}
Keyframe {
frame: 295
value: 0
}
Keyframe {
frame: 178
value: 0
}
}
KeyframeGroup {
target: text5
property: "value"
Keyframe {
frame: 346
value: 10
}
Keyframe {
frame: 412
value: 0
}
Keyframe {
frame: 295
value: 0
}
}
KeyframeGroup {
target: text6
property: "value"
Keyframe {
frame: 508
value: 10
}
Keyframe {
frame: 562
value: 0
}
Keyframe {
frame: 432
value: 0
}
}
KeyframeGroup {
target: text7
property: "value"
Keyframe {
frame: 632
value: 10
}
Keyframe {
frame: 698
value: 0
}
Keyframe {
frame: 569
value: 0
}
}
KeyframeGroup {
target: text8
property: "value"
Keyframe {
frame: 766
value: 10
}
Keyframe {
frame: 805
value: 0
}
Keyframe {
frame: 700
value: 0
}
}
KeyframeGroup {
target: text9
property: "value"
Keyframe {
frame: 870
value: 10
}
Keyframe {
frame: 911
value: 0
}
Keyframe {
frame: 807
value: 0
}
}
KeyframeGroup {
target: text10
property: "value"
Keyframe {
frame: 1000
value: 10
}
Keyframe {
frame: 920
value: 0
}
}
}
Rectangle {
id: rectangle1
x: 56
y: 60
width: 314
height: 313
color: "#00000000"
radius: 157
border.color: "#ffffff"
}
Rectangle {
id: rectangle3
x: 128
y: 136
width: 170
height: 170
color: "#000000"
radius: 85
}
PieItem {
id: rectangle2
x: 128
y: 132
width: 170
height: 170
antialiasing: true
fillColor: "#000000"
strokeColor: "#ffffff"
strokeWidth: 1
begin: -90
hideLine: true
}
ArcItem {
id: arc2
x: 173
y: 181
width: 80
height: 80
end: 359.9
strokeColor: "#0b2c0f"
fillColor: "#00000000"
}
ArcItem {
id: arc3
x: 183
y: 191
width: 60
height: 60
begin: -160
fillColor: "#00000000"
end: 30
strokeColor: "#0b2c0f"
}
Text {
id: text1
x: 175
y: 207
width: 78
height: 44
color: "#ffffff"
text: stringMapper.text
font.pixelSize: 24
horizontalAlignment: Text.AlignHCenter
font.family: "Verdana"
StringMapper {
id: stringMapper
input: rangeMapper.value
decimals: 0
}
RangeMapper {
id: rangeMapper
outputMaximum: 160
inputMaximum: 1000
input: timeline.currentFrame
}
}
GroupItem {
x: 51
y: 65
Rectangle {
id: tick01
x: 5
y: 156
width: 10
height: 1
color: "#ffffff"
}
Rectangle {
id: tick1
x: 24
y: 222
width: 10
height: 1
color: "#ffffff"
rotation: -26.704
}
Rectangle {
id: tick2
x: 20
y: 86
width: 10
height: 1
color: "#ffffff"
rotation: -331.74
}
Rectangle {
id: tick3
x: 68
y: 29
width: 10
height: 1
color: "#ffffff"
rotation: -304.254
}
Rectangle {
id: tick4
x: 158
y: 0
width: 10
height: 1
color: "#ffffff"
rotation: 90
}
Rectangle {
id: tick5
x: 246
y: 28
width: 10
height: 1
color: "#ffffff"
rotation: -230.142
}
Rectangle {
id: tick6
x: 294
y: 87
width: 10
height: 1
color: "#ffffff"
rotation: -27.702
}
Rectangle {
id: tick7
x: 309
y: 151
width: 10
height: 1
color: "#ffffff"
}
Rectangle {