Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Update model view examples to common launcher format.
Change-Id: I8dc30a9ade3cbbfa91d51d85617975ad7d46ee15
Reviewed-by: Andrew den Exter <andrew.den-exter@nokia.com>
Reviewed-by: Alan Alpert <alan.alpert@nokia.com>
  • Loading branch information
Andrew den Exter authored and Qt by Nokia committed Mar 22, 2012
1 parent ee4202a commit 793a01d
Show file tree
Hide file tree
Showing 11 changed files with 235 additions and 245 deletions.
121 changes: 70 additions & 51 deletions examples/quick/modelviews/listview/dynamiclist.qml
Expand Up @@ -87,70 +87,84 @@ Rectangle {

Item {
id: delegateItem
width: listView.width; height: 55
width: listView.width; height: 100
clip: true

Row {
anchors.verticalCenter: parent.verticalCenter
spacing: 10

Column {
Image {
source: "content/pics/arrow-up.png"
MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index-1, 1) }
}
Image { source: "content/pics/arrow-down.png"
MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index+1, 1) }
}
Column {
id: arrows
anchors {
left: parent.left
verticalCenter: parent.verticalCenter
}

Column {
anchors.verticalCenter: parent.verticalCenter

Text {
text: name
font.pixelSize: 15
color: "white"
}
Row {
spacing: 5
Repeater {
model: attributes
Text { text: description; color: "White" }
}
}
Image {
source: "content/pics/arrow-up.png"
MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index-1, 1) }
}
Image { source: "content/pics/arrow-down.png"
MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index+1, 1) }
}
}

