Merge lp:~faenil/ubuntu-ui-toolkit/moreListItemLayoutDocs into lp:ubuntu-ui-toolkit/staging
- moreListItemLayoutDocs
- Merge into staging
Status: | Merged | ||||
---|---|---|---|---|---|
Approved by: | Andrea Bernabei | ||||
Approved revision: | 1826 | ||||
Merged at revision: | 2040 | ||||
Proposed branch: | lp:~faenil/ubuntu-ui-toolkit/moreListItemLayoutDocs | ||||
Merge into: | lp:ubuntu-ui-toolkit/staging | ||||
Diff against target: |
158 lines (+81/-5) 2 files modified
src/Ubuntu/UbuntuToolkit/privates/threelabelsslot_p.cpp (+6/-0) src/Ubuntu/UbuntuToolkit/uclistitemlayout.cpp (+75/-5) |
||||
To merge this branch: | bzr merge lp:~faenil/ubuntu-ui-toolkit/moreListItemLayoutDocs | ||||
Related bugs: |
|
Reviewer | Review Type | Date Requested | Status |
---|---|---|---|
ubuntu-sdk-build-bot | continuous-integration | Approve | |
Cris Dywan | Approve | ||
Jonas G. Drange (community) | Approve | ||
Review via email: mp+300372@code.launchpad.net |
Commit message
ListItemLayout doc: add elide mode change example and add section about labels default properties values
Description of the change
Add some documentation to ListItemLayout docs, in particular:
- explain that the some properties of ListItemLayout's labels have different default values from what is used by Label component
- explain that changing "elide" also requires disabling wrapping (see bug#1603450)
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1826
No commit message was specified in the merge proposal. Click on the following link and set the commit message (if you want a jenkins rebuild you need to trigger it yourself):
https:/
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1826
No commit message was specified in the merge proposal. Click on the following link and set the commit message (if you want a jenkins rebuild you need to trigger it yourself):
https:/
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1826
No commit message was specified in the merge proposal. Click on the following link and set the commit message (if you want a jenkins rebuild you need to trigger it yourself):
https:/
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1826
No commit message was specified in the merge proposal. Click on the following link and set the commit message (if you want a jenkins rebuild you need to trigger it yourself):
https:/
https:/
Executed test runs:
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
Jonas G. Drange (jonas-drange) wrote : | # |
This will reduce confusion from trying to apply e.g. Text.ElideMiddle on ListItemLayout's title element.
Certainly fixes bug 1603450.
Thanks!
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
Cris Dywan (kalikiana) wrote : | # |
Nice docs! Those were long overdue. Thanks!
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Autolanding.
More details in the following jenkins job:
https:/
Executed test runs:
FAILURE: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
PASSED: Continuous integration, rev:1826
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
Preview Diff
1 | === modified file 'src/Ubuntu/UbuntuToolkit/privates/threelabelsslot_p.cpp' |
2 | --- src/Ubuntu/UbuntuToolkit/privates/threelabelsslot_p.cpp 2016-07-07 07:21:48 +0000 |
3 | +++ src/Ubuntu/UbuntuToolkit/privates/threelabelsslot_p.cpp 2016-07-18 17:41:12 +0000 |
4 | @@ -44,6 +44,8 @@ |
5 | //Using WrapAnywhere because ElideRight elides too early when used |
6 | //together with WrapWord, and that produces an unexpected result. |
7 | //This will cover most of the usecases. |
8 | + //NOTE: If you want to use ElideMiddle or ElideLeft you'll have to |
9 | + //set wrapMode to NoWrap (see Text docs for more details) |
10 | m_title->setWrapMode(UCLabel::WrapAnywhere); |
11 | m_title->setElideMode(UCLabel::ElideRight); |
12 | m_title->setMaximumLineCount(1); |
13 | @@ -55,6 +57,8 @@ |
14 | { |
15 | if (m_subtitle != Q_NULLPTR) { |
16 | m_subtitle->setWrapMode(UCLabel::WrapAnywhere); |
17 | + //NOTE: If you want to use ElideMiddle or ElideLeft you'll have to |
18 | + //set wrapMode to NoWrap (see Text docs for more details) |
19 | m_subtitle->setElideMode(UCLabel::ElideRight); |
20 | m_subtitle->setMaximumLineCount(1); |
21 | m_subtitle->setTextSize(UCLabel::Small); |
22 | @@ -65,6 +69,8 @@ |
23 | { |
24 | if (m_summary != Q_NULLPTR) { |
25 | m_summary->setWrapMode(UCLabel::WrapAnywhere); |
26 | + //NOTE: If you want to use ElideMiddle or ElideLeft you'll have to |
27 | + //set wrapMode to NoWrap (see Text docs for more details) |
28 | m_summary->setElideMode(UCLabel::ElideRight); |
29 | m_summary->setMaximumLineCount(2); |
30 | m_summary->setTextSize(UCLabel::Small); |
31 | |
32 | === modified file 'src/Ubuntu/UbuntuToolkit/uclistitemlayout.cpp' |
33 | --- src/Ubuntu/UbuntuToolkit/uclistitemlayout.cpp 2016-07-07 07:21:48 +0000 |
34 | +++ src/Ubuntu/UbuntuToolkit/uclistitemlayout.cpp 2016-07-18 17:41:12 +0000 |
35 | @@ -40,6 +40,11 @@ |
36 | ListItemLayout is essentially a \l {SlotsLayout} with a predefined |
37 | \l {SlotsLayout::mainSlot} that provides (up to) 3 Labels automatically laid out |
38 | according to our UI guidelines. |
39 | + |
40 | + \b Note: those labels may have properties whose default value is different |
41 | + from what is used by the standard Label component. The default wrapMode, |
42 | + for instance, is different. Have a look at \l {Labels' properties} section. |
43 | + |
44 | This main slot has been optimized to cover most of the usecases |
45 | without compromising performance (read more in \l {Optimizing memory consumption}). |
46 | |
47 | @@ -186,6 +191,39 @@ |
48 | to have the same height even without having to fill \l subtitle's (or summary's) |
49 | text with dummy content. |
50 | |
51 | + \section1 Labels' properties |
52 | + |
53 | + ListItemLayout's labels are the same component as \l {Label}, but with slightly different |
54 | + default properties. Moreover, \l Label derives from \l {Text}. As a consequence, |
55 | + you can access and override all the properties provided by \l {Text} and \l {Label}, if needed. Please |
56 | + refer to \l {Text}'s and \l {Label}'s documentation to see the list of all the properties. |
57 | + |
58 | + The default values for ListItemLayout's labels are defined in the documentation of each label. |
59 | + See \l title, \l subtitle and \l summary. |
60 | + |
61 | + \b Note: if you want to change the elide mode of a label to something other than \c Text.ElideRight, |
62 | + make sure its \c wrapMode is set to \c Text.NoWrap. See \l Text::wrapMode for more details. |
63 | + |
64 | + \qml |
65 | + import QtQuick 2.4 |
66 | + import Ubuntu.Components 1.3 |
67 | + Item { |
68 | + width: units.gu(30) |
69 | + height: units.gu(50) |
70 | + ListItem { |
71 | + height: layout.height + (divider.visible ? divider.height : 0) |
72 | + ListItemLayout { |
73 | + id: fileLayout |
74 | + //Let's change the default elide mode to Text.ElideMiddle |
75 | + title.elide: Text.ElideMiddle |
76 | + //ElideMiddle only works if there is no wrapping (see Text::wrapMode doc) |
77 | + title.wrapMode: Text.NoWrap |
78 | + title.text: "Red Roses run no risk, sir, on nurses order." |
79 | + } |
80 | + } |
81 | + } |
82 | + \endqml |
83 | + |
84 | \section1 Optimizing memory consumption |
85 | |
86 | In order to minimize memory consumption, the Labels in the \l SlotsLayout::mainSlot |
87 | @@ -221,6 +259,7 @@ |
88 | |
89 | \qml |
90 | ListItem { |
91 | + height: layout.height + (divider.visible ? divider.height : 0) |
92 | property alias titleText: layout.title.text |
93 | ListItemLayout { |
94 | id: layout |
95 | @@ -301,13 +340,28 @@ |
96 | Text component, as shown in the following example: |
97 | |
98 | \qml |
99 | - Item { |
100 | - ListItemLayout { |
101 | - title.text: "Hello" |
102 | - title.color: "yellow" |
103 | - } |
104 | + import QtQuick 2.4 |
105 | + import Ubuntu.Components 1.3 |
106 | + ListItemLayout { |
107 | + height: units.gu(10) |
108 | + width: units.gu(30) |
109 | + title.color: UbuntuColors.orange |
110 | + title.maximumLineCount: 3 |
111 | + title.text: "Red Roses\nrun no risk,\nsir, on nurses order." |
112 | } |
113 | \endqml |
114 | + |
115 | + The default \l Text::elide value for \l title is \c Text.ElideRight. |
116 | + |
117 | + The default \l Text::wrapMode is \c Text.WrapAnywhere. |
118 | + |
119 | + That means, for instance, that if you want to use a different elide mode, you also have |
120 | + to set wrapMode to \c Text.NoWrap. Refer to the official \l Text documentation for |
121 | + further details. |
122 | + |
123 | + The default \l Label::textSize is \c Label.Medium. |
124 | + |
125 | + The rest of the properties have the same default values as \l Label. |
126 | */ |
127 | UCLabel *UCListItemLayout::title() |
128 | { |
129 | @@ -320,6 +374,14 @@ |
130 | This property defines the subtitle label and its properties. |
131 | Styling and font properties can be set by using the prefix |
132 | \c {subtitle.} in a similar way as shown in \l title. |
133 | + |
134 | + The default \l Text::elide value for \l subtitle is \c Text.ElideRight. |
135 | + |
136 | + The default \l Text::wrapMode is \c Text.WrapAnywhere. |
137 | + |
138 | + The default \l Label::textSize is \c Label.Small. |
139 | + |
140 | + The rest of the properties have the same default values as \l Label. |
141 | */ |
142 | UCLabel *UCListItemLayout::subtitle() |
143 | { |
144 | @@ -332,6 +394,14 @@ |
145 | This property defines the subtitle label and its properties. |
146 | Styling and font properties can be set by using the prefix |
147 | \c {summary.} in a similar way as shown in \l title. |
148 | + |
149 | + The default \l Text::elide value for \l summary is \c Text.ElideRight. |
150 | + |
151 | + The default \l Text::wrapMode is \c Text.WrapAnywhere. |
152 | + |
153 | + The default \l Label::textSize is \c Label.Small. |
154 | + |
155 | + The rest of the properties have the same default values as \l Label. |
156 | */ |
157 | UCLabel *UCListItemLayout::summary() |
158 | { |
FAILED: Continuous integration, rev:1826 /code.launchpad .net/~faenil/ ubuntu- ui-toolkit/ moreListItemLay outDocs/ +merge/ 300372/ +edit-commit- message
No commit message was specified in the merge proposal. Click on the following link and set the commit message (if you want a jenkins rebuild you need to trigger it yourself):
https:/
https:/ /jenkins. ubuntu. com/ubuntu- sdk/job/ ubuntu- ui-toolkit- ci-amd64- stable/ 1081/ /jenkins. ubuntu. com/ubuntu- sdk/job/ generic- update- mp/4509/ console
Executed test runs:
None: https:/
Click here to trigger a rebuild: /jenkins. ubuntu. com/ubuntu- sdk/job/ ubuntu- ui-toolkit- ci-amd64- stable/ 1081/rebuild
https:/