Animated Background prezo...

2 files changed, 130 insertions, 0 deletions

diff --git a/examples/animatedbackground/SlideDeck.qml b/examples/animatedbackground/SlideDeck.qml
new file mode 100644
index 0000000..45fb163
--- /dev/null
+++ b/examples/animatedbackground/SlideDeck.qml
@@ -0,0 +1,67 @@
+import QtQuick 2.0
+import Prezo 1.0
+
+Presentation {
+    width: 640
+    height: 360
+
+    Rectangle {
+        anchors.fill: parent
+        gradient: Gradient {
+            GradientStop { position: 0; color: "lightsteelblue" }
+            GradientStop { position: 1; color: "black" }
+        }
+    }
+
+    Rectangle {
+        id: colorTableItem
+        width: 16
+        height: 16
+        anchors.fill: parent
+
+        property color color1: "white"
+        property color color2: "white"
+
+        gradient: Gradient {
+            GradientStop { position: 0; color: colorTableItem.color1 }
+            GradientStop { position: 0.2; color: "transparent" }
+            GradientStop { position: 0.8; color: "transparent" }
+            GradientStop { position: 1; color: colorTableItem.color2 }
+        }
+
+        visible: false
+    }
+
+    ShaderEffectSource {
+        id: colorTableSource
+        sourceItem: colorTableItem
+        smooth: true
+    }
+
+    Swirl {
+        anchors.bottom: parent.bottom
+        anchors.bottomMargin: 50
+        height: parent.height / 4
+        opacity: 0.3
+        colorTable: colorTableSource
+    }
+    Swirl {
+        anchors.bottom: parent.bottom
+        anchors.bottomMargin: 100
+        height: parent.height / 4
+        opacity: 0.3
+        colorTable: colorTableSource
+    }
+
+    property color textColor: "white"
+
+    Slide {
+        centeredText: "Animated Backgrounds"
+        fontScale: 2
+    }
+
+    Slide {
+        centeredText: "Just create what ever you want in the background, like shaders or rotating boxes and then put your Slide{} elements on top.."
+    }
+
+}
diff --git a/examples/animatedbackground/Swirl.qml b/examples/animatedbackground/Swirl.qml
new file mode 100644
index 0000000..2c6f32e
--- /dev/null
+++ b/examples/animatedbackground/Swirl.qml
@@ -0,0 +1,63 @@
+   import QtQuick 2.0
+
+ShaderEffectItem {
+    id: shader
+
+    width: parent.width
+    height: 100
+
+    property color d: Qt.rgba(Math.random() * 0.7,
+                              Math.random() * 0.5,
+                              Math.random() * 0.7,
+                              Math.random() * 0.5)
+    property real tx
+    NumberAnimation on tx { from: 0; to: Math.PI * 2; duration: (Math.random() * 30 + 30) * 1000; loops: Animation.Infinite }
+    property real ty
+    NumberAnimation on ty { from: 0; to: Math.PI * 2; duration: (Math.random() * 30 + 30) * 1000; loops: Animation.Infinite }
+    property real tz
+    NumberAnimation on tz { from: 0; to: Math.PI * 2; duration: (Math.random() * 30 + 30) * 1000; loops: Animation.Infinite }
+    property real tw
+    NumberAnimation on tw { from: 0; to: Math.PI * 2; duration: (Math.random() * 30 + 30) * 1000; loops: Animation.Infinite }
+
+    property real amplitude: height / 2
+
+    property variant colorTable
+
+    fragmentShader: "
+    uniform lowp float qt_Opacity;
+    uniform lowp sampler2D colorTable;
+    varying highp vec2 qt_TexCoord0;
+
+    void main() {
+        gl_FragColor = texture2D(colorTable, qt_TexCoord0) * qt_Opacity;
+    }
+    "
+
+    vertexShader: "
+    uniform lowp vec4 d;
+    uniform highp float tx;
+    uniform highp float ty;
+    uniform highp float tz;
+    uniform highp float tw;
+    uniform highp float amplitude;
+    uniform highp mat4 qt_ModelViewProjectionMatrix;
+    attribute highp vec4 qt_Vertex;
+    attribute highp vec2 qt_MultiTexCoord0;
+    varying highp vec2 qt_TexCoord0;
+
+    void main() {
+        highp vec4 pos = qt_Vertex;
+
+        highp float y1 = sin(tx + d.x * qt_MultiTexCoord0.x * 17. + 2. * d.y) + sin(ty + d.z * qt_MultiTexCoord0.x * 11. + 5. * d.w);
+        highp float y2 = sin(tz + d.w * qt_MultiTexCoord0.x * 7. + 3. * d.z) + sin(tw + d.y * qt_MultiTexCoord0.x * 19. + 3. * d.x);
+
+        pos.y += mix(y1, y2, qt_MultiTexCoord0.y) * amplitude * 0.5;
+
+        gl_Position = qt_ModelViewProjectionMatrix * pos;
+        qt_TexCoord0 = qt_MultiTexCoord0;
+    }
+    "
+
+    mesh: GridMesh { resolution: Qt.size(width / 10, 4) }
+
+}