Row {
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
spacing: 10

PressAndHoldButton {
anchors.verticalCenter: parent.verticalCenter
source: "content/pics/plus-sign.png"
onClicked: fruitModel.setProperty(index, "cost", cost + 0.25)
Column {
anchors {
left: arrows.right
horizontalCenter: parent.horizontalCenter;
bottom: parent.verticalCenter
}

Text {
id: costText
anchors.verticalCenter: parent.verticalCenter
text: '$' + Number(cost).toFixed(2)
Text {
anchors.horizontalCenter: parent.horizontalCenter
text: name
font.pixelSize: 15
color: "white"
font.bold: true
}
Row {
anchors.horizontalCenter: parent.horizontalCenter
spacing: 5
Repeater {
model: attributes
Text { text: description; color: "White" }
}
}
}

PressAndHoldButton {
anchors.verticalCenter: parent.verticalCenter
source: "content/pics/minus-sign.png"
onClicked: fruitModel.setProperty(index, "cost", Math.max(0,cost-0.25))
Item {
anchors {
left: arrows.right
horizontalCenter: parent.horizontalCenter;
top: parent.verticalCenter
bottom: parent.bottom
}

Image {
source: "content/pics/list-delete.png"
MouseArea { anchors.fill:parent; onClicked: fruitModel.remove(index) }
Row {
anchors.centerIn: parent
spacing: 10

PressAndHoldButton {
anchors.verticalCenter: parent.verticalCenter
source: "content/pics/plus-sign.png"
onClicked: fruitModel.setProperty(index, "cost", cost + 0.25)
}

Text {
id: costText
anchors.verticalCenter: parent.verticalCenter
text: '$' + Number(cost).toFixed(2)
font.pixelSize: 15
color: "white"
font.bold: true
}

PressAndHoldButton {
anchors.verticalCenter: parent.verticalCenter
source: "content/pics/minus-sign.png"
onClicked: fruitModel.setProperty(index, "cost", Math.max(0,cost-0.25))
}

Image {
source: "content/pics/list-delete.png"
MouseArea { anchors.fill:parent; onClicked: fruitModel.remove(index) }
}
}
}

Expand All @@ -174,12 +188,17 @@ Rectangle {
// The view:
ListView {
id: listView
anchors.fill: parent; anchors.margins: 20
anchors {
left: parent.left; top: parent.top;
right: parent.right; bottom: buttons.top;
margins: 20
}
model: fruitModel
delegate: listDelegate
}

Row {
id: buttons
anchors { left: parent.left; bottom: parent.bottom; margins: 20 }
spacing: 10

Expand Down
4 changes: 4 additions & 0 deletions examples/quick/modelviews/listview/highlight.qml
Expand Up @@ -69,6 +69,10 @@ Rectangle {
transitions: Transition {
NumberAnimation { properties: "x"; duration: 200 }
}
MouseArea {
anchors.fill: parent
onClicked: wrapper.ListView.view.currentIndex = index
}
}
}

Expand Down
56 changes: 44 additions & 12 deletions examples/quick/modelviews/listview/highlightranges.qml
Expand Up @@ -44,7 +44,27 @@ import "content"
Rectangle {
id: root
property int current: 0
width: 600; height: 300
// Example index automation for convenience, disabled on click or tap
SequentialAnimation on current {
id: anim
loops: -1
NumberAnimation {
duration: 5000
to: aModel.count - 1
}
NumberAnimation {
duration: 5000
to: 0
}
}
MouseArea{
id: ma
z: 1
anchors.fill: parent
onClicked: {ma.enabled = false; anim.running = false;}
}

width: 320; height: 480

// This example shows the same model in three different ListView items,
// with different highlight ranges. The highlight ranges are set by the
Expand Down Expand Up @@ -72,9 +92,10 @@ Rectangle {

ListView {
id: list1
width: 200; height: parent.height
model: PetsModel {}
height: 160; width: parent.width
model: PetsModel {id: aModel}
delegate: petDelegate
orientation: ListView.Horizontal

highlight: Rectangle { color: "lightsteelblue" }
currentIndex: root.current
Expand All @@ -84,10 +105,11 @@ Rectangle {

ListView {
id: list2
x: list1.width
width: 200; height: parent.height
y: list1.height
height: 160; width: parent.width
model: PetsModel {}
delegate: petDelegate
orientation: ListView.Horizontal

highlight: Rectangle { color: "yellow" }
currentIndex: root.current
Expand All @@ -97,10 +119,11 @@ Rectangle {

ListView {
id: list3
x: list1.width + list2.width
width: 200; height: parent.height
y: list1.height + list2.height
height: 160; width: parent.width
model: PetsModel {}
delegate: petDelegate
orientation: ListView.Horizontal

highlight: Rectangle { color: "yellow" }
currentIndex: root.current
Expand All @@ -112,11 +135,20 @@ Rectangle {
// The delegate for each list
Component {
id: petDelegate
Column {
width: 200
Text { text: 'Name: ' + name }
Text { text: 'Type: ' + type }
Text { text: 'Age: ' + age }
Item {
width: 160
height: column.height
Column {
id: column
Text { text: 'Name: ' + name }
Text { text: 'Type: ' + type }
Text { text: 'Age: ' + age }
}

MouseArea {
anchors.fill: parent
onClicked: wrapper.ListView.view.currentIndex = index
}
}
}
}
41 changes: 41 additions & 0 deletions examples/quick/modelviews/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(modelviews)
20 changes: 15 additions & 5 deletions examples/quick/modelviews/modelviews.pro
@@ -1,8 +1,18 @@
TEMPLATE = subdirs
TEMPLATE = app

SUBDIRS += \
abstractitemmodel \
objectlistmodel \
stringlistmodel
QT += quick qml
SOURCES += main.cpp

target.path = $$[QT_INSTALL_EXAMPLES]/qtdeclarative/qtquick/modelviews
qml.files = \
modelviews.qml \
gridview \
listview \
package \
parallax \
pathview \
visualdatamodel \
visualitemmodel
qml.path = $$[QT_INSTALL_EXAMPLES]/qtdeclarative/qtquick/modelviews
INSTALLS += target qml

51 changes: 37 additions & 14 deletions examples/quick/modelviews/modelviews.qml
Expand Up @@ -39,26 +39,49 @@
****************************************************************************/

import QtQuick 2.0
import "../../shared"
import "../../shared" as Examples

/*!
\title QtQuick Examples - ModelViews
\example quick/modelviews
\brief This is a collection of QML drag and drop examples
\image qml-modelviews-example.png
This is a collection of small QML examples relating to model and view functionality.
GridView and PathView demonstrate usage of these elements to display views.
Dynamic List demonstrates runtime modification of a ListModel.
Expanding Delegates demonstrates delegates that expand when activated.
Highlight demonstrates adding a custom highlight to a ListView.
Highlight Ranges shows the three different highlight range modes of ListView.
Sections demonstrates the various section headers and footers available to ListView.
Packages demonstrates using Packages to transition delegates between two views.
VisualItemModel uses a VisualItemModel for the model instead of a ListModel.
*/

Item {
height: 480
width: 480
LauncherList {
width: 320
Examples.LauncherList {
id: ll
anchors.fill: parent
Component.onCompleted: {
addExample("Dynamic List", "A ListView harboring dynamic data", Qt.resolvedUrl("listview/dynamiclist.qml"));
addExample("Expanding Delegates", "Delegates that expand to fill the list when clicked", Qt.resolvedUrl("listview/expandingdelegates.qml"));
addExample("Highlight", "Adding a highlight to the current item", Qt.resolvedUrl("listview/highlight.qml"));
addExample("Sections", "A ListView with section headers", Qt.resolvedUrl("listview/sections.qml"));
addExample("GridView", "A view laid out in a grid", Qt.resolvedUrl("gridview/gridview-example.qml"));
addExample("PathView", "A view laid out along a path", Qt.resolvedUrl("pathview/pathview-example.qml"));
addExample("Package", "Using a package to transition items between views", Qt.resolvedUrl("package/view.qml"));
addExample("Parallax", "Adds a background and a parallax effect to a ListView", Qt.resolvedUrl("parallax/parallax.qml"));
addExample("Slideshow", "A model demonstrating delayed image loading", Qt.resolvedUrl("visualdatamodel/slideshow.qml"));
addExample("Sorted Model", "Two views on a model, one of which is sorted", Qt.resolvedUrl("visualdatamodel/sortedmodel.qml"));
addExample("VisualItemModel", "A model that consists of the actual Items", Qt.resolvedUrl("visualitemmodel/visualitemmodel.qml"));
addExample("GridView", "A simple GridView", Qt.resolvedUrl("gridview/gridview-example.qml"))
addExample("Dynamic List", "A dynamically alterable list", Qt.resolvedUrl("listview/dynamiclist.qml"))
addExample("Expanding Delegates", "A ListView with delegates that expand", Qt.resolvedUrl("listview/expandingdelegates.qml"))
addExample("Highlight", "A ListView with a custom highlight", Qt.resolvedUrl("listview/highlight.qml"))
addExample("Highlight Ranges", "The three highlight ranges of ListView", Qt.resolvedUrl("listview/highlightranges.qml"))
addExample("Sections", "ListView section headers and footers", Qt.resolvedUrl("listview/sections.qml"))
addExample("Packages", "Transitions between a ListView and GridView", Qt.resolvedUrl("package/view.qml"))
addExample("PathView", "A simple PathView", Qt.resolvedUrl("pathview/pathview-example.qml"))
addExample("VisualItemModel", "Using a VisualItemModel", Qt.resolvedUrl("visualitemmodel/visualitemmodel.qml"))
}
}
}

0 comments on commit 793a01d

Please sign in to comment.