Merge lp:~fboucault/ubuntu-ui-toolkit/rtl_support into lp:ubuntu-ui-toolkit

Proposed by Florian Boucault
Status: Merged
Approved by: Zsombor Egri
Approved revision: 908
Merged at revision: 920
Proposed branch: lp:~fboucault/ubuntu-ui-toolkit/rtl_support
Merge into: lp:ubuntu-ui-toolkit
Prerequisite: lp:~fboucault/ubuntu-ui-toolkit/gallery_cleaner_responsiveness
Diff against target: 334 lines (+79/-7)
19 files modified
examples/ubuntu-ui-toolkit-gallery/TemplateFlow.qml (+1/-0)
examples/ubuntu-ui-toolkit-gallery/TemplateRow.qml (+12/-0)
examples/ubuntu-ui-toolkit-gallery/TemplateSection.qml (+1/-0)
examples/ubuntu-ui-toolkit-gallery/TemplateSectionNavigation.qml (+3/-0)
examples/ubuntu-ui-toolkit-gallery/ubuntu-ui-toolkit-gallery.qml (+3/-0)
modules/Ubuntu/Components/Label.qml (+12/-0)
modules/Ubuntu/Components/ListItems/Empty.qml (+5/-0)
modules/Ubuntu/Components/Popups/PopupBase.qml (+3/-0)
modules/Ubuntu/Components/Slider.qml (+15/-4)
modules/Ubuntu/Components/TextArea.qml (+3/-0)
modules/Ubuntu/Components/TextField.qml (+3/-0)
modules/Ubuntu/Components/Themes/Ambiance/ButtonStyle.qml (+3/-0)
modules/Ubuntu/Components/Themes/Ambiance/HeaderStyle.qml (+2/-0)
modules/Ubuntu/Components/Themes/Ambiance/PartialColorize.qml (+4/-2)
modules/Ubuntu/Components/Themes/Ambiance/PartialColorizeUbuntuShape.qml (+1/-1)
modules/Ubuntu/Components/Themes/Ambiance/ProgressBarStyle.qml (+2/-0)
modules/Ubuntu/Components/Themes/Ambiance/ProgressionVisualStyle.qml (+1/-0)
modules/Ubuntu/Components/Themes/Ambiance/SwitchStyle.qml (+2/-0)
modules/Ubuntu/Components/Toolbar.qml (+3/-0)
To merge this branch: bzr merge lp:~fboucault/ubuntu-ui-toolkit/rtl_support
Reviewer Review Type Date Requested Status
PS Jenkins bot continuous-integration Approve
Zsombor Egri Approve
Review via email: mp+200868@code.launchpad.net

Commit message

Added Right-to-Left languages support to most widgets and to the UI Toolkit Gallery.

The following widgets now behave properly in RTL environments:
  - List Items
  - Popups
  - Slider
  - TextArea
  - TextField
  - Button
  - ProgressBar
  - Toolbar
  - Header
  - Switch

Tabs still need to be reversed.
Relayout issues had to be workarounded (QTBUG 35095) for Label and Row.

To post a comment you must log in.
Revision history for this message
Florian Boucault (fboucault) wrote :

Manual testing is best done by invoking qmlscene with the -reverse switch.
English strings won't automatically reverse though. Adding the following to Label.qml does that for testing purposes:

    horizontalAlignment: Text.AlignLeft

Revision history for this message
PS Jenkins bot (ps-jenkins) wrote :
review: Needs Fixing (continuous-integration)
Revision history for this message
PS Jenkins bot (ps-jenkins) wrote :
review: Needs Fixing (continuous-integration)
Revision history for this message
Zsombor Egri (zsombi) wrote :

Looks good to me.

review: Approve
Revision history for this message
Zsombor Egri (zsombi) wrote :

> Looks good to me.

However I just saw that an extra API has been added to Text... You need to add that to components.api.

review: Needs Fixing
Revision history for this message
Zsombor Egri (zsombi) wrote :

> > Looks good to me.
>
> However I just saw that an extra API has been added to Text... You need to add
> that to components.api.

... or actually make it private/internal so it does not break components.api.

905. By Florian Boucault

