on xenial help sign in
Fade in different components as design wants
f91fa3cMichael Terry
qml/Greeter/Greeter.qml+9
@@ -65,6 +65,15 @@ Showable {
65 }
65 }
66 source: greeter.background
66 source: greeter.background
67 fillMode: Image.PreserveAspectCrop
67 fillMode: Image.PreserveAspectCrop
68+
69+ StandardAnimation {
70+ running: true
71+ target: backgroundImage
72+ property: "opacity"
73+ from: 0.0
74+ to: 1.0
75+ duration: 800
76+ }
68 }
77 }
69
78
70 Loader {
79 Loader {
qml/Greeter/GreeterContent.qml+50−7
@@ -32,12 +32,6 @@ MouseArea {
32 signal selected(int uid)
32 signal selected(int uid)
33 signal unlocked(int uid)
33 signal unlocked(int uid)
34
34
35− Rectangle {
36− anchors.fill: parent
37− color: "black"
38− opacity: 0.4
39− }
40−
41 MouseArea {
35 MouseArea {
42 id: teasingMouseArea
36 id: teasingMouseArea
43 anchors.fill: parent
37 anchors.fill: parent
@@ -93,6 +87,7 @@ MouseArea {
93 objectName: "infographics"
87 objectName: "infographics"
94 height: narrowMode ? parent.height : 0.75 * parent.height
88 height: narrowMode ? parent.height : 0.75 * parent.height
95 model: greeterContentLoader.infographicModel
89 model: greeterContentLoader.infographicModel
90+ opacity: 0.0
96
91
97 property string selectedUser
92 property string selectedUser
98 property string infographicUser: AccountsService.statsWelcomeScreen ? selectedUser : ""
93 property string infographicUser: AccountsService.statsWelcomeScreen ? selectedUser : ""
@@ -114,16 +109,64 @@ MouseArea {
114 left: narrowMode ? root.left : loginLoader.right
109 left: narrowMode ? root.left : loginLoader.right
115 right: root.right
110 right: root.right
116 }
111 }
112+
113+ ParallelAnimation {
114+ id: infoFadeAnimation
115+ StandardAnimation {
116+ target: infographics
117+ property: "opacity"
118+ from: 0.0
119+ to: 1.0
120+ duration: 800
121+ }
122+ StandardAnimation {
123+ target: infographics
124+ property: "scale"
125+ from: 0.9
126+ to: 1.0
127+ duration: 800
128+ }
129+ }
130+
131+ Timer {
132+ running: true
133+ interval: 200
134+ onTriggered: infoFadeAnimation.start()
135+ }
117 }
136 }
118
137
119 Clock {
138 Clock {
120 id: clock
139 id: clock
121− visible: narrowMode
140+ opacity: 0.0
122
141
123 anchors {
142 anchors {
124 top: parent.top
143 top: parent.top
125 topMargin: units.gu(2)
144 topMargin: units.gu(2)
126 horizontalCenter: parent.horizontalCenter
145 horizontalCenter: parent.horizontalCenter
127 }
146 }
147+
148+ ParallelAnimation {
149+ id: clockFadeAnimation
150+ StandardAnimation {
151+ target: clock
152+ property: "opacity"
153+ from: 0.0
154+ to: 1.0
155+ duration: 600
156+ }
157+ StandardAnimation {
158+ target: clock
159+ property: "scale"
160+ from: 0.9
161+ to: 1.0
162+ duration: 600
163+ }
164+ }
165+
166+ Timer {
167+ running: narrowMode
168+ interval: 600
169+ onTriggered: clockFadeAnimation.start()
170+ }
128 }
171 }
129}
172}
qml/Greeter/Infographics.qml+4−3
@@ -24,7 +24,7 @@ Item {
24
24
25 property var model
25 property var model
26
26
27− property int animDuration: 10
27+ property int animDuration: 2
28
28
29 Connections {
29 Connections {
30 target: model
30 target: model
@@ -46,6 +46,9 @@ Item {
46
46
47 dotShowAnimTimer.startFromBeginning()
47 dotShowAnimTimer.startFromBeginning()
48 notification.showAnim.start()
48 notification.showAnim.start()
49+
50+ // First show will be very fast, after that we properly animate them
51+ animDuration = 10
49 }
52 }
50
53
51 function startHideAnimation() {
54 function startHideAnimation() {
@@ -59,8 +62,6 @@ Item {
59
62
60 visible: model.label !== ""
63 visible: model.label !== ""
61
64
62− Component.onCompleted: startShowAnimation()
63−
64 Item {
65 Item {
65 id: dataCircle
66 id: dataCircle
66 objectName: "dataCircle"
67 objectName: "dataCircle"
qml/GreeterShell.qml+7−1
@@ -178,10 +178,16 @@ BasicShell {
178 hides: [launcher]
178 hides: [launcher]
179 available: !edgeDemo.active
179 available: !edgeDemo.active
180 }
180 }
181− fullscreenMode: false
181+ fullscreenMode: initialPanelDelay.running
182 searchVisible: false
182 searchVisible: false
183 }
183 }
184
184
185+ Timer {
186+ id: initialPanelDelay
187+ running: true
188+ interval: 300
189+ }
190+
185 Launcher {
191 Launcher {
186 id: launcher
192 id: launcher
187
193
qml/Panel/Panel.qml+1−1
@@ -62,7 +62,7 @@ Item {
62 height: __panelMinusSeparatorLineHeight
62 height: __panelMinusSeparatorLineHeight
63 y: 0
63 y: 0
64
64
65− Behavior on y { StandardAnimation {} }
65+ Behavior on y { StandardAnimation {duration: 500} }
66 }
66 }
67
67
68 PanelSeparatorLine {
68 PanelSeparatorLine {