git.iko.soy/unity8
on e375178 help sign in
unity8/Dash/DashPreview.qml
218 lines 6.7 kB history raw
1/*
2 * Copyright (C) 2013 Canonical, Ltd.
3 *
4 * This program is free software; you can redistribute it and/or modify
5 * it under the terms of the GNU General Public License as published by
6 * the Free Software Foundation; version 3.
7 *
8 * This program is distributed in the hope that it will be useful,
9 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11 * GNU General Public License for more details.
12 *
13 * You should have received a copy of the GNU General Public License
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
15 */
17import QtQuick 2.0
18import Ubuntu.Components 0.1
20Rectangle {
21 id: root
22 property string title: ""
23 property url url: ""
24 property real previewWidthRatio: 0.5
25 property bool playable: false
26 property bool forceSquare: false
27 property Component buttons
28 property Component caption
29 property Component description
31 readonly property bool narrowMode: width <= height
32 readonly property int contentSpacing: units.gu(3)
34 signal close()
35 signal previewImageClicked()
37 color: Qt.rgba(0, 0, 0, .3)
38 clip: true
40 Connections {
41 target: shell.applicationManager
42 onMainStageFocusedApplicationChanged: {
43 root.close();
44 }
45 onSideStageFocusedApplicationChanged: {
46 root.close();
47 }
48 }
50 MouseArea {
51 anchors.fill: parent
52 }
54 Item {
55 id: headerRow
56 height: units.gu(4)
57 anchors {
58 top: parent.top
59 left: parent.left
60 right: parent.right
61 margins: root.contentSpacing
62 }
64 MouseArea {
65 anchors {
66 fill: parent
67 leftMargin: -root.contentSpacing
68 rightMargin: -root.contentSpacing
69 topMargin: -root.contentSpacing
70 }
72 onClicked: root.close();
73 }
75 Item {
76 id: labelItem
77 anchors {
78 fill: parent
79 rightMargin: closePreviewImage.width + spacing
80 }
82 property int spacing: units.gu(2)
84 Label {
85 id: title
86 objectName: "titleLabel"
87 anchors {
88 left: parent.left
89 right: parent.right
90 }
92 elide: Text.ElideRight
93 fontSize: "x-large"
94 font.weight: Font.Light
95 color: "#f3f3e7"
96 opacity: 0.9
97 text: root.title
98 style: Text.Raised
99 styleColor: "black"
100 }
101 Image {
102 id: closePreviewImage
103 source: "graphics/tablet/icon_close_preview.png"
104 width: units.gu(4)
105 height: units.gu(1.5)
106 anchors {
107 bottom: title.bottom
108 bottomMargin: units.dp(7)
109 left: parent.left
110 leftMargin: title.paintedWidth + labelItem.spacing
111 }
112 }
113 }
114 }
116 Row {
117 id: contentRow
118 anchors {
119 left: parent.left
120 right: parent.right
121 top: headerRow.bottom
122 bottom: parent.bottom
123 margins: root.contentSpacing
124 }
126 spacing: units.gu(2)
128 Flickable {
129 id: leftFlickable
130 anchors.top: parent.top
131 anchors.bottom: parent.bottom
132 width: root.narrowMode ? contentRow.width : contentRow.width * root.previewWidthRatio
133 contentHeight: leftColumn.height
134 clip: true
136 Column {
137 id: leftColumn
138 objectName: "leftColumn"
139 anchors {
140 left: parent.left
141 right: parent.right
142 }
143 height: childrenRect.height
144 spacing: root.contentSpacing
146 // TODO: replace this UbuntuShape with the Video component once that lands
147 // with the player.
148 UbuntuShape {
149 id: urlLoader
150 anchors.left: parent.left
151 anchors.right: parent.right
152 height: root.forceSquare ? width : width * previewImage.sourceSize.height / previewImage.sourceSize.width
153 radius: "medium"
154 image: Image {
155 id: previewImage
156 asynchronous: true
157 source: root.url
158 fillMode: Image.PreserveAspectCrop
159 }
161 Image {
162 objectName: "playButton"
163 anchors.centerIn: parent
164 visible: root.playable
165 readonly property bool bigButton: parent.width > units.gu(40)
166 width: bigButton ? units.gu(8) : units.gu(4.5)
167 height: width
168 source: "graphics/play_button%1%2.png".arg(previewImageMouseArea.pressed ? "_active" : "").arg(bigButton ? "_big" : "")
169 }
171 MouseArea {
172 id: previewImageMouseArea
173 anchors.fill: parent
174 onClicked: root.previewImageClicked()
175 }
176 }
177 Loader {
178 id: buttonLoader
179 anchors.left: parent.left
180 anchors.right: parent.right
181 sourceComponent: root.buttons
182 }
183 Loader {
184 id: captionLoader
185 anchors.left: parent.left
186 anchors.right: parent.right
187 sourceComponent: root.caption
188 }
189 }
190 }
192 Flickable {
193 id: rightFlickable
194 anchors.top: parent.top
195 anchors.bottom: parent.bottom
196 width: narrowMode ? 0 : (contentRow.width - leftColumn.width - contentRow.spacing)
197 contentHeight: rightColumn.height
198 clip: true
200 Column {
201 id: rightColumn
202 objectName: "rightColumn"
203 height: childrenRect.height
204 anchors {
205 left: parent.left
206 right: parent.right
207 }
208 }
209 }
210 }
212 Loader {
213 parent: root.narrowMode ? leftColumn : rightColumn
214 anchors.left: parent.left
215 anchors.right: parent.right
216 sourceComponent: root.description
217 }