diff options
Diffstat (limited to 'demos/declarative')
22 files changed, 398 insertions, 25 deletions
diff --git a/demos/declarative/declarative.pro b/demos/declarative/declarative.pro index 4d169e3..aa60db0 100644 --- a/demos/declarative/declarative.pro +++ b/demos/declarative/declarative.pro @@ -8,6 +8,7 @@ SUBDIRS = \ sources.files = \ calculator \ flickr \ + photoviewer \ samegame \ snake \ twitter \ diff --git a/demos/declarative/flickr/common/qmldir b/demos/declarative/flickr/common/qmldir index 0c94f60..adc2479 100644 --- a/demos/declarative/flickr/common/qmldir +++ b/demos/declarative/flickr/common/qmldir @@ -1,10 +1,10 @@ -ImageDetails 0.0 ImageDetails.qml -LikeOMeter 0.0 LikeOMeter.qml -Loading 0.0 Loading.qml -MediaButton 0.0 MediaButton.qml -MediaLineEdit 0.0 MediaLineEdit.qml -Progress 0.0 Progress.qml -RssModel 0.0 RssModel.qml -ScrollBar 0.0 ScrollBar.qml -Slider 0.0 Slider.qml -Star 0.0 Star.qml +ImageDetails ImageDetails.qml +LikeOMeter LikeOMeter.qml +Loading Loading.qml +MediaButton MediaButton.qml +MediaLineEdit MediaLineEdit.qml +Progress Progress.qml +RssModel RssModel.qml +ScrollBar ScrollBar.qml +Slider Slider.qml +Star Star.qml diff --git a/demos/declarative/minehunt/MinehuntCore/Explosion.qml b/demos/declarative/minehunt/MinehuntCore/Explosion.qml index e337c46..172fcc0 100644 --- a/demos/declarative/minehunt/MinehuntCore/Explosion.qml +++ b/demos/declarative/minehunt/MinehuntCore/Explosion.qml @@ -1,4 +1,5 @@ import Qt 4.6 +import Qt.labs.particles 1.0 Item { property bool explode : false diff --git a/demos/declarative/minehunt/minehunt.cpp b/demos/declarative/minehunt/minehunt.cpp index 89845ef..5e44d1b 100644 --- a/demos/declarative/minehunt/minehunt.cpp +++ b/demos/declarative/minehunt/minehunt.cpp @@ -292,9 +292,8 @@ class MinehuntExtensionPlugin : public QDeclarativeExtensionPlugin public: void registerTypes(const char *uri) { - Q_UNUSED(uri); - QML_REGISTER_TYPE(SameGameCore, 0, 1, Tile, Tile); - QML_REGISTER_TYPE(SameGameCore, 0, 1, Game, MinehuntGame); + qmlRegisterType<Tile>(uri, 0, 1, "Tile"); + qmlRegisterType<MinehuntGame>(uri, 0, 1, "Game"); } void initializeEngine(QDeclarativeEngine *engine, const char *uri) { @@ -304,7 +303,7 @@ class MinehuntExtensionPlugin : public QDeclarativeExtensionPlugin MinehuntGame* game = new MinehuntGame(); - engine->rootContext()->addDefaultObject(game); + engine->rootContext()->setContextObject(game); } }; diff --git a/demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml b/demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml new file mode 100644 index 0000000..d71834e --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/AlbumDelegate.qml @@ -0,0 +1,91 @@ +import Qt 4.6 + +Component { + id: albumDelegate + Package { + + Item { + Package.name: 'browser' + GridView { + id: photosGridView; model: visualModel.parts.grid; width: mainWindow.width; height: mainWindow.height - 21 + x: 0; y: 21; cellWidth: 160; cellHeight: 153; interactive: false + onCurrentIndexChanged: photosListView.positionViewAtIndex(currentIndex, ListView.Contain) + } + } + + Item { + Package.name: 'fullscreen' + ListView { + id: photosListView; model: visualModel.parts.list; orientation: Qt.Horizontal + width: mainWindow.width; height: mainWindow.height; interactive: false + onCurrentIndexChanged: photosGridView.positionViewAtIndex(currentIndex, GridView.Contain) + highlightRangeMode: ListView.StrictlyEnforceRange; snapMode: ListView.SnapOneItem + } + } + + Item { + Package.name: 'album' + id: albumWrapper + width: 210; height: 220 + + VisualDataModel { + id: visualModel; delegate: PhotoDelegate { } + model: RssModel { id: rssModel; tags: tag } + } + + BusyIndicator { + anchors { centerIn: parent; verticalCenterOffset: -20 } + on: rssModel.status != XmlListModel.Ready + } + + PathView { + id: photosPathView; model: visualModel.parts.stack + anchors.centerIn: parent; anchors.verticalCenterOffset: -20 + pathItemCount: 5 + path: Path { + PathAttribute { name: 'z'; value: 9999.0 } + PathLine { x: 1; y: 1 } + PathAttribute { name: 'z'; value: 0.0 } + } + } + + Tag { + anchors.horizontalCenter: parent.horizontalCenter; anchors.bottom: parent.bottom + label: tag; rotation: Math.random() * (2 * 6 + 1) - 6 + } + + MouseArea { anchors.fill: parent; onClicked: 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 } + }, + 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 } + } + ] + + transitions: [ + Transition { + from: '*'; to: 'inGrid' + SequentialAnimation { + NumberAnimation { properties: 'opacity'; duration: 250 } + PauseAnimation { duration: 350 } + NumberAnimation { target: backTag; properties: "y"; duration: 200; easing.type: "OutQuad" } + } + }, + Transition { + from: 'inGrid'; to: '*' + NumberAnimation { properties: "y,opacity"; easing.type: "OutQuad"; duration: 300 } + } + ] + } + } +} diff --git a/demos/declarative/photoviewer/PhotoViewerCore/BusyIndicator.qml b/demos/declarative/photoviewer/PhotoViewerCore/BusyIndicator.qml new file mode 100644 index 0000000..919ac43 --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/BusyIndicator.qml @@ -0,0 +1,9 @@ +import Qt 4.6 + +Image { + id: container + property bool on: false + + source: "images/busy.png"; visible: container.on + NumberAnimation on rotation { running: container.on; from: 0; to: 360; repeat: true; duration: 1200 } +} diff --git a/demos/declarative/photoviewer/PhotoViewerCore/PhotoDelegate.qml b/demos/declarative/photoviewer/PhotoViewerCore/PhotoDelegate.qml new file mode 100644 index 0000000..89fe3e8 --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/PhotoDelegate.qml @@ -0,0 +1,142 @@ +import Qt 4.6 + +Package { + Item { id: stackItem; Package.name: 'stack'; width: 160; height: 153; z: stackItem.PathView.z } + Item { id: listItem; Package.name: 'list'; width: mainWindow.width + 40; height: 153 } + Item { id: gridItem; Package.name: 'grid'; width: 160; height: 153 } + + Item { + width: 160; height: 153 + + Item { + id: photoWrapper + + property double randomAngle: Math.random() * (2 * 6 + 1) - 6 + property double randomAngle2: Math.random() * (2 * 6 + 1) - 6 + + x: 0; y: 0; width: 140; height: 133 + z: stackItem.PathView.z; rotation: photoWrapper.randomAngle + + BorderImage { + anchors { + fill: border.visible ? border : placeHolder + 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 + } + Rectangle { + id: placeHolder + + property int w: getWidth(content) + property int h: getHeight(content) + property double s: calculateScale(w, h, photoWrapper.width) + + color: '#878787'; anchors.centerIn: parent; smooth: true; border.color: 'white'; border.width: 3 + width: w * s; height: h * s; visible: originalImage.status != Image.Ready + } + Rectangle { + id: border; color: 'white'; anchors.centerIn: parent; smooth: true + width: originalImage.paintedWidth + 6; height: originalImage.paintedHeight + 6 + visible: !placeHolder.visible + } + BusyIndicator { anchors.centerIn: parent; on: originalImage.status != Image.Ready } + Image { + id: originalImage; smooth: true; source: "http://" + getImagePath(content) + fillMode: Image.PreserveAspectFit; width: photoWrapper.width; height: photoWrapper.height + } + Image { + id: hqImage; smooth: true; source: ""; visible: false + fillMode: Image.PreserveAspectFit; width: photoWrapper.width; height: photoWrapper.height + } + Binding { + target: mainWindow; property: "downloadProgress"; value: hqImage.progress + when: listItem.ListView.isCurrentItem + } + Binding { + target: mainWindow; property: "imageLoading" + value: (hqImage.status == Image.Loading) ? 1 : 0; when: listItem.ListView.isCurrentItem + } + MouseArea { + width: originalImage.paintedWidth; height: originalImage.paintedHeight; anchors.centerIn: originalImage + onClicked: { + if (albumWrapper.state == 'inGrid') { + gridItem.GridView.view.currentIndex = index; + albumWrapper.state = 'fullscreen' + } else { + gridItem.GridView.view.currentIndex = index; + albumWrapper.state = 'inGrid' + } + } + } + + states: [ + State { + name: 'stacked'; when: albumWrapper.state == '' + ParentChange { target: photoWrapper; parent: stackItem; x: 10; y: 10 } + PropertyChanges { target: photoWrapper; opacity: stackItem.PathView.onPath ? 1.0 : 0.0 } + }, + State { + name: 'inGrid'; when: albumWrapper.state == 'inGrid' + ParentChange { target: photoWrapper; parent: gridItem; x: 10; y: 10; rotation: photoWrapper.randomAngle2 } + }, + State { + name: 'fullscreen'; when: albumWrapper.state == 'fullscreen' + ParentChange { + target: photoWrapper; parent: listItem; x: 0; y: 0; rotation: 0 + width: mainWindow.width; height: mainWindow.height + } + PropertyChanges { target: border; opacity: 0 } + PropertyChanges { target: hqImage; source: listItem.ListView.isCurrentItem ? hq : ""; visible: true } + } + ] + + transitions: [ + Transition { + from: 'stacked'; to: 'inGrid' + SequentialAnimation { + PauseAnimation { duration: 10 * index } + ParentAnimation { + target: photoWrapper; via: foreground + NumberAnimation { + target: photoWrapper; properties: 'x,y,rotation,opacity'; duration: 600; easing.type: 'OutQuart' + } + } + } + }, + Transition { + from: 'inGrid'; to: 'stacked' + ParentAnimation { + target: photoWrapper; via: foreground + NumberAnimation { properties: 'x,y,rotation,opacity'; duration: 600; easing.type: 'OutQuart' } + } + }, + Transition { + from: 'inGrid'; to: 'fullscreen' + SequentialAnimation { + PauseAnimation { duration: gridItem.GridView.isCurrentItem ? 0 : 600 } + ParentAnimation { + target: photoWrapper; via: foreground + NumberAnimation { + targets: [ photoWrapper, border ] + properties: 'x,y,width,height,opacity,rotation' + duration: gridItem.GridView.isCurrentItem ? 600 : 1; easing.type: 'OutQuart' + } + } + } + }, + Transition { + from: 'fullscreen'; to: 'inGrid' + ParentAnimation { + target: photoWrapper; via: foreground + NumberAnimation { + targets: [ photoWrapper, border ] + properties: 'x,y,width,height,rotation,opacity' + duration: gridItem.GridView.isCurrentItem ? 600 : 1; easing.type: 'OutQuart' + } + } + } + ] + } + } +} diff --git a/demos/declarative/photoviewer/PhotoViewerCore/ProgressBar.qml b/demos/declarative/photoviewer/PhotoViewerCore/ProgressBar.qml new file mode 100644 index 0000000..bd6b30f --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/ProgressBar.qml @@ -0,0 +1,16 @@ +import Qt 4.6 + +Item { + id: container + + property real progress: 0 + + Behavior on opacity { NumberAnimation { duration: 600 } } + + Rectangle { anchors.fill: parent; color: "black"; opacity: 0.5 } + + Rectangle { + id: fill; color: "white"; height: container.height + width: container.width * container.progress + } +} diff --git a/demos/declarative/photoviewer/PhotoViewerCore/RssModel.qml b/demos/declarative/photoviewer/PhotoViewerCore/RssModel.qml new file mode 100644 index 0000000..ddbc02b --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/RssModel.qml @@ -0,0 +1,13 @@ +import Qt 4.6 + +XmlListModel { + property string tags : "" + + source: "http://api.flickr.com/services/feeds/photos_public.gne?"+(tags ? "tags="+tags+"&" : "") + query: "/feed/entry" + namespaceDeclarations: "declare default element namespace 'http://www.w3.org/2005/Atom';" + + XmlRole { name: "title"; query: "title/string()" } + XmlRole { name: "content"; query: "content/string()" } + XmlRole { name: "hq"; query: "link[@rel='enclosure']/@href/string()" } +} diff --git a/demos/declarative/photoviewer/PhotoViewerCore/Tag.qml b/demos/declarative/photoviewer/PhotoViewerCore/Tag.qml new file mode 100644 index 0000000..ee11d05 --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/Tag.qml @@ -0,0 +1,22 @@ +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/images/box-shadow.png b/demos/declarative/photoviewer/PhotoViewerCore/images/box-shadow.png Binary files differnew file mode 100644 index 0000000..431af85 --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/images/box-shadow.png diff --git a/demos/declarative/photoviewer/PhotoViewerCore/images/busy.png b/demos/declarative/photoviewer/PhotoViewerCore/images/busy.png Binary files differnew file mode 100644 index 0000000..664c2b1 --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/images/busy.png diff --git a/demos/declarative/photoviewer/PhotoViewerCore/images/cardboard.png b/demos/declarative/photoviewer/PhotoViewerCore/images/cardboard.png Binary files differnew file mode 100644 index 0000000..1847ab5 --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/images/cardboard.png diff --git a/demos/declarative/photoviewer/PhotoViewerCore/qmldir b/demos/declarative/photoviewer/PhotoViewerCore/qmldir new file mode 100644 index 0000000..4821faa --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/qmldir @@ -0,0 +1,6 @@ +AlbumDelegate AlbumDelegate.qml +PhotoDelegate PhotoDelegate.qml +ProgressBar ProgressBar.qml +RssModel RssModel.qml +Tag Tag.qml +BusyIndicator BusyIndicator.qml diff --git a/demos/declarative/photoviewer/PhotoViewerCore/script/script.js b/demos/declarative/photoviewer/PhotoViewerCore/script/script.js new file mode 100644 index 0000000..ae24ea1 --- /dev/null +++ b/demos/declarative/photoviewer/PhotoViewerCore/script/script.js @@ -0,0 +1,25 @@ +function getWidth(string) { + return (string.match(/width=\"([0-9]+)\"/))[1] +} + +function getHeight(string) { + return (string.match(/height=\"([0-9]+)\"/))[1] +} + +function getImagePath(string) { + var pattern = /src=\"http:\/\/(\S+)\"/ + return (string.match(pattern))[1] +} + +function calculateScale(width, height, cellSize) { + var widthScale = (cellSize * 1.0) / width + var heightScale = (cellSize * 1.0) / height + var scale = 0 + + if (widthScale <= heightScale) { + scale = widthScale; + } else if (heightScale < widthScale) { + scale = heightScale; + } + return scale; +} diff --git a/demos/declarative/photoviewer/photoviewer.qml b/demos/declarative/photoviewer/photoviewer.qml new file mode 100644 index 0000000..5ce02f3 --- /dev/null +++ b/demos/declarative/photoviewer/photoviewer.qml @@ -0,0 +1,47 @@ +import Qt 4.6 +import PhotoViewerCore 1.0 + +Rectangle { + id: mainWindow + + property real downloadProgress: 0 + property bool imageLoading: false + + width: 800; height: 480; color: "#d5d6d8" + + Script { source: "PhotoViewerCore/script/script.js" } + + ListModel { + id: photosModel + ListElement { tag: "Flowers" } + ListElement { tag: "Savanna" } + ListElement { tag: "Central Park" } + } + + 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 + } + + Rectangle { + id: albumsShade; color: mainWindow.color + width: parent.width; height: parent.height; opacity: 0.0 + } + + 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 } + + Rectangle { id: photosShade; color: 'black'; width: parent.width; height: parent.height; opacity: 0; visible: opacity != 0.0 } + + ListView { anchors.fill: parent; model: albumVisualModel.parts.fullscreen; interactive: false } + + Item { id: foreground; anchors.fill: parent } + + ProgressBar { + progress: mainWindow.downloadProgress; width: parent.width; height: 4 + anchors.bottom: parent.bottom; opacity: mainWindow.imageLoading; visible: opacity != 0.0 + } +} diff --git a/demos/declarative/samegame/SamegameCore/BoomBlock.qml b/demos/declarative/samegame/SamegameCore/BoomBlock.qml index e48194a..b14531d 100644 --- a/demos/declarative/samegame/SamegameCore/BoomBlock.qml +++ b/demos/declarative/samegame/SamegameCore/BoomBlock.qml @@ -1,4 +1,5 @@ import Qt 4.6 +import Qt.labs.particles 1.0 Item { id:block property bool dying: false diff --git a/demos/declarative/samegame/SamegameCore/qmldir b/demos/declarative/samegame/SamegameCore/qmldir index a8f8a98..e17b1f5 100644 --- a/demos/declarative/samegame/SamegameCore/qmldir +++ b/demos/declarative/samegame/SamegameCore/qmldir @@ -1,3 +1,3 @@ -BoomBlock 0.0 BoomBlock.qml -Button 0.0 Button.qml -Dialog 0.0 Dialog.qml +BoomBlock BoomBlock.qml +Button Button.qml +Dialog Dialog.qml diff --git a/demos/declarative/snake/content/Cookie.qml b/demos/declarative/snake/content/Cookie.qml index 0ea95cb..b64987e 100644 --- a/demos/declarative/snake/content/Cookie.qml +++ b/demos/declarative/snake/content/Cookie.qml @@ -1,4 +1,5 @@ import Qt 4.6 +import Qt.labs.particles 1.0 Item { id: root diff --git a/demos/declarative/snake/content/Link.qml b/demos/declarative/snake/content/Link.qml index 31ac4b9..4171247 100644 --- a/demos/declarative/snake/content/Link.qml +++ b/demos/declarative/snake/content/Link.qml @@ -1,4 +1,5 @@ import Qt 4.6 +import Qt.labs.particles 1.0 Item { id:link property bool dying: false diff --git a/demos/declarative/snake/snake.qml b/demos/declarative/snake/snake.qml index f9d02c7..317c7de 100644 --- a/demos/declarative/snake/snake.qml +++ b/demos/declarative/snake/snake.qml @@ -1,5 +1,5 @@ import Qt 4.6 -import "content" +import "content" as Content Rectangle { id: screen; @@ -27,7 +27,7 @@ Rectangle { property var head; - HighScoreModel { + Content.HighScoreModel { id: highScores game: "Snake" } @@ -46,7 +46,7 @@ Rectangle { onTriggered: { moveSkull() } } Timer { - id: startNewGameTimer; + interval: 700; onTriggered: {startNewGame(); } } @@ -97,7 +97,7 @@ Rectangle { height: numRowsAvailable * gridSize + 2*margin - Skull { + Content.Skull { id: skull } @@ -148,7 +148,7 @@ Rectangle { height: 32; width: parent.width anchors.bottom: screen.bottom - Button { + Content.Button { id: btnA; text: "New Game"; onClicked: {startNewGame();} anchors.left: parent.left; anchors.leftMargin: 3 anchors.verticalCenter: parent.verticalCenter diff --git a/demos/declarative/webbrowser/content/RetractingWebBrowserHeader.qml b/demos/declarative/webbrowser/content/RetractingWebBrowserHeader.qml index 94c94f2..46dbc98 100644 --- a/demos/declarative/webbrowser/content/RetractingWebBrowserHeader.qml +++ b/demos/declarative/webbrowser/content/RetractingWebBrowserHeader.qml @@ -18,7 +18,7 @@ Image { anchors.top: header.top anchors.topMargin: 4 - anchors.horizontalCenter: parent.horizontalCenter + x: parent.width > headerIcon.width+headerText.width+6 ? (parent.width-headerIcon.width-headerText.width-6)/2 : 0 spacing: 6 Image { @@ -30,8 +30,6 @@ Image { id: headerText text: webView.title!='' || webView.progress == 1.0 ? webView.title : 'Loading...' - elide: Text.ElideRight - //width: parent.width - headerIcon.width-4 color: "white" styleColor: "black" |
