Add more features for the demo app

Add a common cursor indicator item that all navigable items may
use for visualizing the cursor.
Add a cursor navigable delegate.
Make lists more generic by adding a CNItemDelegate.
Add CNFlipButton that has flipping animations when used with
CursorNavigation. Update Page4 with the new button type.

1 files changed, 3 insertions, 58 deletions

diff --git a/DemoApplication/controls/CNListView.qml b/DemoApplication/controls/CNListView.qml
index 7458231..ed4ff45 100644
--- a/DemoApplication/controls/CNListView.qml
+++ b/DemoApplication/controls/CNListView.qml
@@ -4,8 +4,9 @@ import CursorNavigation 1.0
 
 ListView {
     id: listView
-    spacing: 4
-    focus: true
+
+    //use CNItemDelegate as the delegate!
+
     /* when list view scopes the cursor, the cursor is passed further to its
      * currently focused child. this means, moving from outside to the list,
      * will return the cursor to the item that was previously selected
@@ -13,60 +14,4 @@ ListView {
      */
     CursorNavigation.acceptsCursor: true
 
-    Rectangle {
-        anchors.fill: parent
-        border.width: 1
-        border.color: listView.activeFocus ? "red" : "black"
-        color: "transparent"
-    }
-
-    highlight: Rectangle {
-        width: listView.width
-        height: 40
-        color: "lightgrey"
-        opacity: 0.3
-    }
-
-    delegate: ItemDelegate {
-        id: deleg
-        width: listView.width
-        height: 40
-        CursorNavigation.acceptsCursor: true
-
-        //make sure the list's current index follows the cursor!
-        CursorNavigation.onHasCursorChanged: {
-            if (CursorNavigation.hasCursor)
-                listView.currentIndex = index
-        }
-
-        contentItem: Rectangle {
-            width: listView.width
-            height: 40
-            border.color: deleg.CursorNavigation.hasCursor ? "red" : "transparent"
-
-            Row {
-                width: (parent.width - x)
-                height: 35
-                x: 5
-                anchors.verticalCenter: parent.verticalCenter
-                spacing: 10
-                Rectangle {
-                    width: parent.height
-                    height: parent.height
-                    radius: width/2
-                    color: colorCode
-                }
-                Text {
-                    height: parent.height
-                    font.bold: true
-                    verticalAlignment: Text.AlignVCenter
-                    text: name
-                }
-            }
-        }
-        onClicked: {
-            listView.currentIndex = index;
-        }
-    }
-
 }