git.iko.soy/unity8
on xenial help sign in
Fix up error label to fit new design tweaks
d38d8b7Michael Terry
qml/Tutorial/TutorialLeft.qml+1−2
compare with xenial
unifiedsplit
@@ -25,9 +25,8 @@ TutorialPage {
25
25
26 title: i18n.tr("Open the launcher")
26 title: i18n.tr("Open the launcher")
27 text: i18n.tr("Short swipe from the left edge.")
27 text: i18n.tr("Short swipe from the left edge.")
28− errorText: i18n.tr("Too far!") + "\n" + i18n.tr("Try again.")
29
28
30− textXOffset: root.launcher.visibleWidth
29+ textXOffset: root.launcher.x + root.launcher.visibleWidth
31
30
32 Connections {
31 Connections {
33 target: root.launcher
32 target: root.launcher
qml/Tutorial/TutorialPage.qml+45−21
@@ -27,9 +27,6 @@ Showable {
27 // This is the block of text displayed below the header
27 // This is the block of text displayed below the header
28 property alias text: textLabel.text
28 property alias text: textLabel.text
29
29
30− // This is the block of text displayed during an error
31− property alias errorText: errorLabel.text
32−
33 // Whether animations are paused
30 // Whether animations are paused
34 property bool paused
31 property bool paused
35
32
@@ -46,7 +43,7 @@ Showable {
46 property alias foreground: foregroundExtra
43 property alias foreground: foregroundExtra
47
44
48 // The text label bottom, so you can position elements relative to it
45 // The text label bottom, so you can position elements relative to it
49− property real textBottom: textLabel.y + textLabel.height
46+ readonly property real textBottom: Math.max(textLabel.y + textLabel.height, errorTextLabel.y + errorTextLabel.height)
50
47
51 // The MouseArea that eats events (so you can adjust size as you will)
48 // The MouseArea that eats events (so you can adjust size as you will)
52 property alias mouseArea: mouseArea
49 property alias mouseArea: mouseArea
@@ -157,21 +154,41 @@ Showable {
157 font.pixelSize: units.gu(2.5)
154 font.pixelSize: units.gu(2.5)
158 }
155 }
159
156
157+ // We use two separate labels like this rather than just changing
158+ // the text of the above labels because we want to know where to place
159+ // sliders (via root.textBottom) without having that place change
160+ // as the text changes length.
160 Label {
161 Label {
161− id: errorLabel
162+ id: errorTitleLabel
162− objectName: "errorLabel"
163+ objectName: "errorTitleLabel"
163 anchors {
164 anchors {
164− top: parent.verticalCenter
165+ top: titleLabel.top
165− topMargin: d.verticalOffset + root.textYOffset
166− left: parent.left
166+ left: titleLabel.left
167− leftMargin: d.sideMargin + d.textXOffset
168 }
167 }
169− width: parent.width - d.sideMargin * 2
168+ width: titleLabel.width
170− horizontalAlignment: Text.AlignLeft
169+ horizontalAlignment: titleLabel.horizontalAlignment
171− wrapMode: Text.Wrap
170+ wrapMode: titleLabel.wrapMode
172− font.weight: Font.Light
171+ font.weight: titleLabel.font.weight
173− font.pixelSize: units.gu(3.5)
172+ font.pixelSize: titleLabel.font.pixelSize
174 opacity: 0
173 opacity: 0
174+ text: i18n.tr("You almost got it!")
175+ }
176+
177+ Label {
178+ id: errorTextLabel
179+ objectName: "errorTextLabel"
180+ anchors {
181+ top: errorTitleLabel.bottom
182+ topMargin: textLabel.anchors.topMargin
183+ left: textLabel.left
184+ }
185+ width: textLabel.width
186+ horizontalAlignment: textLabel.horizontalAlignment
187+ wrapMode: textLabel.wrapMode
188+ font.weight: textLabel.font.weight
189+ font.pixelSize: textLabel.font.pixelSize
190+ opacity: 0
191+ text: i18n.tr("Try again.")
175 }
192 }
176
193
177 // A place for subclasses to add extra widgets
194 // A place for subclasses to add extra widgets
@@ -186,14 +203,14 @@ Showable {
186 when: errorTimer.running
203 when: errorTimer.running
187 PropertyChanges { target: titleLabel; opacity: 0 }
204 PropertyChanges { target: titleLabel; opacity: 0 }
188 PropertyChanges { target: textLabel; opacity: 0 }
205 PropertyChanges { target: textLabel; opacity: 0 }
189− PropertyChanges { target: errorLabel; opacity: 1 }
206+ PropertyChanges { target: errorTitleLabel; opacity: 1 }
207+ PropertyChanges { target: errorTextLabel; opacity: 1 }
190 }
208 }
191
209
192 transitions: Transition {
210 transitions: Transition {
193 to: "errorState"
211 to: "errorState"
194 reversible: true
212 reversible: true
195 SequentialAnimation {
213 SequentialAnimation {
196− id: showErrorAnimation
197 ParallelAnimation {
214 ParallelAnimation {
198 StandardAnimation {
215 StandardAnimation {
199 target: titleLabel
216 target: titleLabel
@@ -206,10 +223,17 @@ Showable {
206 duration: UbuntuAnimation.BriskDuration
223 duration: UbuntuAnimation.BriskDuration
207 }
224 }
208 }
225 }
226+ ParallelAnimation {
209− StandardAnimation {
227+ StandardAnimation {
210− target: errorLabel
228+ target: errorTitleLabel
229+ property: "opacity"
230+ duration: UbuntuAnimation.BriskDuration
231+ }
232+ StandardAnimation {
233+ target: errorTextLabel
211− property: "opacity"
234+ property: "opacity"
212− duration: UbuntuAnimation.BriskDuration
235+ duration: UbuntuAnimation.BriskDuration
236+ }
213 }
237 }
214 }
238 }
215 }
239 }
tests/qmltests/Tutorial/tst_Tutorial.qml+4−2
@@ -250,10 +250,12 @@ Item {
250 var launcher = findChild(shell, "launcher");
250 var launcher = findChild(shell, "launcher");
251 touchFlick(shell, 0, halfHeight, shell.width, halfHeight);
251 touchFlick(shell, 0, halfHeight, shell.width, halfHeight);
252
252
253− var errorLabel = findChild(left, "errorLabel");
253+ var errorTextLabel = findChild(left, "errorTextLabel");
254+ var errorTitleLabel = findChild(left, "errorTitleLabel");
254 tryCompare(launcher, "state", ""); // launcher goes away
255 tryCompare(launcher, "state", ""); // launcher goes away
255 tryCompare(left, "shown", true); // still on left page
256 tryCompare(left, "shown", true); // still on left page
257+ tryCompare(errorTextLabel, "opacity", 1); // show error
256− tryCompare(errorLabel, "opacity", 1); // show error
258+ tryCompare(errorTitleLabel, "opacity", 1); // show error
257 }
259 }
258
260
259 function test_launcherDragBack() {
261 function test_launcherDragBack() {