summaryrefslogtreecommitdiffstats
path: root/basicsuite/qt5-everywhere/HelpScreen.qml
diff options
context:
space:
mode:
Diffstat (limited to 'basicsuite/qt5-everywhere/HelpScreen.qml')
-rw-r--r--basicsuite/qt5-everywhere/HelpScreen.qml329
1 files changed, 329 insertions, 0 deletions
diff --git a/basicsuite/qt5-everywhere/HelpScreen.qml b/basicsuite/qt5-everywhere/HelpScreen.qml
new file mode 100644
index 0000000..3f5980f
--- /dev/null
+++ b/basicsuite/qt5-everywhere/HelpScreen.qml
@@ -0,0 +1,329 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/legal
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+** * Redistributions of source code must retain the above copyright
+** notice, this list of conditions and the following disclaimer.
+** * Redistributions in binary form must reproduce the above copyright
+** notice, this list of conditions and the following disclaimer in
+** the documentation and/or other materials provided with the
+** distribution.
+** * Neither the name of Digia Plc and its Subsidiary(-ies) nor the names
+** of its contributors may be used to endorse or promote products derived
+** from this software without specific prior written permission.
+**
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import "style.js" as Style
+
+Item {
+ id: root
+ anchors.fill:parent
+ property int delay: 500
+ property int rotationAngle:0
+
+ SequentialAnimation {
+ id: closeAnimation
+
+ ScriptAction{
+ script: {
+ pointer.visible = false
+ instructionText.text = ""
+ instructionText2.text = ""
+ highlightImage.smooth = false
+ highlight.size = Math.max(root.height, root.width)*2.5
+ }
+ }
+
+ PauseAnimation { duration: root.delay }
+
+ onRunningChanged: if (!running){
+ stopAnimations()
+ root.visible=false
+ highlight.size=0
+ highlightImage.smooth = true
+ }
+ }
+
+
+ Item{
+ id: highlight
+ property int size: 0
+ property bool hidden: false
+ width:1
+ height:1
+ Behavior on x {NumberAnimation{duration: root.delay}}
+ Behavior on y {NumberAnimation{duration: root.delay}}
+ Behavior on size {id: sizeBehavior; NumberAnimation{duration: root.delay}}
+ }
+
+ Image{
+ id: highlightImage
+ anchors.centerIn: highlight
+ width: highlight.hidden? 0: highlight.size
+ height: highlight.hidden? 0: highlight.size
+ source: "images/highlight_mask.png"
+ opacity: .8
+ smooth: true
+ }
+
+ Rectangle{
+ id: top
+ anchors {left:parent.left; top: parent.top; right: parent.right; bottom: highlightImage.top}
+ color: "black"
+ opacity: .8
+ }
+
+ Rectangle{
+ id: bottom
+ anchors {left:parent.left; top: highlightImage.bottom; right: parent.right; bottom: parent.bottom}
+ color: "black"
+ opacity: .8
+ }
+
+ Rectangle{
+ id: left
+ anchors {left:parent.left; top: highlightImage.top; right: highlightImage.left; bottom: highlightImage.bottom}
+ color: "black"
+ opacity: .8
+ }
+
+ Rectangle{
+ id: right
+ anchors {left:highlightImage.right; top: highlightImage.top; right: parent.right; bottom: highlightImage.bottom}
+ color: "black"
+ opacity: .8
+ }
+
+ Text{
+ id: instructionText
+ anchors {horizontalCenter: parent.horizontalCenter; top: parent.top; topMargin: parent.height*.05}
+ text: ""
+ font.pixelSize: parent.width*.075
+ font.family: Style.FONT_FAMILY
+ smooth: true
+ color: "white"
+
+ Text{
+ id: instructionText2
+ anchors {horizontalCenter: parent.horizontalCenter; top: parent.bottom; topMargin: -parent.height/2}
+ text: ""
+ font.pixelSize: parent.font.pixelSize
+ font.family: Style.FONT_FAMILY
+ smooth: true
+ color: "white"
+ }
+ }
+
+ Item{
+ id: pointer
+ width: parent.width*.3
+ height: parent.width*.3
+
+ Image{
+ id: handImage
+ width: parent.width*.8
+ height: width
+ source: "images/hand.png"
+ y: parent.height/2-height/2
+ x: parent.width/2-width/2+deltaX
+ property int deltaX:0
+ anchors.verticalCenter: parent.verticalCenter
+ rotation: 90
+
+ SequentialAnimation{
+ id: pointingAnimation
+ PauseAnimation { duration: root.delay}
+ NumberAnimation{
+ target: handImage
+ property: "deltaX"
+ from: -handImage.width*.2
+ to: handImage.width*.2
+ duration: 500
+ easing.type: Easing.InOutCubic
+ }
+ PauseAnimation { duration: 200 }
+ NumberAnimation{
+ target: handImage
+ property: "deltaX"
+ from: handImage.width*.2
+ to: -handImage.width*.2
+ duration: 500
+ easing.type: Easing.InOutCubic
+
+ }
+ }
+
+ }
+ }
+
+ SequentialAnimation {
+ id: helpAnimation
+ loops: Animation.Infinite
+
+ PauseAnimation { duration: 1000 }
+ PropertyAction { target: handImage; property: "mirror"; value: true}
+ PropertyAction { target: instructionText; property: "text"; value: "Tap on the devices to"}
+ PropertyAction { target: instructionText2; property: "text"; value: "open applications"}
+ PropertyAction { target: pointer; property: "visible"; value: true}
+ PropertyAction { target: highlight; property: "hidden"; value: false}
+
+ SequentialAnimation {
+ id: clickAnimation
+ property int index: 0
+ property variant uids: [8,12]
+ loops: 2
+
+ ScriptAction{
+ script: {
+ clickAnimation.index+=1
+ if (clickAnimation.index>=clickAnimation.uids.length) clickAnimation.index=0
+ }
+ }
+
+ ScriptAction{
+ script: {
+ highlight.size= (700+clickAnimation.index*100)*canvas.scalingFactor
+
+ highlight.x=root.width/2 +getPosition(clickAnimation.uids[clickAnimation.index]).x*canvas.scalingFactor
+ highlight.y=root.height/2 +getPosition(clickAnimation.uids[clickAnimation.index]).y*canvas.scalingFactor
+
+ pointer.x= root.width/2 -pointer.width/2 +getPosition(clickAnimation.uids[clickAnimation.index]).x*canvas.scalingFactor*.5
+ pointer.y= root.height/2 -pointer.height/2 +getPosition(clickAnimation.uids[clickAnimation.index]).y*canvas.scalingFactor*.5
+ pointer.rotation=Math.atan2(getPosition(clickAnimation.uids[clickAnimation.index]).y*canvas.scalingFactor, getPosition(clickAnimation.uids[clickAnimation.index]).x*canvas.scalingFactor)*180.0/Math.PI
+ pointingAnimation.restart()
+ }
+ }
+
+ PauseAnimation { duration: 3000 }
+ }
+ PauseAnimation { duration: 1000 }
+
+ SequentialAnimation{
+ id: navigationAnimation
+ PropertyAction { target: handImage; property: "mirror"; value: false}
+ PropertyAction { target: instructionText; property: "text"; value: "Use the Arrow to navigate"}
+ PropertyAction { target: instructionText2; property: "text"; value: "between applications"}
+ ScriptAction{
+ script: {
+ highlight.size= Math.min(root.width, root.height)*.4
+
+ var _x=0;
+ var _y=0;
+
+ if (root.width > root.height){
+ _x = navigationPanel.x+navigationPanel.width /2
+ _y = navigationPanel.y+navigationPanel.height*.33
+ pointer.x= root.width/2 -pointer.width/2 +root.width*.2
+ pointer.y= root.height/2 -pointer.height/2
+ highlight.x=_x
+ highlight.y=_y
+
+ }else{
+ _x=navigationPanel.x+navigationPanel.width*.33
+ _y=navigationPanel.y + navigationPanel.height /2
+ pointer.x= root.width/2 -pointer.width/2
+ pointer.y= root.height/2 -pointer.height/2 +root.height*.2
+ highlight.x=_x
+ highlight.y=_y
+ }
+
+ pointer.rotation=Math.atan2(_y-(pointer.y+pointer.height/2), _x-(pointer.x+pointer.width/2))*180.0/Math.PI
+
+ pointingAnimation.restart()
+ }
+ }
+ PauseAnimation { duration: 5000 }
+
+ PropertyAction { target: instructionText; property: "text"; value: "Use the Home button to"}
+ PropertyAction { target: instructionText2; property: "text"; value: "return to the beginning"}
+ ScriptAction{
+ script: {
+ highlight.size= Math.min(root.width, root.height)*.3
+
+ var _x=0;
+ var _y=0;
+
+ if (root.width > root.height){
+ _x = navigationPanel.x+navigationPanel.width /2
+ _y = navigationPanel.y+navigationPanel.height-navigationPanel.width /2
+ pointer.x= root.width/2 -pointer.width/2 +root.width*.2
+ pointer.y= root.height/2 -pointer.height/2
+ highlight.x=_x
+ highlight.y=_y
+
+ }else{
+ _x=navigationPanel.x+navigationPanel.width-navigationPanel.height /2
+ _y=navigationPanel.y + navigationPanel.height /2
+ pointer.x= root.width/2 -pointer.width/2
+ pointer.y= root.height/2 -pointer.height/2 +root.height*.2
+ highlight.x=_x
+ highlight.y=_y
+ }
+ pointer.rotation=Math.atan2(_y-(pointer.y+pointer.height/2), _x-(pointer.x+pointer.width/2))*180.0/Math.PI
+
+ pointingAnimation.restart()
+ }
+ }
+ PauseAnimation { duration: 5000 }
+ }
+
+ }
+
+ onWidthChanged: if (visible) show()
+ onHeightChanged: if (visible) show()
+
+ function show(){
+ highlight.hidden = true
+
+ pointer.visible = false
+ rotationAngle = 0
+
+ startAnimations()
+ visible = true
+ }
+
+ function startAnimations(){
+ pointingAnimation.restart()
+ helpAnimation.restart()
+ }
+
+ function stopAnimations(){
+ pointingAnimation.stop()
+ helpAnimation.stop()
+ }
+
+ MouseArea{
+ anchors.fill: root
+ onClicked: {
+ stopAnimations()
+ closeAnimation.restart()
+ }
+ }
+}
+