|
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:LGPL$ |
|
10 ** No Commercial Usage |
|
11 ** This file contains pre-release code and may not be distributed. |
|
12 ** You may use this file in accordance with the terms and conditions |
|
13 ** contained in the Technology Preview License Agreement accompanying |
|
14 ** this package. |
|
15 ** |
|
16 ** GNU Lesser General Public License Usage |
|
17 ** Alternatively, this file may be used under the terms of the GNU Lesser |
|
18 ** General Public License version 2.1 as published by the Free Software |
|
19 ** Foundation and appearing in the file LICENSE.LGPL included in the |
|
20 ** packaging of this file. Please review the following information to |
|
21 ** ensure the GNU Lesser General Public License version 2.1 requirements |
|
22 ** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html. |
|
23 ** |
|
24 ** In addition, as a special exception, Nokia gives you certain additional |
|
25 ** rights. These rights are described in the Nokia Qt LGPL Exception |
|
26 ** version 1.1, included in the file LGPL_EXCEPTION.txt in this package. |
|
27 ** |
|
28 ** If you have questions regarding the use of this file, please contact |
|
29 ** Nokia at qt-info@nokia.com. |
|
30 ** |
|
31 ** |
|
32 ** |
|
33 ** |
|
34 ** |
|
35 ** |
|
36 ** |
|
37 ** |
|
38 ** $QT_END_LICENSE$ |
|
39 ** |
|
40 ****************************************************************************/ |
|
41 |
|
42 import Qt 4.7 |
|
43 import Qt.labs.folderlistmodel 1.0 |
|
44 |
|
45 Rectangle { |
|
46 id: root |
|
47 property bool keyPressed: false |
|
48 property variant folders: folders1 |
|
49 property variant view: view1 |
|
50 width: 320 |
|
51 height: 480 |
|
52 color: palette.window |
|
53 |
|
54 FolderListModel { |
|
55 id: folders1 |
|
56 nameFilters: [ "*.qml" ] |
|
57 folder: qmlViewerFolder |
|
58 } |
|
59 FolderListModel { |
|
60 id: folders2 |
|
61 nameFilters: [ "*.qml" ] |
|
62 folder: qmlViewerFolder |
|
63 } |
|
64 |
|
65 SystemPalette { id: palette } |
|
66 |
|
67 function down(path) { |
|
68 if (folders == folders1) { |
|
69 view = view2 |
|
70 folders = folders2; |
|
71 view1.state = "exitLeft"; |
|
72 } else { |
|
73 view = view1 |
|
74 folders = folders1; |
|
75 view2.state = "exitLeft"; |
|
76 } |
|
77 view.x = root.width; |
|
78 view.state = "current"; |
|
79 view.focus = true; |
|
80 folders.folder = path; |
|
81 } |
|
82 function up() { |
|
83 var path = folders.parentFolder; |
|
84 if (folders == folders1) { |
|
85 view = view2 |
|
86 folders = folders2; |
|
87 view1.state = "exitRight"; |
|
88 } else { |
|
89 view = view1 |
|
90 folders = folders1; |
|
91 view2.state = "exitRight"; |
|
92 } |
|
93 view.x = -root.width; |
|
94 view.state = "current"; |
|
95 view.focus = true; |
|
96 folders.folder = path; |
|
97 } |
|
98 |
|
99 Component { |
|
100 id: folderDelegate |
|
101 Rectangle { |
|
102 id: wrapper |
|
103 function launch() { |
|
104 if (folders.isFolder(index)) { |
|
105 down(filePath); |
|
106 } else { |
|
107 qmlViewer.launch(filePath); |
|
108 } |
|
109 } |
|
110 width: root.width |
|
111 height: 52 |
|
112 color: "transparent" |
|
113 Rectangle { |
|
114 id: highlight; visible: false |
|
115 anchors.fill: parent |
|
116 gradient: Gradient { |
|
117 GradientStop { id: t1; position: 0.0; color: palette.highlight } |
|
118 GradientStop { id: t2; position: 1.0; color: Qt.lighter(palette.highlight) } |
|
119 } |
|
120 } |
|
121 Item { |
|
122 width: 48; height: 48 |
|
123 Image { source: "images/folder.png"; anchors.centerIn: parent; visible: folders.isFolder(index)} |
|
124 } |
|
125 Text { |
|
126 id: nameText |
|
127 anchors.fill: parent; verticalAlignment: Text.AlignVCenter |
|
128 text: fileName |
|
129 anchors.leftMargin: 54 |
|
130 font.pixelSize: 32 |
|
131 color: (wrapper.ListView.isCurrentItem && root.keyPressed) ? palette.highlightedText : palette.windowText |
|
132 elide: Text.ElideRight |
|
133 } |
|
134 MouseArea { |
|
135 id: mouseRegion |
|
136 anchors.fill: parent |
|
137 onClicked: { launch() } |
|
138 } |
|
139 states: [ |
|
140 State { |
|
141 name: "pressed" |
|
142 when: mouseRegion.pressed |
|
143 PropertyChanges { target: highlight; visible: true } |
|
144 PropertyChanges { target: nameText; color: palette.highlightedText } |
|
145 } |
|
146 ] |
|
147 } |
|
148 } |
|
149 |
|
150 ListView { |
|
151 id: view1 |
|
152 anchors.top: titleBar.bottom |
|
153 anchors.bottom: parent.bottom |
|
154 x: 0 |
|
155 width: parent.width |
|
156 model: folders1 |
|
157 delegate: folderDelegate |
|
158 highlight: Rectangle { color: palette.highlight; visible: root.keyPressed && view1.count != 0 } |
|
159 highlightMoveSpeed: 1000 |
|
160 pressDelay: 100 |
|
161 focus: true |
|
162 state: "current" |
|
163 states: [ |
|
164 State { |
|
165 name: "current" |
|
166 PropertyChanges { target: view1; x: 0 } |
|
167 }, |
|
168 State { |
|
169 name: "exitLeft" |
|
170 PropertyChanges { target: view1; x: -root.width } |
|
171 }, |
|
172 State { |
|
173 name: "exitRight" |
|
174 PropertyChanges { target: view1; x: root.width } |
|
175 } |
|
176 ] |
|
177 transitions: [ |
|
178 Transition { |
|
179 to: "current" |
|
180 SequentialAnimation { |
|
181 NumberAnimation { properties: "x"; duration: 250 } |
|
182 } |
|
183 }, |
|
184 Transition { |
|
185 NumberAnimation { properties: "x"; duration: 250 } |
|
186 NumberAnimation { properties: "x"; duration: 250 } |
|
187 } |
|
188 ] |
|
189 Keys.onPressed: { root.keyPressed = true; } |
|
190 } |
|
191 |
|
192 ListView { |
|
193 id: view2 |
|
194 anchors.top: titleBar.bottom |
|
195 anchors.bottom: parent.bottom |
|
196 x: parent.width |
|
197 width: parent.width |
|
198 model: folders2 |
|
199 delegate: folderDelegate |
|
200 highlight: Rectangle { color: palette.highlight; visible: root.keyPressed && view2.count != 0 } |
|
201 highlightMoveSpeed: 1000 |
|
202 pressDelay: 100 |
|
203 states: [ |
|
204 State { |
|
205 name: "current" |
|
206 PropertyChanges { target: view2; x: 0 } |
|
207 }, |
|
208 State { |
|
209 name: "exitLeft" |
|
210 PropertyChanges { target: view2; x: -root.width } |
|
211 }, |
|
212 State { |
|
213 name: "exitRight" |
|
214 PropertyChanges { target: view2; x: root.width } |
|
215 } |
|
216 ] |
|
217 transitions: [ |
|
218 Transition { |
|
219 to: "current" |
|
220 SequentialAnimation { |
|
221 NumberAnimation { properties: "x"; duration: 250 } |
|
222 } |
|
223 }, |
|
224 Transition { |
|
225 NumberAnimation { properties: "x"; duration: 250 } |
|
226 } |
|
227 ] |
|
228 Keys.onPressed: { root.keyPressed = true; } |
|
229 } |
|
230 |
|
231 Keys.onPressed: { |
|
232 root.keyPressed = true; |
|
233 if (event.key == Qt.Key_Return || event.key == Qt.Key_Select || event.key == Qt.Key_Right) { |
|
234 view.currentItem.launch(); |
|
235 event.accepted = true; |
|
236 } else if (event.key == Qt.Key_Left) { |
|
237 up(); |
|
238 } |
|
239 } |
|
240 |
|
241 BorderImage { |
|
242 source: "images/titlebar.sci"; |
|
243 width: parent.width; |
|
244 height: 52 |
|
245 y: -7 |
|
246 id: titleBar |
|
247 |
|
248 Rectangle { |
|
249 id: upButton |
|
250 width: 48 |
|
251 height: titleBar.height - 7 |
|
252 color: "transparent" |
|
253 |
|
254 Image { anchors.centerIn: parent; source: "images/up.png" } |
|
255 MouseArea { id: upRegion; anchors.centerIn: parent |
|
256 width: 56 |
|
257 height: 56 |
|
258 onClicked: if (folders.parentFolder != "") up() |
|
259 } |
|
260 states: [ |
|
261 State { |
|
262 name: "pressed" |
|
263 when: upRegion.pressed |
|
264 PropertyChanges { target: upButton; color: palette.highlight } |
|
265 } |
|
266 ] |
|
267 } |
|
268 Rectangle { |
|
269 color: "gray" |
|
270 x: 48 |
|
271 width: 1 |
|
272 height: 44 |
|
273 } |
|
274 |
|
275 Text { |
|
276 anchors.left: upButton.right; anchors.right: parent.right; height: parent.height |
|
277 anchors.leftMargin: 4; anchors.rightMargin: 4 |
|
278 text: folders.folder |
|
279 color: "white" |
|
280 elide: Text.ElideLeft; horizontalAlignment: Text.AlignRight; verticalAlignment: Text.AlignVCenter |
|
281 font.pixelSize: 32 |
|
282 } |
|
283 } |
|
284 } |