@@ -14,50 +14,73 @@
1414 * along with this program. If not, see <http://www.gnu.org/licenses/>.
1515*/
1616
17−import QtQuick 2.0
18−import Ubuntu.Components 0.1
17+import QtQuick 2.2
18+import Ubuntu.Components 1.1
19+import Ubuntu.Components.Themes 0.1
1920import "../Components"
2021
21−Rectangle {
22+StyledItem {
2223 id: root
23− color: "black"
2424
25− property string name: ""
26− property url image: ""
25+ property string title: ""
26+ property string image: ""
27+ property bool showHeader: true
28+ // mimic API of toolkit's MainView component required by MainViewStyle
29+ property color backgroundColor: theme.palette.normal.background
30+ property color headerColor: backgroundColor
31+ property color footerColor: backgroundColor
2732
28− UbuntuShape {
29− id: iconShape
30− anchors.horizontalCenter: parent.horizontalCenter
31− anchors.verticalCenter: parent.verticalCenter
32− anchors.verticalCenterOffset: -units.gu(4)
33− width: units.gu(8)
34− height: units.gu(7.5)
33+ // FIXME: fake a Theme object as to expose the Palette corresponding to the backgroundColor (see MainViewStyle.qml)
34+ property var theme: QtObject {
35+ property string name: "Ambiance"
36+ property Palette palette: Qt.createQmlObject("import QtQuick 2.2; import Ubuntu.Components.Themes.%1 1.1; Palette {}".arg(theme.name), root, "dynamicPalette");
37+ }
38+
39+ // FIXME: should instead use future toolkit API:
40+ // style: theme.createStyleComponent("MainViewStyle.qml", root)
41+ style: Component { MainViewStyle {theme: root.theme} }
42+
43+ StyledItem {
44+ id: header
45+ anchors {
46+ left: parent.left
47+ right: parent.right
48+ }
3549
36− radius: "medium"
37− borderSource: "none"
50+ visible: root.showHeader
3851
39− image: Image {
40− id: iconImage
41− sourceSize.width: iconShape.width
42− sourceSize.height: iconShape.height
43− source: root.image
44− fillMode: Image.PreserveAspectCrop
52+ // mimic API of toolkit's AppHeader component required by PageHeadStyle
53+ property Item pageStack
54+ property Item contents
55+ property string title: root.title
56+ property var tabsModel
57+ property var config: QtObject {
58+ property color foregroundColor: theme.palette.selected.backgroundText
59+ property var sections
4560 }
61+
62+ // FIXME: should instead use future toolkit API:
63+ // style: theme.createStyleComponent("PageHeadStyle.qml", header)
64+ style: Component { PageHeadStyle {theme: root.theme} }
4665 }
4766
48− Label {
49− text: root.name
50− anchors.horizontalCenter: parent.horizontalCenter
51− anchors.top: iconShape.bottom
52− anchors.topMargin: units.gu(2)
53− fontSize: "large"
67+ Image {
68+ id: overlaidImage
69+ anchors.centerIn: parent
70+ anchors.verticalCenterOffset: root.showHeader ? header.height / 2 : 0
71+ sourceSize {
72+ width: root.width
73+ height: root.height
74+ }
75+ source: root.image
76+ asynchronous: true
77+ cache: false
5478 }
5579
56− WaitingDots {
57− visible: parent.visible
58− anchors.horizontalCenter: parent.horizontalCenter
59− anchors.bottom: parent.bottom
60− anchors.bottomMargin: units.gu(12)
80+ ActivityIndicator {
81+ anchors.centerIn: parent
82+ anchors.verticalCenterOffset: root.showHeader ? header.height / 2 : 0
83+ running: overlaidImage.status == Image.Error || overlaidImage.status == Image.Null
6184 }
6285
6386 MouseArea {