Merged trunk

906. By Florian Boucault

Merged from trunk

907. By Florian Boucault

Removed newly introduced public method from Label.

Revision history for this message
PS Jenkins bot (ps-jenkins) wrote :
review: Needs Fixing (continuous-integration)
908. By Florian Boucault

Label: marked onWidthChanged internal as to suppress documentation errors.

Revision history for this message
PS Jenkins bot (ps-jenkins) wrote :
review: Needs Fixing (continuous-integration)
Revision history for this message
Zsombor Egri (zsombi) wrote :

Can go in, hope to get CI also rolling.

review: Approve
Revision history for this message
PS Jenkins bot (ps-jenkins) :
review: Approve (continuous-integration)

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'examples/ubuntu-ui-toolkit-gallery/TemplateFlow.qml'
2--- examples/ubuntu-ui-toolkit-gallery/TemplateFlow.qml 2013-04-24 17:09:29 +0000
3+++ examples/ubuntu-ui-toolkit-gallery/TemplateFlow.qml 2014-01-23 19:11:13 +0000
4@@ -32,6 +32,7 @@
5 Label {
6 id: label
7 text: templateFlow.title
8+ anchors.left: parent.left
9 width: templateFlow.titleWidth
10 y: templateFlow.titleOffset
11 elide: Text.ElideRight
12
13=== modified file 'examples/ubuntu-ui-toolkit-gallery/TemplateRow.qml'
14--- examples/ubuntu-ui-toolkit-gallery/TemplateRow.qml 2013-04-24 17:09:29 +0000
15+++ examples/ubuntu-ui-toolkit-gallery/TemplateRow.qml 2014-01-23 19:11:13 +0000
16@@ -32,6 +32,7 @@
17 id: label
18 text: templateRow.title
19 width: templateRow.titleWidth
20+ anchors.left: parent.left
21 anchors.verticalCenter: contentRow.verticalCenter
22 elide: Text.ElideRight
23 font.weight: Font.Light
24@@ -44,5 +45,16 @@
25 anchors.leftMargin: units.gu(2)
26 anchors.right: parent.right
27 spacing: units.gu(2)
28+
29+ /* FIXME: workaround for QTBUG 35095 where Row's content is not relaidout
30+ when the width changes and LayoutMirroring is enabled.
31+
32+ Ref.: https://bugreports.qt-project.org/browse/QTBUG-35095
33+ */
34+ onWidthChanged: if (LayoutMirroring.enabled) forceRelayout()
35+
36+ function forceRelayout() {
37+ spacing = spacing + 0.00001;
38+ }
39 }
40 }
41
42=== modified file 'examples/ubuntu-ui-toolkit-gallery/TemplateSection.qml'
43--- examples/ubuntu-ui-toolkit-gallery/TemplateSection.qml 2013-04-24 17:09:29 +0000
44+++ examples/ubuntu-ui-toolkit-gallery/TemplateSection.qml 2014-01-23 19:11:13 +0000
45@@ -34,6 +34,7 @@
46 id: label
47 text: templateSection.title
48 fontSize: "large"
49+ anchors.left: parent.left
50 }
51
52 WebLink {
53
54=== modified file 'examples/ubuntu-ui-toolkit-gallery/TemplateSectionNavigation.qml'
55--- examples/ubuntu-ui-toolkit-gallery/TemplateSectionNavigation.qml 2013-04-24 17:09:29 +0000
56+++ examples/ubuntu-ui-toolkit-gallery/TemplateSectionNavigation.qml 2014-01-23 19:11:13 +0000
57@@ -33,6 +33,7 @@
58 id: label
59 text: templateSection.title
60 fontSize: "large"
61+ anchors.left: parent.left
62 }
63
64 WebLink {
65@@ -43,6 +44,7 @@
66 visible: documentation != ""
67 fontSize: "small"
68 opacity: 0.3
69+ anchors.left: parent.left
70 }
71
72 WebLink {
73@@ -50,6 +52,7 @@
74 url: templateSection.designUrl
75 fontSize: "small"
76 opacity: 0.3
77+ anchors.left: parent.left
78 }
79
80 Image {
81
82=== modified file 'examples/ubuntu-ui-toolkit-gallery/ubuntu-ui-toolkit-gallery.qml'
83--- examples/ubuntu-ui-toolkit-gallery/ubuntu-ui-toolkit-gallery.qml 2014-01-07 19:40:29 +0000
84+++ examples/ubuntu-ui-toolkit-gallery/ubuntu-ui-toolkit-gallery.qml 2014-01-23 19:11:13 +0000
85@@ -36,6 +36,9 @@
86 */
87 automaticOrientation: true
88
89+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
90+ LayoutMirroring.childrenInherit: true
91+
92 state: width >= units.gu(80) ? "wide" : "narrow"
93 states: [
94 State {
95
96=== modified file 'modules/Ubuntu/Components/Label.qml'
97--- modules/Ubuntu/Components/Label.qml 2013-07-04 21:36:23 +0000
98+++ modules/Ubuntu/Components/Label.qml 2014-01-23 19:11:13 +0000
99@@ -57,4 +57,16 @@
100 font.pixelSize: FontUtils.sizeToPixels(fontSize)
101 font.family: "Ubuntu"
102 color: Theme.palette.selected.backgroundText
103+
104+ /* FIXME: workaround for QTBUG 35095 where Text's alignment is incorrect
105+ when the width changes and LayoutMirroring is enabled.
106+
107+ Ref.: https://bugreports.qt-project.org/browse/QTBUG-35095
108+ */
109+ /*! \internal */
110+ onWidthChanged: if (LayoutMirroring.enabled) {
111+ // force a relayout
112+ lineHeight += 0.00001;
113+ lineHeight -= 0.00001;
114+ }
115 }
116
117=== modified file 'modules/Ubuntu/Components/ListItems/Empty.qml'
118--- modules/Ubuntu/Components/ListItems/Empty.qml 2013-12-23 14:01:58 +0000
119+++ modules/Ubuntu/Components/ListItems/Empty.qml 2014-01-23 19:11:13 +0000
120@@ -184,6 +184,9 @@
121 // Keep compatible with the old version
122 height: implicitHeight
123
124+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
125+ LayoutMirroring.childrenInherit: true
126+
127 /*! \internal */
128 QtObject {
129 id: priv
130@@ -347,6 +350,8 @@
131 top: parent.top
132 bottom: parent.bottom
133 }
134+ LayoutMirroring.enabled: false
135+ LayoutMirroring.childrenInherit: true
136
137 Item {
138 id: confirmRemovalDialog
139
140=== modified file 'modules/Ubuntu/Components/Popups/PopupBase.qml'
141--- modules/Ubuntu/Components/Popups/PopupBase.qml 2013-06-26 19:25:09 +0000
142+++ modules/Ubuntu/Components/Popups/PopupBase.qml 2014-01-23 19:11:13 +0000
143@@ -56,6 +56,9 @@
144 automaticOrientation: stateWrapper.rootItem && stateWrapper.rootItem.automaticOrientation ?
145 stateWrapper.rootItem.automaticOrientation : false
146
147+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
148+ LayoutMirroring.childrenInherit: true
149+
150 /*!
151 \preliminary
152 Make the popup visible. Reparent to the background area object first if needed.
153
154=== modified file 'modules/Ubuntu/Components/Slider.qml'
155--- modules/Ubuntu/Components/Slider.qml 2013-08-07 13:42:54 +0000
156+++ modules/Ubuntu/Components/Slider.qml 2014-01-23 19:11:13 +0000
157@@ -141,13 +141,24 @@
158 property real dragInitNormalizedValue: 0.0
159
160 function normalizedValueFromValue(value) {
161- return MathUtils.clampAndProject(value, slider.minimumValue,
162- slider.maximumValue, 0.0, 1.0);
163+ if (Qt.application.layoutDirection == Qt.RightToLeft) {
164+ return MathUtils.clampAndProject(value, slider.minimumValue,
165+ slider.maximumValue, 1.0, 0.0);
166+ } else {
167+ return MathUtils.clampAndProject(value, slider.minimumValue,
168+ slider.maximumValue, 0.0, 1.0);
169+ }
170+
171 }
172
173 function valueFromNormalizedValue(normalizedValue) {
174- return MathUtils.lerp(MathUtils.clamp(normalizedValue, 0.0, 1.0),
175- slider.minimumValue, slider.maximumValue);
176+ if (Qt.application.layoutDirection == Qt.RightToLeft) {
177+ return MathUtils.lerp(MathUtils.clamp(normalizedValue, 0.0, 1.0),
178+ slider.maximumValue, slider.minimumValue);
179+ } else {
180+ return MathUtils.lerp(MathUtils.clamp(normalizedValue, 0.0, 1.0),
181+ slider.minimumValue, slider.maximumValue);
182+ }
183 }
184
185 /* Mimic the behaviour of the 'pressed' property with one important difference:
186
187=== modified file 'modules/Ubuntu/Components/TextArea.qml'
188--- modules/Ubuntu/Components/TextArea.qml 2013-11-06 22:17:05 +0000
189+++ modules/Ubuntu/Components/TextArea.qml 2014-01-23 19:11:13 +0000
190@@ -741,6 +741,9 @@
191 /*!\internal */
192 onHeightChanged: internal.inputAreaHeight = control.height - 2 * internal.frameSpacing
193
194+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
195+ LayoutMirroring.childrenInherit: true
196+
197 /*!\internal */
198 property alias __internal: internal
199 QtObject {
200
201=== modified file 'modules/Ubuntu/Components/TextField.qml'
202--- modules/Ubuntu/Components/TextField.qml 2014-01-13 15:23:25 +0000
203+++ modules/Ubuntu/Components/TextField.qml 2014-01-23 19:11:13 +0000
204@@ -809,6 +809,9 @@
205 control.focus = false;
206 }
207
208+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
209+ LayoutMirroring.childrenInherit: true
210+
211 // grab clicks from the area between the frame and the input
212 MouseArea {
213 anchors.fill: parent
214
215=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/ButtonStyle.qml'
216--- modules/Ubuntu/Components/Themes/Ambiance/ButtonStyle.qml 2013-07-05 12:33:02 +0000
217+++ modules/Ubuntu/Components/Themes/Ambiance/ButtonStyle.qml 2014-01-23 19:11:13 +0000
218@@ -33,6 +33,9 @@
219 implicitWidth: Math.max(minimumWidth, foreground.implicitWidth + 2*horizontalPadding)
220 implicitHeight: units.gu(5)
221
222+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
223+ LayoutMirroring.childrenInherit: true
224+
225 /* The proxy is necessary because Gradient.stops and GradientStop.color are
226 non-NOTIFYable properties. They cannot be written to so it is fine but
227 the proxy avoids the warnings.
228
229=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/HeaderStyle.qml'
230--- modules/Ubuntu/Components/Themes/Ambiance/HeaderStyle.qml 2013-11-12 06:41:24 +0000
231+++ modules/Ubuntu/Components/Themes/Ambiance/HeaderStyle.qml 2014-01-23 19:11:13 +0000
232@@ -72,6 +72,8 @@
233 height: headerStyle.contentHeight
234
235 Label {
236+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
237+
238 anchors {
239 left: parent.left
240 verticalCenter: parent.verticalCenter
241
242=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/PartialColorize.qml'
243--- modules/Ubuntu/Components/Themes/Ambiance/PartialColorize.qml 2013-08-01 14:05:39 +0000
244+++ modules/Ubuntu/Components/Themes/Ambiance/PartialColorize.qml 2014-01-23 19:11:13 +0000
245@@ -32,7 +32,9 @@
246 property color leftColor
247 property color rightColor
248 property real progress
249-
250+ property bool mirror: false
251+ property string texCoord: mirror ? "1.0 - qt_TexCoord0.x" : "qt_TexCoord0.x"
252+
253 fragmentShader: "
254 varying highp vec2 qt_TexCoord0;
255 uniform sampler2D source;
256@@ -43,7 +45,7 @@
257
258 void main() {
259 lowp vec4 sourceColor = texture2D(source, qt_TexCoord0);
260- lowp vec4 newColor = mix(leftColor, rightColor, step(progress, qt_TexCoord0.x));
261+ lowp vec4 newColor = mix(leftColor, rightColor, step(progress, " + texCoord + "));
262 gl_FragColor = newColor * sourceColor.a * qt_Opacity;
263 }"
264 }
265
266=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/PartialColorizeUbuntuShape.qml'
267--- modules/Ubuntu/Components/Themes/Ambiance/PartialColorizeUbuntuShape.qml 2013-08-02 12:13:33 +0000
268+++ modules/Ubuntu/Components/Themes/Ambiance/PartialColorizeUbuntuShape.qml 2014-01-23 19:11:13 +0000
269@@ -27,7 +27,7 @@
270
271 void main() {
272 lowp vec4 color = texture2D(source, qt_TexCoord0);
273- lowp vec4 newColor = mix(leftColor, rightColor, step(progress, qt_TexCoord0.x));
274+ lowp vec4 newColor = mix(leftColor, rightColor, step(progress, " + texCoord + "));
275 highp float opacity = (1.0 - color.r / max(1.0/256.0, color.a));
276 lowp vec4 result = opacity * vec4(0.0, 0.0, 0.0, 1.0) + vec4(1.0 - opacity) * newColor;
277 gl_FragColor = vec4(result.rgb * result.a, result.a) * color.a * qt_Opacity;
278
279=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/ProgressBarStyle.qml'
280--- modules/Ubuntu/Components/Themes/Ambiance/ProgressBarStyle.qml 2013-08-07 12:26:36 +0000
281+++ modules/Ubuntu/Components/Themes/Ambiance/ProgressBarStyle.qml 2014-01-23 19:11:13 +0000
282@@ -46,6 +46,7 @@
283 progress: progressBarStyle.progress
284 leftColor: Theme.palette.selected.foreground
285 rightColor: Theme.palette.normal.base
286+ mirror: Qt.application.layoutDirection == Qt.RightToLeft
287 }
288
289 Label {
290@@ -74,5 +75,6 @@
291 leftColor: Theme.palette.selected.foregroundText
292 rightColor: Theme.palette.normal.baseText
293 progress: (progressBarStyle.progress * background.width - valueLabel.x) / valueLabel.width
294+ mirror: Qt.application.layoutDirection == Qt.RightToLeft
295 }
296 }
297
298=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/ProgressionVisualStyle.qml'
299--- modules/Ubuntu/Components/Themes/Ambiance/ProgressionVisualStyle.qml 2013-12-09 12:23:15 +0000
300+++ modules/Ubuntu/Components/Themes/Ambiance/ProgressionVisualStyle.qml 2014-01-23 19:11:13 +0000
301@@ -34,6 +34,7 @@
302 }
303
304 opacity: enabled ? 1.0 : 0.5
305+ mirror: Qt.application.layoutDirection == Qt.RightToLeft
306 }
307
308 Image {
309
310=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/SwitchStyle.qml'
311--- modules/Ubuntu/Components/Themes/Ambiance/SwitchStyle.qml 2013-09-02 09:08:52 +0000
312+++ modules/Ubuntu/Components/Themes/Ambiance/SwitchStyle.qml 2014-01-23 19:11:13 +0000
313@@ -36,6 +36,8 @@
314 implicitWidth: units.gu(10)
315 implicitHeight: units.gu(5)
316 opacity: styledItem.enabled ? 1.0 : 0.5
317+ LayoutMirroring.enabled: false
318+ LayoutMirroring.childrenInherit: true
319
320 UbuntuShape {
321 id: background
322
323=== modified file 'modules/Ubuntu/Components/Toolbar.qml'
324--- modules/Ubuntu/Components/Toolbar.qml 2013-12-02 21:25:26 +0000
325+++ modules/Ubuntu/Components/Toolbar.qml 2014-01-23 19:11:13 +0000
326@@ -33,6 +33,9 @@
327 }
328 height: background.height
329
330+ LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft
331+ LayoutMirroring.childrenInherit: true
332+
333 // Closing of the toolbar on app contents ineraction is handled by the Page.
334 __closeOnContentsClicks: false
335

Subscribers

People subscribed via source and target branches

to status/vote changes: