-
-
Save hhartz/247953 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import Qt 4.6 | |
| Rectangle { | |
| id: Page | |
| width: 960; height: 720 | |
| color: "#201F25" | |
| Rectangle { | |
| id: Banner | |
| width: parent.width - 20 | |
| height: Logo.height + 20 | |
| anchors.horizontalCenter: parent.horizontalCenter; | |
| y: 10; radius: 10; z: 10; | |
| opacity: 0.9; | |
| gradient: Gradient { | |
| GradientStop { position: 0; color: "#8B0504"; } | |
| GradientStop { position: 1; color: "black"; } | |
| } | |
| Image { | |
| id: Logo | |
| source: "http://static.arstechnica.com/mt-static/plugins/ArsTheme/style/themes/light/images/logo.png" | |
| anchors.verticalCenter: parent.verticalCenter; | |
| x: 15; | |
| } | |
| Text { | |
| text: "News Feed" | |
| color: "white"; | |
| font.bold: true; | |
| font.pixelSize: 36 | |
| style: "Raised" | |
| styleColor: "black" | |
| anchors.centerIn: parent; | |
| } | |
| } | |
| Rectangle { | |
| width: parent.width - 20; | |
| anchors.horizontalCenter: parent.horizontalCenter; | |
| height: Page.height - Banner.height - 30; | |
| y: Banner.height + 20; | |
| color: "#201F25"; | |
| XmlListModel { | |
| id: FeedModel | |
| source: "http://feeds.arstechnica.com/arstechnica/index" | |
| query: "/rss/channel/item" | |
| namespaceDeclarations: "declare namespace media=\"http://search.yahoo.com/mrss/\";" | |
| XmlRole { name: "title"; query: "title/string()" } | |
| XmlRole { name: "author"; query: "author/string()" } | |
| XmlRole { name: "description"; query: "description/string()" } | |
| XmlRole { name: "image"; query: "media:content/@url/string()" } | |
| } | |
| GridView { | |
| id: FeedList; | |
| width: parent.width; | |
| height: parent.height + 200; | |
| model: FeedModel; | |
| z: 0; | |
| property var selected: false; | |
| cellWidth: 300 + 10; | |
| cellHeight: 169 + 10; | |
| delegate: [ | |
| Image { | |
| id: FeedImage; | |
| source: image; | |
| width: 300; | |
| height: 169; | |
| Rectangle { | |
| id: ImageTextBack; | |
| anchors.fill: parent; | |
| color: "black" | |
| opacity: 0.8; | |
| visible: false; | |
| Text { | |
| id: ImageText; | |
| text: title | |
| color: "white"; | |
| wrap: true; | |
| font.pixelSize: 24; | |
| font.bold: true; | |
| anchors.fill: parent; | |
| horizontalAlignment: "AlignHCenter"; | |
| verticalAlignment: "AlignVCenter"; | |
| } | |
| } | |
| MouseRegion { | |
| id: ImageRegion | |
| anchors.fill: parent | |
| hoverEnabled: true | |
| onClicked: { | |
| FeedList.selected = true; | |
| StoryContent.html = "<html><style>\ | |
| body { color: white }\ | |
| img { display: none }\ | |
| a { color: orange }\ | |
| </style><body>\ | |
| <h1>" + title + "</h1>\ | |
| <h3>By: " + author + "</h3>\ | |
| <p>" + description + "</p>\ | |
| </body></html>" | |
| } | |
| } | |
| states: [ | |
| State { | |
| name: "hover" | |
| when: ImageRegion.containsMouse | |
| PropertyChanges { target: ImageTextBack; visible: true; } | |
| } | |
| ] | |
| } | |
| ] | |
| transform: [ | |
| Rotation { | |
| id: ImageWall; | |
| axis { x: 0; y: 1; z:0 } | |
| angle: 0; | |
| } | |
| ] | |
| } | |
| Rectangle { | |
| id: ImageInfo; | |
| height: parent.height; | |
| width: parent.width - 460; | |
| radius: 10; border.color: "white"; | |
| visible: false; | |
| x: 1000 | |
| gradient: Gradient { | |
| GradientStop { position: 0; color: "black"; } | |
| GradientStop { position: 1; color: "#1F1F1F"; } | |
| } | |
| WebView { | |
| id: StoryContent | |
| anchors.fill: parent; | |
| html: "" | |
| } | |
| Rectangle { | |
| id: ButtonLogin | |
| height: 30 | |
| width: 100 | |
| radius: 10 | |
| anchors.bottom: parent.bottom | |
| anchors.bottomMargin: 5 | |
| anchors.horizontalCenter: parent.horizontalCenter | |
| border.color: "#011C00" | |
| gradient: Gradient { | |
| GradientStop { position: 0; color: "#69FF65" } | |
| GradientStop { position: 0.4; color: "#095606" } | |
| GradientStop { position: 0.8; color: "#69FF65" } | |
| GradientStop { position: 1; color: "#095606" } | |
| } | |
| MouseRegion { | |
| anchors.fill: parent; | |
| onClicked: { FeedList.selected = false; } | |
| } | |
| Text { | |
| anchors.centerIn: parent | |
| text: "Close" | |
| font.bold: true | |
| font.pixelSize: 12 | |
| color: "white" | |
| style: "Raised" | |
| styleColor: "black" | |
| } | |
| } | |
| } | |
| states: [ | |
| State { | |
| name: "selected"; | |
| when: FeedList.selected == true | |
| PropertyChanges { target: ImageWall; angle: 40; } | |
| PropertyChanges { target: FeedList; width: 1000; } | |
| PropertyChanges { | |
| target: ImageInfo; | |
| visible: true; | |
| x: Page.width - width - 20; | |
| } | |
| } | |
| ] | |
| transitions: [ | |
| Transition { | |
| from: "*" | |
| to: "selected" | |
| reversible: true | |
| NumberAnimation { | |
| matchProperties: "angle,x" | |
| duration: 300 | |
| } | |
| } | |
| ] | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment