From 8498d8076364cd3cf3952bf64d83f1a1cd2491f5 Mon Sep 17 00:00:00 2001 From: Gunnar Sletta Date: Sat, 14 May 2011 17:41:14 +0200 Subject: Updates to presentation system --- Prezo/Slide.qml | 50 +++++----- .../animatedbackground/AnimatedPresentation.qml | 79 --------------- examples/animatedbackground/SlideDeck.qml | 4 +- examples/customtransition/SlideDeck.qml | 14 +-- examples/helloprezo/CodeSection.qml | 33 +++++++ examples/helloprezo/HelloPrezo.qml | 109 +++++++++++++++++---- 6 files changed, 150 insertions(+), 139 deletions(-) delete mode 100644 examples/animatedbackground/AnimatedPresentation.qml create mode 100644 examples/helloprezo/CodeSection.qml diff --git a/Prezo/Slide.qml b/Prezo/Slide.qml index 630395b..1988d85 100644 --- a/Prezo/Slide.qml +++ b/Prezo/Slide.qml @@ -13,40 +13,36 @@ Item { property real fontScale: 1 property real baseFontSize: fontSize * fontScale - property real titleFontSize: fontSize * 1.1 * fontScale + property real titleFontSize: fontSize * 1.2 * fontScale property real bulletSpacing: 1 - property real contentX: parent.width * 0.05 - property real contentY: parent.height * 0.2 - property real contentWidth: parent.width * 0.9 - property real contentHeight: parent.height * 0.7 + // Define the slide to be the "content area" + x: parent.width * 0.05 + y: parent.height * 0.2 + width: parent.width * 0.9 + height: parent.height * 0.7 property color slideTextColor: parent.textColor != undefined ? parent.textColor : "black" - width: parent.width - height: parent.height - visible: false Text { id: titleText font.pixelSize: titleFontSize text: title; - anchors.top: parent.top - anchors.left: parent.left - anchors.right: parent.right - anchors.topMargin: parent.width * 0.01 - anchors.leftMargin: parent.width * 0.01 - anchors.rightMargin: parent.width * 0.01 + anchors.horizontalCenter: parent.horizontalCenter + anchors.bottom: parent.top + anchors.bottomMargin: parent.fontSize * 1.5 font.bold: true; color: slideTextColor + horizontalAlignment: Text.Center } Text { id: centeredId - anchors.verticalCenter: parent.verticalCenter - x: slide.contentX - width: slide.contentWidth + width: parent.width + anchors.centerIn: parent + anchors.verticalCenterOffset: - parent.y / 3 text: centeredText horizontalAlignment: Text.Center font.pixelSize: baseFontSize @@ -56,21 +52,25 @@ Item { Column { id: contentId - x: slide.contentX - y: slide.contentY - width: slide.contentHeight - height: slide.contentHeight + anchors.fill: parent Repeater { model: content.length Row { + id: row + + function decideIndentLevel(s) { return s.charAt(0) == " " ? 1 + decideIndentLevel(s.substring(1)) : 0 } + property int indentLevel: decideIndentLevel(content[index]) + property int nextIndentLevel: index < content.length - 1 ? decideIndentLevel(content[index+1]) : 0 + property real indentFactor: (10 - row.indentLevel * 2) / 10; - height: text.height + slide.baseFontSize * slide.bulletSpacing + height: text.height + (nextIndentLevel == 0 ? 1 : 0.3) * slide.baseFontSize * slide.bulletSpacing + x: 50 * indentLevel Rectangle { id: dot - y: baseFontSize / 2 + y: baseFontSize * row.indentFactor / 2 width: baseFontSize / 4 height: baseFontSize / 4 color: slide.slideTextColor @@ -88,8 +88,8 @@ Item { Text { id: text - width: slide.contentWidth - font.pixelSize: baseFontSize + width: slide.width + font.pixelSize: baseFontSize * row.indentFactor text: content[index] textFormat: Text.PlainText wrapMode: Text.WordWrap diff --git a/examples/animatedbackground/AnimatedPresentation.qml b/examples/animatedbackground/AnimatedPresentation.qml deleted file mode 100644 index 7c02544..0000000 --- a/examples/animatedbackground/AnimatedPresentation.qml +++ /dev/null @@ -1,79 +0,0 @@ -import QtQuick 2.0 -import Prezo 1.0 - -Presentation { - - id: deck - - width: 600 - height: 400 - - - property bool inTransition: false; - - property variant fromSlide; - property variant toSlide; - - property int transitionTime: 2000; - - BackgroundSwirls {} - - ShaderEffectItem { - id: effect - anchors.fill: parent - visible: deck.inTransition - property variant source: ShaderEffectSource { sourceItem: fromSlide; smooth: true } - property real ratio: 0 - property real amplitude: 0.1 * ratio - property real frequency: 20 - property real time: 0 - NumberAnimation on time { loops: Animation.Infinite; from: 0; to: Math.PI * 2; duration: 2000 } - fragmentShader: - "uniform highp float amplitude;" + - "uniform highp float frequency;" + - "uniform highp float time;" + - "uniform lowp float ratio;" + - "uniform sampler2D source;" + - "varying highp vec2 qt_TexCoord0;" + - "void main() {" + - " highp vec2 p = sin(time + frequency * qt_TexCoord0);" + - " gl_FragColor = texture2D(source, qt_TexCoord0 + amplitude * vec2(p.y, -p.x)) * (1. - ratio);" + - "}" - } - - SequentialAnimation { - id: transition - ScriptAction { script: { - deck.inTransition = true - fromSlide.opacity = 0 - toSlide.visible = true - } - } - - ParallelAnimation { - NumberAnimation { target: effect; property: "ratio"; from: 0; to: 1; duration: deck.transitionTime; } - NumberAnimation { target: toSlide; property: "opacity"; from: 0; to: 1; duration: deck.transitionTime; easing.type: Easing.InQuart } - } - - ScriptAction { script: { - deck.inTransition = false - fromSlide.visible = false - fromSlide.opacity = 0 - toSlide.opacity = 1 - } - } - } - - function switchSlides(from, to) - { - if (deck.inTransition) - return false - - deck.fromSlide = from - deck.toSlide = to - - transition.running = true; - - return true - } -} diff --git a/examples/animatedbackground/SlideDeck.qml b/examples/animatedbackground/SlideDeck.qml index 4b763cf..7f99f72 100644 --- a/examples/animatedbackground/SlideDeck.qml +++ b/examples/animatedbackground/SlideDeck.qml @@ -3,10 +3,12 @@ import Prezo 1.0 import Qt.labs.particles 2.0 -AnimatedPresentation { +Presentation { width: 640 height: 360 + BackgroundSwirls {} + property color textColor: "white" Slide { diff --git a/examples/customtransition/SlideDeck.qml b/examples/customtransition/SlideDeck.qml index 848dc29..20783cb 100644 --- a/examples/customtransition/SlideDeck.qml +++ b/examples/customtransition/SlideDeck.qml @@ -1,7 +1,7 @@ import Prezo 1.0 import QtQuick 2.0 -DissolvingPresentation +OpacityTransitionPresentation { Slide { id: slide1 @@ -31,18 +31,6 @@ DissolvingPresentation bulletSpacing: 0 } - Slide { - Image { - source: "distortion.png" - smooth: true - - x: parent.contentX - y: parent.contentY - width: parent.contentWidth - height: parent.contentHeight - } - } - Slide { title: "Slide number 3" content: [ diff --git a/examples/helloprezo/CodeSection.qml b/examples/helloprezo/CodeSection.qml new file mode 100644 index 0000000..8493b99 --- /dev/null +++ b/examples/helloprezo/CodeSection.qml @@ -0,0 +1,33 @@ +import QtQuick 2.0 + +Rectangle +{ + id: root + + property string text + property real fontSize: parent.baseFontSize / 2 + + gradient: Gradient { + GradientStop { position: 0; color: "white" } + GradientStop { position: 1; color: "darkGray" } + } + + color: "lightGray" + border.color: "darkGray" + border.width: 2 + radius: 10 + + x: parent.width / 2 + width: parent.width / 2 + height: parent.height + + Text { + id: textItem + anchors.fill: parent + anchors.margins: 20 + text: root.text; + font.family: "courier" + font.pixelSize: root.fontSize + } + +} diff --git a/examples/helloprezo/HelloPrezo.qml b/examples/helloprezo/HelloPrezo.qml index 6e56ce5..ebd2036 100644 --- a/examples/helloprezo/HelloPrezo.qml +++ b/examples/helloprezo/HelloPrezo.qml @@ -8,29 +8,86 @@ Presentation Slide { - fontScale: 2 - centeredText: "Click to walk through intro!" + centeredText: "Use [space] or [keypad] to see intro" + } + + Slide { + title: "Presentation {} Element" + content: [ + "Toplevel element", + "Defines background", + "Foreground color", + ] + + CodeSection { + text: " +import Prezo 1.0 + +Presentation +{ + width: 640 + height: 360 + + // Define a background... + // Default is white.. + Rectangle { + id: backgroundColor + anchors.fill: parent + color: \"blue\" + } + + // Set text color + property color textColor: \"white\" + + // Then define slide elements + Slide { ... } + Slide { ... } + Slide { ... } + ... +} + " + } } Slide { - id: areaSlide - title: "Title Text - Bullet points" + title: "Slide {} Element" content: [ "Bullet points", "Should be short", - "And to the point" + "And to the point", + " Sub point", + " Sub Sub point", + " Sub point" ] + + CodeSection { + + text: "Slide {\n" + + " id: areaSlide\n" + + " title: \"Slide {} Element\"\n" + + " content: [\n" + + " \"Bullet points\",\n" + + " \"Should be short\",\n" + + " \"And to the point\",\n" + + " \" Sub point\",\n" + + " \" Sub Sub point\",\n" + + " \" Sub point\"\n" + + " ]\n" + + "}\n" + } + } + + + Slide { + title: "Slide {}, continued" Rectangle { - x: areaSlide.contentX - y: areaSlide.contentY - width: areaSlide.contentWidth - height: areaSlide.contentHeight + anchors.fill: parent - color: Qt.rgba(0, 0, 0, 0.1) + color: "lightgray" Text { - text: "Dedicated content area" + text: "Slide fills this area..." anchors.centerIn: parent } } @@ -38,13 +95,20 @@ Presentation Slide { - title: "Title Text - Centered Text" - centeredText: "And this is some centered text..." + title: "Slide {}, continued" + centeredText: "Use the predefined centeredText property to put a single block of text at the center of the Slide{}" } + Slide { + title: "Slide {}, continued" + centeredText: 'Use rich text, if you like...' + } + + + Slide { - title: "Text is relative to presentation height" + title: "Font size relative to screen size" content: [ "Which means you don't need to worry about it", "Bullet points wraps around on the edges, regardless of how long they are, like this. Even if you should choose to use a very long bullet point (which would distract your audience) it would still look ok'ish", @@ -53,10 +117,6 @@ Presentation } - Slide { - centeredText: 'Use rich text, if you like...' - } - Slide { id: interactiveSlide @@ -64,10 +124,10 @@ Presentation title: "Embed Interactive Content" Rectangle { - width: parent.height / 4 + id: box + width: parent.fontSize * 10 height: width color: mouse.pressed ? "lightsteelblue" : "steelblue" - anchors.centerIn: parent NumberAnimation on rotation { from: 0; to: 360; duration: 10000; loops: Animation.Infinite; running: visible } @@ -79,13 +139,20 @@ Presentation MouseArea { id: mouse anchors.fill: parent + drag.target: box } } } Slide { - centeredText: 'Hit "Esc" to fade out the current page if there are questions from the audience' + title: "Features" + centeredText: 'Hit [esc] to fade out the current page if there are questions from the audience' + } + + Slide { + title: "Features" + centeredText: 'Navigate back and forth using [left] and [right]\n[space] or [click] takes you to the next slide.' } -- cgit v1.2.3