← Back to branch summary

~ci-train-bot/ubuntu-settings-components/ubuntu-settings-components-ubuntu-zesty-2202

« back to all changes in this revision

Viewing changes to plugins/Ubuntu/Settings/Components/MessageHeader.qml

  • Committer: Bileto Bot
  • Date: 2016-10-24 11:32:00 UTC
  • mfrom: (146.3.110 slots-layout)
  • Revision ID: ci-train-bot@canonical.com-20161024113200-85dvkl9m1o0msi5i
* Menus: rewrite components using ListItemLayout's and SlotsLayout's
* Bump revision to 0.10, as per Components removal

Show diffs side-by-side

added added

removed removed

Lines of Context:
plugins/Ubuntu/Settings/Components/MessageHeader.qml
1
1
/*
2
 
 * Copyright 2013 Canonical Ltd.
 
2
 * Copyright 2013-2016 Canonical Ltd.
3
3
 *
4
4
 * This program is free software; you can redistribute it and/or modify
5
5
 * it under the terms of the GNU Lesser General Public License as published by
16
16
 * Authors:
17
17
 *      Renato Araujo Oliveira Filho <renato@canonical.com>
18
18
 *      Olivier Tilloy <olivier.tilloy@canonical.com>
 
19
 *      Marco Trevisan <marco.trevisan@canonical.com>
19
20
 */
20
21
 
21
22
import QtQuick 2.4
22
23
import Ubuntu.Components 1.3
23
 
import QtQuick.Layouts 1.1
24
24
 
25
25
Item {
26
26
    id: messageHeader
27
27
 
28
28
    property alias avatar: avatarImage.source
29
29
    property alias icon: iconImage.source
30
 
    property alias title: titleText.text
31
30
    property alias time: timeText.text
32
 
    property alias body: bodyText.text
 
31
    property alias title: itemLayout.title
 
32
    property alias body: itemLayout.summary
33
33
 
34
34
    signal iconClicked()
35
35
 
36
 
    implicitHeight: layout.height
 
36
    implicitHeight: itemLayout.height
 
37
    anchors { right: parent.right; left: parent.left }
37
38
 
38
39
    function shakeIcon() {
39
40
        shake.restart();
40
41
    }
41
42
 
42
 
    RowLayout {
43
 
        id: layout
44
 
        anchors {
45
 
            left: parent.left
46
 
            right: parent.right
47
 
            rightMargin: units.gu(4)
48
 
        }
49
 
        spacing: units.gu(2)
50
 
 
51
 
        UbuntuShapeForItem {
52
 
            Layout.preferredWidth: units.gu(6)
53
 
            Layout.preferredHeight: units.gu(6)
54
 
 
55
 
            image: avatarImage
 
43
    ListItemLayout {
 
44
        id: itemLayout
 
45
 
 
46
        UbuntuShape {
 
47
            width: units.gu(6)
 
48
            height: width
 
49
 
 
50
            SlotsLayout.position: SlotsLayout.Leading
 
51
 
 
52
            source: ShaderEffectSource {
 
53
                sourceItem: avatarImage
 
54
                hideSource: true
 
55
            }
56
56
            Icon {
57
57
                id: avatarImage
58
58
                objectName: "avatar"
 
59
                color: Qt.rgba(0.0, 0.0, 0.0, 0.0)
59
60
 
60
 
                color: {
61
 
                    if (String(source).match(/^image:\/\/theme/)) {
62
 
                        return theme.palette.normal.backgroundText;
63
 
                    }
64
 
                    return Qt.rgba(0.0, 0.0, 0.0, 0.0);
 
61
                Binding on color {
 
62
                    when: String(avatarImage.source).match(/^image:\/\/theme/)
 
63
                    value: theme.palette.normal.backgroundText
65
64
                }
66
65
            }
67
66
        }
68
67
 
69
 
        ColumnLayout {
70
 
            Label {
71
 
                id: titleText
72
 
                objectName: "title"
73
 
 
74
 
                maximumLineCount: 1
75
 
                elide: Text.ElideRight
76
 
                font.weight: Font.DemiBold
77
 
                fontSize: "medium"
78
 
 
79
 
                Layout.fillWidth: true
80
 
                // calculate width with regard to the time's incursion into this layout's space.
81
 
                Layout.maximumWidth: layout.width - timeLayout.width - units.gu(4)
82
 
            }
83
 
            spacing: units.gu(0.5)
84
 
 
85
 
            Label {
86
 
                id: bodyText
87
 
                objectName: "body"
88
 
 
89
 
                maximumLineCount: 3
90
 
                wrapMode: Text.WordWrap
91
 
                elide: Text.ElideRight
92
 
                fontSize: "small"
93
 
 
94
 
                Layout.fillWidth: true
95
 
            }
96
 
        }
97
 
    }
98
 
 
99
 
    ColumnLayout {
100
 
        id: timeLayout
101
 
        anchors.right: parent.right
102
 
 
103
 
        Label {
104
 
            id: timeText
105
 
            objectName: "time"
106
 
            anchors.right: parent.right
107
 
 
108
 
            fontSize: "x-small"
109
 
            maximumLineCount: 1
110
 
        }
111
 
        spacing: units.gu(0.5)
 
68
        title.objectName: "title"
 
69
        title.font.weight: Font.DemiBold
 
70
        title.anchors.rightMargin: timeText.width > iconImage.width ? timeText.width - iconImage.width : 0
 
71
 
 
72
        summary.objectName: "body"
 
73
        summary.maximumLineCount: 3
 
74
        summary.wrapMode: Text.WordWrap
 
75
        summary.elide: Text.ElideRight
112
76
 
113
77
        Icon {
114
78
            id: iconImage
115
79
            objectName: "icon"
116
 
            Layout.preferredHeight: units.gu(3)
117
 
            Layout.preferredWidth: units.gu(3)
118
 
            Layout.alignment: Qt.AlignRight
119
80
            color: theme.palette.normal.backgroundText
120
 
 
121
 
            MouseArea {
 
81
            width: units.gu(3)
 
82
            height: width
 
83
            SlotsLayout.position: SlotsLayout.Trailing
 
84
            SlotsLayout.overrideVerticalPositioning: true
 
85
 
 
86
            Binding on y {
 
87
                when: timeText.text.length
 
88
                value: timeText.y + timeText.height + units.gu(0.1)
 
89
            }
 
90
 
 
91
            Binding on anchors.verticalCenter {
 
92
                when: !timeText.text.length
 
93
                value: itemLayout.verticalCenter
 
94
            }
 
95
 
 
96
            AbstractButton {
122
97
                anchors.fill: parent
123
98
                onClicked: messageHeader.iconClicked()
124
99
            }
130
105
            }
131
106
        }
132
107
    }
 
108
 
 
109
    Label {
 
110
        id: timeText
 
111
        objectName: "time"
 
112
        anchors {
 
113
            top: parent.top
 
114
            right: parent.right
 
115
            topMargin: itemLayout.padding.top
 
116
            rightMargin: itemLayout.padding.trailing
 
117
        }
 
118
 
 
119
        fontSize: "x-small"
 
120
        maximumLineCount: 1
 
121
    }
133
122
}