Unity 8
PreviewHeader.qml
1 /*
2  * Copyright (C) 2014,2015 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  */
16 
17 import QtQuick 2.4
18 import Ubuntu.Components 1.3
19 import Dash 0.1
20 import "../"
21 
22 /*! This preview widget shows a header
23  * The title comes in widgetData["title"]
24  * The mascot comes in widgetData["mascot"]
25  * The mascot fall back image comes in widgetData["fallback"]
26  * The subtitle comes in widgetData["subtitle"]
27  * The attributes comes in widgetData["attributes"]
28  * The emblem comes in widgetData["emblem"]
29  */
30 
31 PreviewWidget {
32  id: root
33 
34  implicitHeight: childrenRect.height
35 
36  Item {
37  id: headerRoot
38  objectName: "innerPreviewHeader"
39  readonly property url mascot: root.widgetData["mascot"] || fallback
40  readonly property url fallback: root.widgetData["fallback"] || ""
41  readonly property string title: root.widgetData["title"] || ""
42  readonly property string subtitle: root.widgetData["subtitle"] || ""
43  readonly property var attributes: root.widgetData["attributes"] || null
44  readonly property url emblem: root.widgetData["emblem"] || ""
45  readonly property color fontColor: root.scopeStyle ? root.scopeStyle.foreground : theme.palette.normal.baseText
46 
47  // Rewire the source since we may have unwired it on onStatusChanged
48  onMascotChanged: if (mascotShapeLoader.item) mascotShapeLoader.item.source.source = mascot;
49 
50  implicitHeight: row.height + row.margins * 2
51  width: parent.width
52 
53  Row {
54  id: row
55  objectName: "outerRow"
56 
57  property real margins: units.gu(1)
58 
59  spacing: mascotShapeLoader.active ? margins : 0
60  anchors {
61  top: parent.top; left: parent.left; right: parent.right
62  margins: margins
63  topMargin: 0
64  leftMargin: 0
65  rightMargin: spacing
66  }
67 
68  Loader {
69  id: mascotShapeLoader
70  objectName: "mascotShapeLoader"
71  active: headerRoot.mascot != ""
72  visible: active
73 
74  anchors.verticalCenter: parent.verticalCenter
75  // TODO karni: Icon aspect-ratio is 8:7.5. Revisit these values to avoid fraction of pixels.
76  width: units.gu(6)
77  height: units.gu(5.625)
78  readonly property int maxSize: Math.max(width, height) * 4
79  asynchronous: true
80 
81  sourceComponent: UbuntuShape {
82  objectName: "mascotShape"
83  visible: source.status === Image.Ready
84  sourceFillMode: UbuntuShape.PreserveAspectCrop
85  sourceHorizontalAlignment: UbuntuShape.AlignHCenter
86  sourceVerticalAlignment: UbuntuShape.AlignVCenter
87  aspect: UbuntuShape.Flat
88  source: Image {
89  source: headerRoot.mascot
90  width: source ? mascotShapeLoader.width : 0
91  height: mascotShapeLoader.height
92 
93  sourceSize { width: mascotShapeLoader.maxSize; height: mascotShapeLoader.maxSize }
94  onStatusChanged: if (status === Image.Error) source = headerRoot.fallback;
95  }
96  }
97  }
98 
99  Column {
100  objectName: "column"
101  width: parent.width - x
102  spacing: units.dp(2)
103  anchors.verticalCenter: parent.verticalCenter
104 
105  Item {
106  anchors { left: parent.left; right: parent.right }
107  height: titleLabel.height
108 
109  Label {
110  id: titleLabel
111  objectName: "titleLabel"
112  anchors {
113  left: parent.left;
114  right: iconLoader.right
115  rightMargin: iconLoader.width > 0 ? units.gu(0.5) : 0
116  }
117  elide: Text.ElideRight
118  fontSize: "large"
119  font.weight: Font.Light
120  wrapMode: Text.Wrap
121  color: headerRoot.fontColor
122  text: headerRoot.title
123  }
124 
125  Loader {
126  id: iconLoader
127  active: headerRoot.emblem != ""
128  anchors {
129  bottom: titleLabel.baseline
130  right: parent.right
131  }
132  sourceComponent: Icon {
133  objectName: "emblemIcon"
134  source: headerRoot.emblem
135  color: headerRoot.fontColor
136  height: source != "" ? titleLabel.font.pixelSize : 0
137  // FIXME Workaround for bug https://bugs.launchpad.net/ubuntu/+source/ubuntu-ui-toolkit/+bug/1421293
138  width: implicitWidth > 0 && implicitHeight > 0 ? (implicitWidth / implicitHeight * height) : implicitWidth
139  }
140  }
141  }
142 
143  Loader {
144  active: titleLabel.text && headerRoot.subtitle
145  anchors { left: parent.left; right: parent.right }
146  sourceComponent: Label {
147  id: subtitleLabel
148  objectName: "subtitleLabel"
149  elide: Text.ElideRight
150  fontSize: "x-small"
151  font.weight: Font.Light
152  color: headerRoot.fontColor
153  text: headerRoot.subtitle
154  }
155  }
156 
157  Loader {
158  active: titleLabel.text && headerRoot.attributes
159  anchors { left: parent.left; right: parent.right }
160  sourceComponent: CardAttributes {
161  id: previewAttributes
162  objectName: "previewAttributes"
163  model: headerRoot.attributes
164  }
165  }
166  }
167  }
168  }
169 
170 }