Update touchinteraction examples to new guidelines

Includes adding flickable examples

Change-Id: Ie1a47882bcb8b671f162b2b778dad33ce105407b
Reviewed-by: Alan Alpert <alan.alpert@nokia.com>

examples/quick/touchinteraction/flickable/basic-flickable.qml

@@ -0,0 +1,68 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** 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 Nokia Corporation 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
+
+Rectangle {
+    width: 320
+    height: 480
+    Flickable {
+        anchors.fill: parent
+        contentWidth: 1200
+        contentHeight: 1200
+        Rectangle {
+            width: 1000
+            height: 1000
+            x: 100
+            y: 100
+            radius: 128
+            border.width: 4
+            border.color: "black"
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: "#000000" }
+                GradientStop { position: 0.2; color: "#888888" }
+                GradientStop { position: 0.4; color: "#FFFFFF" }
+                GradientStop { position: 0.6; color: "#FFFFFF" }
+                GradientStop { position: 0.8; color: "#888888" }
+                GradientStop { position: 1.0; color: "#000000" }
+            }
+        }
+    }
+}

examples/quick/touchinteraction/flickable/content/Day.qml → examples/quick/touchinteraction/flickable/content/Panel.qml

@@ -48,7 +48,7 @@ Component {
         width: ListView.view.width+40; height: ListView.view.height
 
 
-        Image { 
+        Image {
             source: "cork.jpg"
             width: page.ListView.view.width
             height: page.ListView.view.height

examples/quick/touchinteraction/flickable/corkboards.qml

@@ -42,62 +42,33 @@ import QtQuick 2.0
 import "content"
 
 Rectangle {
-    width: 800; height: 480
+    width: 320; height: 480
     color: "#464646"
 
     ListModel {
         id: list
 
         ListElement {
-            name: "Sunday"
+            name: "Panel One"
             notes: [ 
-                ListElement { noteText: "Lunch" },
-                ListElement { noteText: "Birthday Party" }
+                ListElement { noteText: "Tap to edit" },
+                ListElement { noteText: "Drag to move" },
+                ListElement { noteText: "Flick to scroll" }
             ]
         }
 
         ListElement {
-            name: "Monday"
+            name: "Panel Two"
             notes: [
-                ListElement { noteText: "Pickup kids from\nschool\n4.30pm" },
-                ListElement { noteText: "Checkout Qt" }, ListElement { noteText: "Read email" }
+                ListElement { noteText: "Note One" },
+                ListElement { noteText: "Note Two" }
             ]
         }
 
         ListElement {
-            name: "Tuesday"
+            name: "Panel Three"
             notes: [
-                ListElement { noteText: "Walk dog" },
-                ListElement { noteText: "Buy newspaper" }
-            ]
-        }
-
-        ListElement {
-            name: "Wednesday"
-            notes: [ ListElement { noteText: "Cook dinner" } ]
-        }
-
-        ListElement {
-            name: "Thursday"
-            notes: [
-                ListElement { noteText: "Meeting\n5.30pm" },
-                ListElement { noteText: "Weed garden" }
-            ]
-        }
-
-        ListElement {
-            name: "Friday"
-            notes: [
-                ListElement { noteText: "More work" },
-                ListElement { noteText: "Grocery shopping" }
-            ]
-        }
-
-        ListElement {
-            name: "Saturday"
-            notes: [
-                ListElement { noteText: "Drink" },
-                ListElement { noteText: "Download Qt\nPlay with QML" }
+                ListElement { noteText: "Note Three" }
             ]
         }
     }
@@ -111,6 +82,6 @@ Rectangle {
         orientation: ListView.Horizontal
         snapMode: ListView.SnapOneItem
         model: list
-        delegate: Day { }
+        delegate: Panel { }
     }
 }

examples/quick/touchinteraction/main.cpp

@@ -0,0 +1,41 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** 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 Nokia Corporation 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$
+**
+****************************************************************************/
+#include "../../shared/shared.h"
+DECLARATIVE_EXAMPLE_MAIN(touchinteraction)

examples/quick/touchinteraction/multipointtouch/bearwhack.qml

@@ -43,7 +43,7 @@ import "content"
 
 Item {
     id: root
-    height: 640
+    height: 480
     width: 320
     Item {
         id: startScreen

examples/quick/touchinteraction/touchinteraction.pro

@@ -0,0 +1,10 @@
+TEMPLATE = app
+
+QT += quick declarative
+SOURCES += main.cpp
+
+target.path = $$[QT_INSTALL_EXAMPLES]/qtdeclarative/quick/touchinteraction
+qml.files = flickable multipointtouch pincharea touchinteraction.qml
+qml.path = $$[QT_INSTALL_EXAMPLES]/qtdeclarative/quick/touchinteraction
+INSTALLS += target qml
+

examples/quick/touchinteraction/touchinteraction.qml

@@ -41,6 +41,25 @@
 import QtQuick 2.0
 import "../../shared"
 
+/*!
+    \title QtQuick Examples - Touch Interaction
+    \example qtquick/touchinteraction
+    \brief This is a collection of QML Touch Interaction examples.
+    \image qml-touchinteraction-example.png
+
+    This is a collection of small QML examples relating to touch interaction methods.
+
+    Multipoint Flames demonstrates distinguishing different fingers in a MultiPointTouchArea, by assignning a different colored flame to each touch point.
+
+    Bear-Whack demonstrates using a MultiPointTouchArea to add multiple finger support to a simple game.
+
+    Flick Resize uses a PinchArea to allow Pinch-to-Resize behavior.
+
+    Flickable is a simple example demonstrating the Flickable element.
+
+    Corkboards shows a more complex Flickable usecase, with elements on the flickable that respond to mouse and keyboard interaction.
+*/
+
 Item {
     height: 480
     width: 320
@@ -51,6 +70,8 @@ Item {
             addExample("Multipoint Flames", "Create multiple flames with multiple fingers", Qt.resolvedUrl("multipointtouch/multiflame.qml"));
             addExample("Bear-Whack", "Use multiple touches to knock all the bears down",  Qt.resolvedUrl("multipointtouch/bearwhack.qml"));
             addExample("Flick Resize", "Manipulate images using pinch gestures", Qt.resolvedUrl("pincharea/flickresize.qml"));
+            addExample("Flickable", "A viewport you can move with touch gestures", Qt.resolvedUrl("flickable/basic-flickable.qml"));
+            addExample("Corkboards", "Uses touch input on items inside a Flickable", Qt.resolvedUrl("flickable/corkboards.qml"));
         }
     }
 }