summaryrefslogtreecommitdiffstats
path: root/demos/declarative
diff options
context:
space:
mode:
authorYann Bodson <yann.bodson@nokia.com>2010-03-17 07:21:42 (GMT)
committerYann Bodson <yann.bodson@nokia.com>2010-03-17 07:21:42 (GMT)
commit2637e50d25d6b025b687760c90aed36529b8c918 (patch)
treeaadfe1b75c33c53909ce47167d050b5ea6acb399 /demos/declarative
parentc3302ae058fd1cfed9b95d098fd88ff695c95460 (diff)
downloadQt-2637e50d25d6b025b687760c90aed36529b8c918.zip
Qt-2637e50d25d6b025b687760c90aed36529b8c918.tar.gz
Qt-2637e50d25d6b025b687760c90aed36529b8c918.tar.bz2
Add/delete albums in photoviewer.
Diffstat (limited to 'demos/declarative')
-rw-r--r--demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml23
-rw-r--r--demos/declarative/photoviewer/PhotoViewerCore/Button.qml25
-rw-r--r--demos/declarative/photoviewer/PhotoViewerCore/Tag.qml51
-rw-r--r--demos/declarative/photoviewer/PhotoViewerCore/qmldir1
-rw-r--r--demos/declarative/photoviewer/photoviewer.qml19
5 files changed, 95 insertions, 24 deletions
diff --git a/demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml b/demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml
index d71834e..fca7232 100644
--- a/demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml
+++ b/demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml
@@ -39,9 +39,8 @@ Component {
}
PathView {
- id: photosPathView; model: visualModel.parts.stack
+ id: photosPathView; model: visualModel.parts.stack; pathItemCount: 5
anchors.centerIn: parent; anchors.verticalCenterOffset: -20
- pathItemCount: 5
path: Path {
PathAttribute { name: 'z'; value: 9999.0 }
PathLine { x: 1; y: 1 }
@@ -51,24 +50,34 @@ Component {
Tag {
anchors.horizontalCenter: parent.horizontalCenter; anchors.bottom: parent.bottom
- label: tag; rotation: Math.random() * (2 * 6 + 1) - 6
+ frontLabel: tag; backLabel: "Delete"; rotation: Math.random() * (2 * 6 + 1) - 6
+ flipped: mainWindow.editMode
}
- MouseArea { anchors.fill: parent; onClicked: albumWrapper.state = 'inGrid' }
+ MouseArea {
+ anchors.fill: parent
+ onClicked: {
+ if (mainWindow.editMode) {
+ photosModel.remove(index)
+ } else {
+ albumWrapper.state = 'inGrid'
+ }
+ }
+ }
states: [
State {
name: 'inGrid'
PropertyChanges { target: photosGridView; interactive: true }
PropertyChanges { target: albumsShade; opacity: 1 }
- PropertyChanges{ target: backTag; onClicked: albumWrapper.state = ''; y: 6 }
+ PropertyChanges { target: backButton; onClicked: albumWrapper.state = ''; y: 6 }
},
State {
name: 'fullscreen'; extend: 'inGrid'
PropertyChanges { target: photosGridView; interactive: false }
PropertyChanges { target: photosListView; interactive: true }
PropertyChanges { target: photosShade; opacity: 1 }
- PropertyChanges{ target: backTag; y: -backTag.height - 8 }
+ PropertyChanges { target: backButton; y: -backTag.height - 8 }
}
]
@@ -78,7 +87,7 @@ Component {
SequentialAnimation {
NumberAnimation { properties: 'opacity'; duration: 250 }
PauseAnimation { duration: 350 }
- NumberAnimation { target: backTag; properties: "y"; duration: 200; easing.type: "OutQuad" }
+ NumberAnimation { target: backButton; properties: "y"; duration: 200; easing.type: "OutQuad" }
}
},
Transition {
diff --git a/demos/declarative/photoviewer/PhotoViewerCore/Button.qml b/demos/declarative/photoviewer/PhotoViewerCore/Button.qml
new file mode 100644
index 0000000..fb28314
--- /dev/null
+++ b/demos/declarative/photoviewer/PhotoViewerCore/Button.qml
@@ -0,0 +1,25 @@
+import Qt 4.6
+
+Item {
+ id: container
+
+ property alias label: labelText.text
+ signal clicked
+
+ width: labelText.width + 70 ; height: labelText.height + 18
+
+ BorderImage {
+ anchors { fill: container; leftMargin: -6; topMargin: -6; rightMargin: -8; bottomMargin: -8 }
+ source: 'images/box-shadow.png'; smooth: true
+ border.left: 10; border.top: 10; border.right: 10; border.bottom: 10
+ }
+
+ Image { anchors.fill: parent; source: "images/cardboard.png"; smooth: true }
+
+ Text { id: labelText; font.pixelSize: 15; anchors.centerIn: parent; smooth: true }
+
+ MouseArea {
+ anchors { fill: parent; leftMargin: -20; topMargin: -20; rightMargin: -20; bottomMargin: -20 }
+ onClicked: container.clicked()
+ }
+}
diff --git a/demos/declarative/photoviewer/PhotoViewerCore/Tag.qml b/demos/declarative/photoviewer/PhotoViewerCore/Tag.qml
index ee11d05..d32fcd0 100644
--- a/demos/declarative/photoviewer/PhotoViewerCore/Tag.qml
+++ b/demos/declarative/photoviewer/PhotoViewerCore/Tag.qml
@@ -1,22 +1,45 @@
import Qt 4.6
-Item {
- id: container
+Flipable {
+ id: flipable
- property alias label: labelText.text
- signal clicked
+ property alias frontLabel: frontButton.label
+ property alias backLabel: backButton.label
- width: labelText.width + 70 ; height: labelText.height + 18
+ property int angle: 0
+ property bool flipped: false
- BorderImage {
- anchors { fill: container; leftMargin: -6; topMargin: -6; rightMargin: -8; bottomMargin: -8 }
- source: 'images/box-shadow.png'; smooth: true
- border.left: 10; border.top: 10; border.right: 10; border.bottom: 10
+ signal frontClicked
+ signal backClicked
+
+ front: Button {
+ id: frontButton; anchors.centerIn: parent; anchors.verticalCenterOffset: -20
+ onClicked: flipable.frontClicked()
+ }
+
+ back: Button {
+ id: backButton; anchors.centerIn: parent; anchors.verticalCenterOffset: -20
+ onClicked: flipable.backClicked()
+ }
+
+ transform: Rotation {
+ origin.x: flipable.width / 2; origin.y: flipable.height / 2
+ axis.x: 0; axis.y: 1; axis.z: 0
+ angle: flipable.angle
+ }
+
+ states: State {
+ name: "back"; when: flipable.flipped
+ PropertyChanges { target: flipable; angle: 180 }
}
- Image { anchors.fill: parent; source: "images/cardboard.png"; smooth: true }
- Text { id: labelText; font.pixelSize: 15; anchors.centerIn: parent; smooth: true }
- MouseArea {
- anchors { fill: parent; leftMargin: -20; topMargin: -20; rightMargin: -20; bottomMargin: -20 }
- onClicked: container.clicked()
+
+ transitions: Transition {
+ ParallelAnimation {
+ NumberAnimation { properties: "angle"; duration: 400 }
+ SequentialAnimation {
+ NumberAnimation { target: flipable; property: "scale"; to: 0.8; duration: 200 }
+ NumberAnimation { target: flipable; property: "scale"; to: 1.0; duration: 200 }
+ }
+ }
}
}
diff --git a/demos/declarative/photoviewer/PhotoViewerCore/qmldir b/demos/declarative/photoviewer/PhotoViewerCore/qmldir
index 4821faa..f94a560 100644
--- a/demos/declarative/photoviewer/PhotoViewerCore/qmldir
+++ b/demos/declarative/photoviewer/PhotoViewerCore/qmldir
@@ -2,5 +2,6 @@ AlbumDelegate AlbumDelegate.qml
PhotoDelegate PhotoDelegate.qml
ProgressBar ProgressBar.qml
RssModel RssModel.qml
+Button Button.qml
Tag Tag.qml
BusyIndicator BusyIndicator.qml
diff --git a/demos/declarative/photoviewer/photoviewer.qml b/demos/declarative/photoviewer/photoviewer.qml
index 5ce02f3..02134ac 100644
--- a/demos/declarative/photoviewer/photoviewer.qml
+++ b/demos/declarative/photoviewer/photoviewer.qml
@@ -6,6 +6,7 @@ Rectangle {
property real downloadProgress: 0
property bool imageLoading: false
+ property bool editMode: false
width: 800; height: 480; color: "#d5d6d8"
@@ -21,8 +22,20 @@ Rectangle {
VisualDataModel { id: albumVisualModel; model: photosModel; delegate: AlbumDelegate {} }
GridView {
- width: parent.width; height: parent.height; cellWidth: 210; cellHeight: 220; model: albumVisualModel.parts.album
- visible: albumsShade.opacity != 1.0
+ id: albumView; width: parent.width; height: parent.height; cellWidth: 210; cellHeight: 220
+ model: albumVisualModel.parts.album; visible: albumsShade.opacity != 1.0
+ }
+
+ Column {
+ spacing: 20; anchors { bottom: parent.bottom; right: parent.right; rightMargin: 20; bottomMargin: 20 }
+ Button { id: deleteButton; label: "Edit"; rotation: -2; onClicked: mainWindow.editMode = !mainWindow.editMode }
+ Button {
+ id: newButton; label: "New"; rotation: 3
+ onClicked: {
+ photosModel.append( { tag: "" } )
+ albumView.positionViewAtIndex(albumView.count - 1, GridView.Contain)
+ }
+ }
}
Rectangle {
@@ -32,7 +45,7 @@ Rectangle {
ListView { anchors.fill: parent; model: albumVisualModel.parts.browser; interactive: false }
- Tag { id: backTag; label: "Back"; rotation: 3; x: parent.width - backTag.width - 6; y: -backTag.height - 8 }
+ Button { id: backButton; label: "Back"; rotation: 3; x: parent.width - backButton.width - 6; y: -backButton.height - 8 }
Rectangle { id: photosShade; color: 'black'; width: parent.width; height: parent.height; opacity: 0; visible: opacity != 0.0 }