From 1db36a5a37dcca0e24ada3c852f2647ab2330eee Mon Sep 17 00:00:00 2001 From: Yann Bodson Date: Mon, 17 May 2010 16:45:35 +1000 Subject: Move xmldata example into rssnews demo. --- .../declarative/rssnews/content/BusyIndicator.qml | 12 +++ .../rssnews/content/CategoryDelegate.qml | 41 ++++++++++ demos/declarative/rssnews/content/NewsDelegate.qml | 29 +++++++ demos/declarative/rssnews/content/RssFeeds.qml | 18 +++++ demos/declarative/rssnews/content/ScrollBar.qml | 66 ++++++++++++++++ demos/declarative/rssnews/content/images/busy.png | Bin 0 -> 2629 bytes .../rssnews/content/images/scrollbar.png | Bin 0 -> 161 bytes demos/declarative/rssnews/rssnews.qml | 52 +++++++++++++ .../declarative/xml/xmldata/daringfireball.qml | 47 ------------ .../declarative/xml/xmldata/xmldata.qmlproject | 16 ---- examples/declarative/xml/xmldata/yahoonews.qml | 83 --------------------- 11 files changed, 218 insertions(+), 146 deletions(-) create mode 100644 demos/declarative/rssnews/content/BusyIndicator.qml create mode 100644 demos/declarative/rssnews/content/CategoryDelegate.qml create mode 100644 demos/declarative/rssnews/content/NewsDelegate.qml create mode 100644 demos/declarative/rssnews/content/RssFeeds.qml create mode 100644 demos/declarative/rssnews/content/ScrollBar.qml create mode 100644 demos/declarative/rssnews/content/images/busy.png create mode 100644 demos/declarative/rssnews/content/images/scrollbar.png create mode 100644 demos/declarative/rssnews/rssnews.qml delete mode 100644 examples/declarative/xml/xmldata/daringfireball.qml delete mode 100644 examples/declarative/xml/xmldata/xmldata.qmlproject delete mode 100644 examples/declarative/xml/xmldata/yahoonews.qml diff --git a/demos/declarative/rssnews/content/BusyIndicator.qml b/demos/declarative/rssnews/content/BusyIndicator.qml new file mode 100644 index 0000000..4be59a8 --- /dev/null +++ b/demos/declarative/rssnews/content/BusyIndicator.qml @@ -0,0 +1,12 @@ +import Qt 4.7 + +Image { + id: container + property bool on: false + + source: "images/busy.png"; visible: container.on + + NumberAnimation on rotation { + running: container.on; from: 0; to: 360; loops: Animation.Infinite; duration: 1200 + } +} diff --git a/demos/declarative/rssnews/content/CategoryDelegate.qml b/demos/declarative/rssnews/content/CategoryDelegate.qml new file mode 100644 index 0000000..1400c36 --- /dev/null +++ b/demos/declarative/rssnews/content/CategoryDelegate.qml @@ -0,0 +1,41 @@ +import Qt 4.7 + +Item { + id: delegate + + width: delegate.ListView.view.width; height: 60 + + Text { + text: name + color: delegate.ListView.isCurrentItem ? "white" : "black" + font { family: "Helvetica"; pixelSize: 16; bold: true } + anchors { + left: parent.left; leftMargin: 15 + verticalCenter: parent.verticalCenter + } + } + + BusyIndicator { + scale: 0.6 + on: delegate.ListView.isCurrentItem && window.loading + anchors { right: parent.right; rightMargin: 10; verticalCenter: parent.verticalCenter } + } + + Rectangle { + width: delegate.width; height: 1; color: "#cccccc" + anchors.bottom: delegate.bottom + visible: delegate.ListView.isCurrentItem ? false : true + } + Rectangle { + width: delegate.width; height: 1; color: "white" + visible: delegate.ListView.isCurrentItem ? false : true + } + + MouseArea { + anchors.fill: delegate + onClicked: { + delegate.ListView.view.currentIndex = index + window.currentFeed = feed + } + } +} diff --git a/demos/declarative/rssnews/content/NewsDelegate.qml b/demos/declarative/rssnews/content/NewsDelegate.qml new file mode 100644 index 0000000..0d03880 --- /dev/null +++ b/demos/declarative/rssnews/content/NewsDelegate.qml @@ -0,0 +1,29 @@ +import Qt 4.7 + +Item { + id: delegate + height: childrenRect.height + 20 + width: delegate.ListView.view.width + + Column { + x: 20; y: 20 + width: parent.width - 40 + + Text { + id: titleText + text: title; width: parent.width; wrapMode: Text.WordWrap + font { bold: true; family: "Helvetica"; pointSize: 16 } + } + + Text { + id: descriptionText + width: parent.width; text: description + wrapMode: Text.WordWrap; font.family: "Helvetica" + } + } + + Rectangle { + width: parent.width; height: 1; color: "#cccccc" + anchors.bottom: parent.bottom + } +} diff --git a/demos/declarative/rssnews/content/RssFeeds.qml b/demos/declarative/rssnews/content/RssFeeds.qml new file mode 100644 index 0000000..21e59fe --- /dev/null +++ b/demos/declarative/rssnews/content/RssFeeds.qml @@ -0,0 +1,18 @@ +import Qt 4.7 + +ListModel { + id: rssFeeds + + ListElement { name: "Top Stories"; feed: "rss.news.yahoo.com/rss/topstories" } + ListElement { name: "World"; feed: "rss.news.yahoo.com/rss/world" } + ListElement { name: "Europe"; feed: "rss.news.yahoo.com/rss/europe" } + ListElement { name: "Oceania"; feed: "rss.news.yahoo.com/rss/oceania" } + ListElement { name: "U.S. National"; feed: "rss.news.yahoo.com/rss/us" } + ListElement { name: "Politics"; feed: "rss.news.yahoo.com/rss/politics" } + ListElement { name: "Business"; feed: "rss.news.yahoo.com/rss/business" } + ListElement { name: "Technology"; feed: "rss.news.yahoo.com/rss/tech" } + ListElement { name: "Entertainment"; feed: "rss.news.yahoo.com/rss/entertainment" } + ListElement { name: "Health"; feed: "rss.news.yahoo.com/rss/health" } + ListElement { name: "Science"; feed: "rss.news.yahoo.com/rss/science" } + ListElement { name: "Sports"; feed: "rss.news.yahoo.com/rss/sports" } +} diff --git a/demos/declarative/rssnews/content/ScrollBar.qml b/demos/declarative/rssnews/content/ScrollBar.qml new file mode 100644 index 0000000..d0b08dd --- /dev/null +++ b/demos/declarative/rssnews/content/ScrollBar.qml @@ -0,0 +1,66 @@ +import Qt 4.7 + +Item { + id: container + + property variant scrollArea + property variant orientation: Qt.Vertical + + opacity: 0 + + function position() + { + var ny = 0; + if (container.orientation == Qt.Vertical) + ny = scrollArea.visibleArea.yPosition * container.height; + else + ny = scrollArea.visibleArea.xPosition * container.width; + if (ny > 2) return ny; else return 2; + } + + function size() + { + var nh, ny; + + if (container.orientation == Qt.Vertical) + nh = scrollArea.visibleArea.heightRatio * container.height; + else + nh = scrollArea.visibleArea.widthRatio * container.width; + + if (container.orientation == Qt.Vertical) + ny = scrollArea.visibleArea.yPosition * container.height; + else + ny = scrollArea.visibleArea.xPosition * container.width; + + if (ny > 3) { + var t; + if (container.orientation == Qt.Vertical) + t = Math.ceil(container.height - 3 - ny); + else + t = Math.ceil(container.width - 3 - ny); + if (nh > t) return t; else return nh; + } else return nh + ny; + } + + Rectangle { anchors.fill: parent; color: "Black"; opacity: 0.3 } + + BorderImage { + source: "images/scrollbar.png" + border { left: 1; right: 1; top: 1; bottom: 1 } + x: container.orientation == Qt.Vertical ? 2 : position() + width: container.orientation == Qt.Vertical ? container.width - 4 : size() + y: container.orientation == Qt.Vertical ? position() : 2 + height: container.orientation == Qt.Vertical ? size() : container.height - 4 + } + + states: State { + name: "visible" + when: container.orientation == Qt.Vertical ? scrollArea.movingVertically : scrollArea.movingHorizontally + PropertyChanges { target: container; opacity: 1.0 } + } + + transitions: Transition { + from: "visible"; to: "" + NumberAnimation { properties: "opacity"; duration: 600 } + } +} diff --git a/demos/declarative/rssnews/content/images/busy.png b/demos/declarative/rssnews/content/images/busy.png new file mode 100644 index 0000000..664c2b1 Binary files /dev/null and b/demos/declarative/rssnews/content/images/busy.png differ diff --git a/demos/declarative/rssnews/content/images/scrollbar.png b/demos/declarative/rssnews/content/images/scrollbar.png new file mode 100644 index 0000000..0228dcf Binary files /dev/null and b/demos/declarative/rssnews/content/images/scrollbar.png differ diff --git a/demos/declarative/rssnews/rssnews.qml b/demos/declarative/rssnews/rssnews.qml new file mode 100644 index 0000000..29a530f --- /dev/null +++ b/demos/declarative/rssnews/rssnews.qml @@ -0,0 +1,52 @@ +import Qt 4.7 +import "content" + +Rectangle { + id: window + width: 800; height: 480 + + property string currentFeed: "rss.news.yahoo.com/rss/topstories" + property bool loading: feedModel.status == XmlListModel.Loading + + RssFeeds { id: rssFeeds } + + XmlListModel { + id: feedModel + source: "http://" + window.currentFeed + query: "/rss/channel/item" + + XmlRole { name: "title"; query: "title/string()" } + XmlRole { name: "link"; query: "link/string()" } + XmlRole { name: "description"; query: "description/string()" } + } + + Row { + Rectangle { + width: 220; height: window.height + color: "#efefef" + + ListView { + focus: true + id: categories + anchors.fill: parent + model: rssFeeds + delegate: CategoryDelegate {} + highlight: Rectangle { color: "steelblue" } + highlightMoveSpeed: 9999999 + } + ScrollBar { + scrollArea: categories; height: categories.height; width: 8 + anchors.right: categories.right + } + } + ListView { + id: list + width: window.width - 220; height: window.height + model: feedModel + delegate: NewsDelegate {} + } + } + + ScrollBar { scrollArea: list; height: list.height; width: 8; anchors.right: window.right } + Rectangle { x: 220; height: window.height; width: 1; color: "#cccccc" } +} diff --git a/examples/declarative/xml/xmldata/daringfireball.qml b/examples/declarative/xml/xmldata/daringfireball.qml deleted file mode 100644 index 480b13c..0000000 --- a/examples/declarative/xml/xmldata/daringfireball.qml +++ /dev/null @@ -1,47 +0,0 @@ -import Qt 4.7 - -Rectangle { - width: 600; height: 600 - - XmlListModel { - id: feedModel - source: "http://daringfireball.net/index.xml" - query: "/feed/entry" - namespaceDeclarations: "declare default element namespace 'http://www.w3.org/2005/Atom';" - XmlRole { name: "title"; query: "title/string()" } - XmlRole { name: "tagline"; query: "author/name/string()" } - XmlRole { name: "content"; query: "content/string()" } - } - - Component { - id: feedDelegate - Item { - height: childrenRect.height + 20 - Text { - id: titleText - x: 10 - text: title; font.bold: true - } - Text { - anchors { left: titleText.right; leftMargin: 10 } - text: 'by ' + tagline - font.italic: true - } - Text { - x: 10 - width: 580 - anchors.top: titleText.bottom - text: content - wrapMode: Text.WordWrap - - onLinkActivated: { console.log('link clicked: ' + link) } - } - } - } - - ListView { - anchors.fill: parent - model: feedModel - delegate: feedDelegate - } -} diff --git a/examples/declarative/xml/xmldata/xmldata.qmlproject b/examples/declarative/xml/xmldata/xmldata.qmlproject deleted file mode 100644 index d4909f8..0000000 --- a/examples/declarative/xml/xmldata/xmldata.qmlproject +++ /dev/null @@ -1,16 +0,0 @@ -import QmlProject 1.0 - -Project { - /* Include .qml, .js, and image files from current directory and subdirectories */ - QmlFiles { - directory: "." - } - JavaScriptFiles { - directory: "." - } - ImageFiles { - directory: "." - } - /* List of plugin directories passed to QML runtime */ - // importPaths: [ " ../exampleplugin " ] -} diff --git a/examples/declarative/xml/xmldata/yahoonews.qml b/examples/declarative/xml/xmldata/yahoonews.qml deleted file mode 100644 index 5bab463..0000000 --- a/examples/declarative/xml/xmldata/yahoonews.qml +++ /dev/null @@ -1,83 +0,0 @@ -import Qt 4.7 - -Rectangle { - width: 600; height: 600 - - gradient: Gradient { - GradientStop { position: 0; color: "black" } - GradientStop { position: 1.0; color: "#AAAAAA" } - } - - XmlListModel { - id: feedModel - source: "http://rss.news.yahoo.com/rss/oceania" - query: "/rss/channel/item" - XmlRole { name: "title"; query: "title/string()" } - XmlRole { name: "link"; query: "link/string()" } - XmlRole { name: "description"; query: "description/string()" } - } - - Component { - id: feedDelegate - - Item { - id: delegate - height: wrapper.height + 10 - - MouseArea { - anchors.fill: wrapper - onPressed: delegate.ListView.view.currentIndex = index; - onClicked: if (wrapper.state == 'Details') wrapper.state = ''; else wrapper.state = 'Details'; - } - - Rectangle { - id: wrapper - - width: 580; y: 5; height: titleText.height + 10 - color: "#F0F0F0" - radius: 5 - - Text { - id: titleText - x: 10; y: 5 - text: '' + title + '' - font { bold: true; family: "Helvetica"; pointSize: 14 } - - onLinkActivated: { console.log('link clicked: ' + link) } - } - - Text { - id: descriptionText - x: 10; width: 560 - anchors.top: titleText.bottom; anchors.topMargin: 5 - text: description - wrapMode: Text.WordWrap - font.family: "Helvetica" - opacity: 0 - } - - states: State { - name: "Details" - PropertyChanges { target: wrapper; height: childrenRect.height + 10 } - PropertyChanges { target: descriptionText; opacity: 1 } - } - - transitions: Transition { - from: "*"; to: "Details"; reversible: true - SequentialAnimation { - NumberAnimation { duration: 200; properties: "height"; easing.type: Easing.OutQuad } - NumberAnimation { duration: 200; properties: "opacity" } - } - } - } - } - } - - ListView { - id: list - x: 10; y: 10 - width: parent.width - 20; height: parent.height - 20 - model: feedModel - delegate: feedDelegate - } -} -- cgit v0.12