1 files changed, 28 insertions, 42 deletions

diff --git a/examples/declarative/modelviews/listview/highlightranges.qml b/examples/declarative/modelviews/listview/highlightranges.qml
index a8a95c4..162d8b7 100644
--- a/examples/declarative/modelviews/listview/highlightranges.qml
+++ b/examples/declarative/modelviews/listview/highlightranges.qml
@@ -43,46 +43,20 @@ import Qt 4.7
 Rectangle {
     width: 600; height: 300
 
-    // MyPets model is defined in dummydata/MyPetsModel.qml
-    // The viewer automatically loads files in dummydata/* to assist
-    // development without a real data source.
-    // This one contains my pets.
-
-    // Define a delegate component.  A component will be
-    // instantiated for each visible item in the list.
-    Component {
-        id: petDelegate
-        Item {
-            width: 200; height: 50
-            Column {
-                Text { text: 'Name: ' + name }
-                Text { text: 'Type: ' + type }
-                Text { text: 'Age: ' + age }
-            }
-        }
-    }
-
-    // Define a highlight component.  Just one of these will be instantiated
-    // by each ListView and placed behind the current item.
-    Component {
-        id: petHighlight
-        Rectangle { color: "#FFFF88" }
-    }
-
     // Show the model in three lists, with different highlight ranges.
     // preferredHighlightBegin and preferredHighlightEnd set the
     // range in which to attempt to maintain the highlight.
     //
-    // Note that the second and third ListView
-    // set their currentIndex to be the same as the first, and that
-    // the first ListView is given keyboard focus.
+    // The second and third ListView set their currentIndex to be the
+    // same as the first, and the first ListView is given keyboard focus.
     //
-    // The default mode allows the currentItem to move freely
-    // within the visible area.  If it would move outside the visible
-    // area, the view is scrolled to keep it visible.
+    // The first list does not set a highlight range, so its currentItem
+    // can move freely within the visible area. If it moves outside the
+    // visible area, the view is automatically scrolled to keep the current
+    // item visible.
     //
     // The second list sets a highlight range which attempts to keep the
-    // current item within the the bounds of the range, however
+    // current item within the the bounds of the range. However,
     // items will not scroll beyond the beginning or end of the view,
     // forcing the highlight to move outside the range at the ends.
     //
@@ -98,21 +72,22 @@ Rectangle {
     ListView {
         id: list1
         width: 200; height: parent.height
-        model: MyPetsModel
+        model: PetsModel {}
         delegate: petDelegate
 
-        highlight: petHighlight
+        highlight: Rectangle { color: "lightsteelblue" }
         currentIndex: list3.currentIndex
         focus: true
     }
 
     ListView {
         id: list2
-        x: 200; width: 200; height: parent.height
-        model: MyPetsModel
+        x: list1.width
+        width: 200; height: parent.height
+        model: PetsModel {}
         delegate: petDelegate
 
-        highlight: petHighlight
+        highlight: Rectangle { color: "yellow" }
         currentIndex: list1.currentIndex
         preferredHighlightBegin: 80; preferredHighlightEnd: 220
         highlightRangeMode: ListView.ApplyRange
@@ -120,14 +95,25 @@ Rectangle {
 
     ListView {
         id: list3
-        x: 400; width: 200; height: parent.height
-        model: MyPetsModel
+        x: list1.width + list2.width
+        width: 200; height: parent.height
+        model: PetsModel {}
         delegate: petDelegate
 
-        highlight: Rectangle { color: "lightsteelblue" }
+        highlight: Rectangle { color: "yellow" }
         currentIndex: list1.currentIndex
         preferredHighlightBegin: 125; preferredHighlightEnd: 125
         highlightRangeMode: ListView.StrictlyEnforceRange
-        flickDeceleration: 1000
+    }
+
+    // The delegate for each list
+    Component {
+        id: petDelegate
+        Column {
+            width: 200
+            Text { text: 'Name: ' + name }
+            Text { text: 'Type: ' + type }
+            Text { text: 'Age: ' + age }
+        }
     }
 }