Differential D28103 Diff 77986 src/controls/templates/private/PassiveNotification.qml

Changeset View

Standalone View

View Options

src/controls/templates/private/PassiveNotification.qml

1/* 1​/*
2 * SPDX-FileCopyrightText: 2015 Marco Martin <mart@kde.org> 2​ * SPDX-FileCopyrightText: 2015 Marco Martin <mart@kde.org>
3 * 3​ *
4 * SPDX-License-Identifier: LGPL-2.0-or-later 4​ * SPDX-License-Identifier: LGPL-2.0-or-later
5 */ 5​ */
6 6​
7import QtQuick 2.5 7​import QtQuick 2.12
8import QtQuick.Controls 2.0 as QQC2 8​import QtQuick.Controls 2.3 as Controls
9import QtQuick.Layouts 1.2 9​import QtQuick.Layouts 1.2
10import QtQuick.Window 2.2 10​import QtQuick.Window 2.2
11import QtGraphicalEffects 1.0 11​import QtGraphicalEffects 1.0
12import org.kde.kirigami 2.4 12​import org.kde.kirigami 2.12 as Kirigami
13 13​
14MouseArea { 14​/**
15​ * PassiveNotification is a type for small, passive and inline
16​notifications in the app.
17​ * used to show messages of limited importance that make sense only when
18​ * the user is using the application and wouldn't be suited as a global
19​ * system-wide notification.
20​ * This is not a full-fledged notification system. the applciation should
21​ * use this with care and only one notification should be visible at once per app.
22​*/
23​Controls.Popup {
15 id: root 24​ id: root
16 z: 9999999 ​
17 width: background.width ​
18 height: background.height ​
19 opacity: 0 ​
20 enabled: appearAnimation.appear ​
21 25​
22 anchors { 26​ x: Math.round(parent.width/2 - width/2)
broulikUnsubmitted
Done

Math.round please

broulik: `Math.round` please
23 horizontalCenter: parent.horizontalCenter 27​ y: parent.height - height - Kirigami.Units.smallSpacing
24 bottom: parent.bottom 28​ implicitWidth: Math.max(background ? background.implicitWidth : 0,
25 bottomMargin: Units.gridUnit * 4 29​ contentWidth + leftPadding + rightPadding) + leftInset + rightInset
26 } 30​ implicitHeight: Math.max(background ? background.implicitHeight : 0 ,
31​ contentHeight + topPadding + bottomPadding)+ topInset + bottomInset
32​ height: implicitHeight
33​ width: implicitWidth
34​
35​ topPadding: Kirigami.Units.smallSpacing
broulikUnsubmitted
Not Done

Just padding?

broulik: Just `padding`?
martAuthorUnsubmitted
Not Done

actually, it would make the implicitHeight calculation fail (it's dumb like that and that's why for the new property inset they only added leftInset topInset etcand not a simple inset one)

mart: actually, it would make the implicitHeight calculation fail (it's dumb like that and that's why…
36​ leftPadding: Kirigami.Units.smallSpacing
37​ rightPadding: Kirigami.Units.smallSpacing
38​ bottomPadding: Kirigami.Units.smallSpacing
39​
40​ modal: false
41​ closePolicy: Controls.Popup.NoAutoClose
42​ focus: false
43​ clip: false
44​
27 function showNotification(message, timeout, actionText, callBack) { 45​ function showNotification(message, timeout, actionText, callBack) {
28 if (!message) { 46​ if (!message) {
29 return; 47​ return;
30 } 48​ }
31 appearAnimation.running = false; 49​
32 appearAnimation.appear = true; 50​ let interval = 7000;
33 appearAnimation.running = true; 51​
34 if (timeout == "short") { 52​ if (timeout == "short") {
35 timer.interval = 4000; 53​ interval = 4000;
36 } else if (timeout == "long") { 54​ } else if (timeout == "long") {
37 timer.interval = 12000; 55​ interval = 12000;
38 } else if (timeout > 0) { 56​ } else if (timeout > 0) {
39 timer.interval = timeout; 57​ interval = timeout;
40 } else { ​
41 timer.interval = 7000; ​
42 } ​
43 messageLabel.text = message ? message : ""; ​
44 actionButton.text = actionText ? actionText : ""; ​
45 actionButton.callBack = callBack ? callBack : ""; ​
46 ​
47 timer.stop(); // stop first to ensure it always starts anew ​
48 ​
49 // Only start the timer when the window has focus, to ensure that ​
50 // messages don't get missed on the desktop where it's common to ​
51 //be working with multiple windows at once ​
52 timer.running = Qt.binding(function() { ​
53 return root.Window.active; ​
54 }); ​
55 } 58​ }
56 59​
57 function hideNotification() { 60​ open();
58 appearAnimation.running = false; 61​
59 appearAnimation.appear = false; 62​ for (let i = 0; i < outerLayout.children.length - 3; ++i) {
60 appearAnimation.running = true; 63​ outerLayout.children[i].close();
61 } 64​ }
62 65​
66​ let delegate = delegateComponent.createObject(outerLayout, {
67​ "text": message,
68​ "actionText": actionText || "",
69​ "callBack": callBack || (function(){}),
70​ "interval": interval
broulikUnsubmitted
Done

When I rapidly create new passive popups, I can exceed the limit. Maybe it needs a while loop where it closes without animation or something

broulik: When I rapidly create new passive popups, I can exceed the limit. Maybe it needs a `while` loop…
71​ });
63 72​
64 onClicked: { 73​ // Reorder items to have the last on top
65 appearAnimation.appear = false; 74​ let children = outerLayout.children;
66 appearAnimation.running = true; 75​ for (let i in children) {
76​ children[i].Layout.row = children.length-1-i;
67 } 77​ }
68 ​
69 transform: Translate { ​
70 id: transform ​
71 y: root.height ​
72 } 78​ }
73 79​
74 Timer { 80​ Kirigami.Theme.colorSet: Kirigami.Theme.Complementary
75 id: timer 81​
76 interval: 4000 82​ background: Item {}
77 onTriggered: { 83​
78 appearAnimation.appear = false; 84​ contentItem: GridLayout {
79 appearAnimation.running = true; 85​ id: outerLayout
86​ columns: 1
80 } 87​ }
88​
89​ Component {
90​ id: delegateComponent
91​ Controls.Control {
92​ id: delegate
93​ property alias text: label.text
94​ property alias actionText: actionButton.text
95​ property alias interval: timer.interval
96​ property var callBack
97​ Layout.alignment: Qt.AlignCenter
98​ Layout.bottomMargin: -delegate.height
99​ opacity: 0
100​ function close() {
101​ closeAnim.running = true;
81 } 102​ }
103​
104​ Component.onCompleted: openAnim.restart()
82 ParallelAnimation { 105​ ParallelAnimation {
83 id: appearAnimation 106​ id: openAnim
84 property bool appear: true 107​ OpacityAnimator {
85 NumberAnimation { 108​ target: delegate
86 target: root 109​ from: 0
87 properties: "opacity" 110​ to: 1
88 to: appearAnimation.appear ? 1 : 0 111​ duration: Kirigami.Units.longDuration
89 duration: Units.longDuration ​
90 easing.type: Easing.InOutQuad 112​ easing.type: Easing.InOutQuad
91 } 113​ }
92 NumberAnimation { 114​ NumberAnimation {
93 target: transform 115​ target: delegate
94 properties: "y" 116​ property: "Layout.bottomMargin"
95 to: appearAnimation.appear ? 0 : background.height 117​ from: -delegate.height
96 duration: Units.longDuration 118​ to: 0
97 easing.type: appearAnimation.appear ? Easing.OutQuad : Easing.InQuad 119​ duration: Kirigami.Units.longDuration
120​ easing.type: Easing.InOutQuad
98 } 121​ }
99 } 122​ }
100 123​
101 Item { 124​ SequentialAnimation {
102 id: background 125​ id: closeAnim
103 width: backgroundRect.width + Units.gridUnit 126​ ParallelAnimation {
104 height: backgroundRect.height + Units.gridUnit 127​ OpacityAnimator {
105 Rectangle { 128​ target: delegate
106 id: backgroundRect 129​ from: 1
107 anchors.centerIn: parent 130​ to: 0
108 radius: Units.smallSpacing 131​ duration: Kirigami.Units.longDuration
109 color: Theme.textColor 132​ easing.type: Easing.InOutQuad
110 opacity: 0.6 ​
111 width: mainLayout.width + Math.round((height - mainLayout.height)) ​
112 height: Math.max(mainLayout.height + Units.smallSpacing*2, Units.gridUnit*2) ​
113 } 133​ }
114 RowLayout { 134​ NumberAnimation {
135​ target: delegate
136​ property: "Layout.bottomMargin"
137​ to: -delegate.height
138​ duration: Kirigami.Units.longDuration
139​ easing.type: Easing.InOutQuad
140​ }
141​ }
142​ ScriptAction {
143​ script: delegate.destroy();
144​ }
145​ }
146​
147​ contentItem: RowLayout {
115 id: mainLayout 148​ id: mainLayout
116 anchors.centerIn: parent 149​
117 QQC2.Label { 150​ Kirigami.Theme.colorSet: root.Kirigami.Theme.colorSet
118 id: messageLabel 151​ width: mainLayout.width
119 Layout.maximumWidth: Math.min(root.parent.width - Units.largeSpacing*2, implicitWidth) 152​
120 elide: Text.ElideRight 153​ HoverHandler {
121 wrapMode: Text.WordWrap 154​ id: hover
122 maximumLineCount: 4 ​
123 color: Theme.backgroundColor ​
124 } 155​ }
125 QQC2.Button { 156​ TapHandler {
157​ acceptedButtons: Qt.LeftButton
158​ onTapped: delegate.close();
159​ }
160​ Timer {
161​ id: timer
162​ running: mainLayout.Window.active && root.visible && !hover.hovered
163​ onTriggered: delegate.close();
164​ }
165​
166​ Controls.Label {
167​ id: label
168​ }
169​
170​ Controls.Button {
126 id: actionButton 171​ id: actionButton
127 property var callBack 172​ visible: text.length > 0
128 visible: text != "" ​
129 onClicked: { 173​ onClicked: {
130 appearAnimation.appear = false; 174​ delegate.close();;
131 appearAnimation.running = true; 175​ if (delegate.callBack && (typeof delegate.callBack === "function")) {
132 if (callBack) { 176​ delegate.callBack();
133 callBack(); ​
134 } 177​ }
135 } 178​ }
136 } 179​ }
137 } 180​ }
138 layer.enabled: true 181​ background: Kirigami.ShadowedRectangle {
139 layer.effect: DropShadow { 182​ Kirigami.Theme.colorSet: root.Kirigami.Theme.colorSet
140 horizontalOffset: 0 183​ shadow {
141 verticalOffset: 0 184​ size: Kirigami.Units.gridUnit/2
142 radius: Units.gridUnit 185​ color: Qt.rgba(0, 0, 0, 0.4)
143 samples: 32 186​ yOffset: 2
144 color: Qt.rgba(0, 0, 0, 0.5) ​
145 } 187​ }
188​ radius: Kirigami.Units.smallSpacing * 2
189​ color: Kirigami.Theme.backgroundColor
190​ opacity: 0.6
146 } 191​ }
147} 192​ }
193​ }
194​
195​ Controls.Overlay.modal: Rectangle {
196​ color: Qt.rgba(0, 0, 0, 0.4)
197​ }
198​
199​ Controls.Overlay.modeless: Item {}
200​}
148 201​