|
1 /**************************************************************************** |
|
2 ** |
|
3 ** Copyright (C) 2010 Nokia Corporation and/or its subsidiary(-ies). |
|
4 ** All rights reserved. |
|
5 ** Contact: Nokia Corporation (qt-info@nokia.com) |
|
6 ** |
|
7 ** This file is part of the QtDeclarative module of the Qt Toolkit. |
|
8 ** |
|
9 ** $QT_BEGIN_LICENSE:BSD$ |
|
10 ** You may use this file under the terms of the BSD license as follows: |
|
11 ** |
|
12 ** "Redistribution and use in source and binary forms, with or without |
|
13 ** modification, are permitted provided that the following conditions are |
|
14 ** met: |
|
15 ** * Redistributions of source code must retain the above copyright |
|
16 ** notice, this list of conditions and the following disclaimer. |
|
17 ** * Redistributions in binary form must reproduce the above copyright |
|
18 ** notice, this list of conditions and the following disclaimer in |
|
19 ** the documentation and/or other materials provided with the |
|
20 ** distribution. |
|
21 ** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor |
|
22 ** the names of its contributors may be used to endorse or promote |
|
23 ** products derived from this software without specific prior written |
|
24 ** permission. |
|
25 ** |
|
26 ** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS |
|
27 ** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT |
|
28 ** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR |
|
29 ** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT |
|
30 ** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, |
|
31 ** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT |
|
32 ** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, |
|
33 ** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY |
|
34 ** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT |
|
35 ** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE |
|
36 ** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." |
|
37 ** $QT_END_LICENSE$ |
|
38 ** |
|
39 ****************************************************************************/ |
|
40 import Qt 4.7 |
|
41 import "content" |
|
42 |
|
43 // This example shows how items can be dynamically added to and removed from |
|
44 // a ListModel, and how these list modifications can be animated. |
|
45 |
|
46 Rectangle { |
|
47 id: container |
|
48 width: 500; height: 400 |
|
49 color: "#343434" |
|
50 |
|
51 // The model: |
|
52 ListModel { |
|
53 id: fruitModel |
|
54 |
|
55 ListElement { |
|
56 name: "Apple"; cost: 2.45 |
|
57 attributes: [ |
|
58 ListElement { description: "Core" }, |
|
59 ListElement { description: "Deciduous" } |
|
60 ] |
|
61 } |
|
62 ListElement { |
|
63 name: "Banana"; cost: 1.95 |
|
64 attributes: [ |
|
65 ListElement { description: "Tropical" }, |
|
66 ListElement { description: "Seedless" } |
|
67 ] |
|
68 } |
|
69 ListElement { |
|
70 name: "Cumquat"; cost: 3.25 |
|
71 attributes: [ |
|
72 ListElement { description: "Citrus" } |
|
73 ] |
|
74 } |
|
75 ListElement { |
|
76 name: "Durian"; cost: 9.95 |
|
77 attributes: [ |
|
78 ListElement { description: "Tropical" }, |
|
79 ListElement { description: "Smelly" } |
|
80 ] |
|
81 } |
|
82 } |
|
83 |
|
84 // The delegate for each fruit in the model: |
|
85 Component { |
|
86 id: listDelegate |
|
87 |
|
88 Item { |
|
89 id: delegateItem |
|
90 width: listView.width; height: 55 |
|
91 clip: true |
|
92 |
|
93 Row { |
|
94 anchors.verticalCenter: parent.verticalCenter |
|
95 spacing: 10 |
|
96 |
|
97 Column { |
|
98 Image { |
|
99 source: "content/pics/arrow-up.png" |
|
100 MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index-1, 1) } |
|
101 } |
|
102 Image { source: "content/pics/arrow-down.png" |
|
103 MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index+1, 1) } |
|
104 } |
|
105 } |
|
106 |
|
107 Column { |
|
108 anchors.verticalCenter: parent.verticalCenter |
|
109 |
|
110 Text { |
|
111 text: name |
|
112 font.pixelSize: 15 |
|
113 color: "white" |
|
114 } |
|
115 Row { |
|
116 spacing: 5 |
|
117 Repeater { |
|
118 model: attributes |
|
119 Text { text: description; color: "White" } |
|
120 } |
|
121 } |
|
122 } |
|
123 } |
|
124 |
|
125 Row { |
|
126 anchors.verticalCenter: parent.verticalCenter |
|
127 anchors.right: parent.right |
|
128 spacing: 10 |
|
129 |
|
130 PressAndHoldButton { |
|
131 anchors.verticalCenter: parent.verticalCenter |
|
132 source: "content/pics/plus-sign.png" |
|
133 onClicked: fruitModel.setProperty(index, "cost", cost + 0.25) |
|
134 } |
|
135 |
|
136 Text { |
|
137 id: costText |
|
138 anchors.verticalCenter: parent.verticalCenter |
|
139 text: '$' + Number(cost).toFixed(2) |
|
140 font.pixelSize: 15 |
|
141 color: "white" |
|
142 font.bold: true |
|
143 } |
|
144 |
|
145 PressAndHoldButton { |
|
146 anchors.verticalCenter: parent.verticalCenter |
|
147 source: "content/pics/minus-sign.png" |
|
148 onClicked: fruitModel.setProperty(index, "cost", Math.max(0,cost-0.25)) |
|
149 } |
|
150 |
|
151 Image { |
|
152 source: "content/pics/list-delete.png" |
|
153 MouseArea { anchors.fill:parent; onClicked: fruitModel.remove(index) } |
|
154 } |
|
155 } |
|
156 |
|
157 // Animate adding and removing of items: |
|
158 |
|
159 ListView.onAdd: SequentialAnimation { |
|
160 PropertyAction { target: delegateItem; property: "height"; value: 0 } |
|
161 NumberAnimation { target: delegateItem; property: "height"; to: 55; duration: 250; easing.type: Easing.InOutQuad } |
|
162 } |
|
163 |
|
164 ListView.onRemove: SequentialAnimation { |
|
165 PropertyAction { target: delegateItem; property: "ListView.delayRemove"; value: true } |
|
166 NumberAnimation { target: delegateItem; property: "height"; to: 0; duration: 250; easing.type: Easing.InOutQuad } |
|
167 |
|
168 // Make sure delayRemove is set back to false so that the item can be destroyed |
|
169 PropertyAction { target: delegateItem; property: "ListView.delayRemove"; value: false } |
|
170 } |
|
171 } |
|
172 } |
|
173 |
|
174 // The view: |
|
175 ListView { |
|
176 id: listView |
|
177 anchors.fill: parent; anchors.margins: 20 |
|
178 model: fruitModel |
|
179 delegate: listDelegate |
|
180 } |
|
181 |
|
182 Row { |
|
183 anchors { left: parent.left; bottom: parent.bottom; margins: 20 } |
|
184 spacing: 10 |
|
185 |
|
186 TextButton { |
|
187 text: "Add an item" |
|
188 onClicked: { |
|
189 fruitModel.append({ |
|
190 "name": "Pizza Margarita", |
|
191 "cost": 5.95, |
|
192 "attributes": [{"description": "Cheese"}, {"description": "Tomato"}] |
|
193 }) |
|
194 } |
|
195 } |
|
196 |
|
197 TextButton { |
|
198 text: "Remove all items" |
|
199 onClicked: fruitModel.clear() |
|
200 } |
|
201 } |
|
202 } |
|
203 |