Merge lp:~bpierre/ubuntu-ui-toolkit/newbutton into lp:ubuntu-ui-toolkit/staging
- newbutton
- Merge into staging
Status: | Work in progress |
---|---|
Proposed branch: | lp:~bpierre/ubuntu-ui-toolkit/newbutton |
Merge into: | lp:ubuntu-ui-toolkit/staging |
Prerequisite: | lp:~loic.molinari/ubuntu-ui-toolkit/ubuntu-ui-toolkit-dynamic-shapes-for-new-design |
Diff against target: |
1810 lines (+1027/-392) 22 files modified
components.api (+16/-3) examples/ubuntu-ui-toolkit-gallery/Buttons.qml (+116/-55) src/Ubuntu/Components/1.3/Button.qml (+0/-125) src/Ubuntu/Components/ComponentModule.pro (+0/-1) src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonForeground.qml (+29/-52) src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonStyle.qml (+135/-132) src/Ubuntu/Components/Themes/Ambiance/1.3/Palette.qml (+24/-12) src/Ubuntu/Components/Themes/Ambiance/1.3/TextButtonStyle.qml (+76/-0) src/Ubuntu/Components/Themes/Ambiance/Ambiance.pro (+1/-0) src/Ubuntu/Components/Themes/Ambiance/qmldir (+1/-0) src/Ubuntu/Components/plugin/button.cpp (+268/-0) src/Ubuntu/Components/plugin/button.h (+84/-0) src/Ubuntu/Components/plugin/button_p.h (+46/-0) src/Ubuntu/Components/plugin/plugin.cpp (+4/-0) src/Ubuntu/Components/plugin/plugin.pri (+7/-7) src/Ubuntu/Components/plugin/textbutton.cpp (+134/-0) src/Ubuntu/Components/plugin/textbutton.h (+51/-0) src/Ubuntu/Components/plugin/ucabstractbutton.cpp (+1/-1) src/Ubuntu/Components/plugin/ucabstractbutton.h (+1/-1) src/Ubuntu/Components/qmldir (+0/-1) tests/unit/tst_performance/ButtonGrid13.qml (+30/-0) tests/unit/tst_performance/tst_performance.cpp (+3/-2) |
To merge this branch: | bzr merge lp:~bpierre/ubuntu-ui-toolkit/newbutton |
Related bugs: |
Reviewer | Review Type | Date Requested | Status |
---|---|---|---|
ubuntu-sdk-build-bot | continuous-integration | Needs Fixing | |
Zsombor Egri | Pending | ||
Review via email: mp+291389@code.launchpad.net |
This proposal supersedes a proposal from 2016-02-15.
Commit message
TextButton component, Button style and API update
- The new Button style has been implemented and is using the new Palette.
- The component is now a CPP plugin to support enum properties.
- [API] add `type`: allow to specify the type of button (normal, positive, negative, outline)
- [API] change `iconInsertion`: accept `Button.After` and `Button.Before`
- [API] deprecate `color`: moved in the button styles
- [API] deprecate `gradient`: moved in the button styles
- [API] deprecate `strokeColor`: moved in the button styles
Description of the change
TextButton component, Button style and API update
- The new Button style has been implemented and is using the new Palette.
- The component is now a CPP plugin to support enum properties.
- [API] add `type`: allow to specify the type of button (normal, positive, negative, outline)
- [API] change `iconInsertion`: accept `Button.After` and `Button.Before`
- [API] deprecate `color`: moved in the button styles
- [API] deprecate `gradient`: moved in the button styles
- [API] deprecate `strokeColor`: moved in the button styles
Zsombor Egri (zsombi) wrote : Posted in a previous version of this proposal | # |
Pierre Bertet (bpierre) wrote : Posted in a previous version of this proposal | # |
Thanks for your comments, I made the required changes.
About splitting the button: the new structure (Frame instead of UbuntuShape) is simpler and there is no unused component.
But a special behavior has been required for the text button: there should be a way to make it “strong” (bold text), and the “emphasis” property is never going to be used for them. The API is not going to be the same anymore, so I will split it in separate components.
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1866
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1866
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1866
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1866
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1866
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
Pierre Bertet (bpierre) wrote : Posted in a previous version of this proposal | # |
I added the TextButton component, and removed it from Button. They are now two separate components and all the components in ButtonStyle.qml are shared by the Button.Normal and Button.Outline types.
Zsombor Egri (zsombi) wrote : Posted in a previous version of this proposal | # |
Shouldn't you have ButtonStyle and TextButtonStyle in Ubuntu.
See few comments below.
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1870
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1870
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1870
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
PASSED: Continuous integration, rev:1870
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1870
https:/
Executed test runs:
FAILURE: https:/
SUCCESS: https:/
deb: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
Pierre Bertet (bpierre) : Posted in a previous version of this proposal | # |
Pierre Bertet (bpierre) : Posted in a previous version of this proposal | # |
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
PASSED: Continuous integration, rev:1879
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1879
https:/
Executed test runs:
FAILURE: https:/
SUCCESS: https:/
deb: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1882
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1882
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1882
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1882
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1882
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1883
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1883
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1883
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1883
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1883
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1887
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1887
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1887
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1887
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1887
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1888
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1888
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1888
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1888
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : Posted in a previous version of this proposal | # |
FAILED: Continuous integration, rev:1888
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
- 1889. By Pierre Bertet
-
Revert development related changes on the Shadow Test app
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1888
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:1888
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:1888
https:/
Executed test runs:
None: https:/
Click here to trigger a rebuild:
https:/
Pierre Bertet (bpierre) wrote : | # |
@Zsombor Ready to be reviewed.
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1888
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:1888
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
ubuntu-sdk-build-bot (ubuntu-sdk-build-bot) wrote : | # |
FAILED: Continuous integration, rev:1889
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:1889
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:1889
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:1889
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:1889
https:/
Executed test runs:
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
FAILURE: https:/
None: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
SUCCESS: https:/
Click here to trigger a rebuild:
https:/
Unmerged revisions
- 1889. By Pierre Bertet
-
Revert development related changes on the Shadow Test app
- 1888. By Pierre Bertet
-
Move FocusShape to ShapeFrame
- 1887. By Pierre Bertet
-
[sync] merge staging
- 1886. By Pierre Bertet
-
[sync] merge staging
- 1885. By Pierre Bertet
-
Minor documentation fix
- 1884. By Pierre Bertet
-
Remove backgroundPosit
iveText and backgroundNegat iveText from the Palette values - 1883. By Pierre Bertet
-
[sync] merge staging
- 1882. By Pierre Bertet
-
Button: remove emphasis, move Positive and Negative to types
The outline mode of the button do not include the positive and negative
emphases anymore. Therefore, the positive and negative emphases have been moved
to the type property, since they (outline vs. positive / negative) are now
mutually exclusive.A button can now have the following types:
- Button.Normal (default)
- Button.Outline
- Button.Positive
- Button.Negative - 1881. By Pierre Bertet
-
[sync] merge lp:~loic.molinari/ubuntu-ui-toolkit/ubuntu-ui-toolkit-dynamic-shapes-for-new-design
- 1880. By Pierre Bertet
-
[sync] merge lp:~loic.molinari/ubuntu-ui-toolkit/ubuntu-ui-toolkit-dynamic-shapes-for-new-design
Preview Diff
1 | === modified file 'components.api' |
2 | --- components.api 2016-04-05 05:56:32 +0000 |
3 | +++ components.api 2016-04-08 16:09:06 +0000 |
4 | @@ -246,12 +246,13 @@ |
5 | property Gradient gradient |
6 | property string iconPosition |
7 | property color strokeColor |
8 | -Ubuntu.Components.Button 1.3: AbstractButton |
9 | +Ubuntu.Components.Button 1.3 UbuntuToolkit::Button: AbstractButton |
10 | property color color |
11 | property QFont font |
12 | - property Gradient gradient |
13 | - property string iconPosition |
14 | + property QGradient gradient |
15 | + property IconPosition iconPosition |
16 | property color strokeColor |
17 | + property Type type |
18 | Ubuntu.Components.ListItems.Caption 1.0 0.1: Item |
19 | property string text |
20 | Ubuntu.Components.ListItems.Caption 1.3: Item |
21 | @@ -1398,6 +1399,8 @@ |
22 | property int textFormat |
23 | property int verticalAlignment |
24 | property int wrapMode |
25 | +Ubuntu.Components.TextButton 1.3 UbuntuToolkit::TextButton: AbstractButton |
26 | + property bool strong |
27 | Ubuntu.Components.TextField 1.0 0.1: ActionItem |
28 | readonly property bool acceptableInput |
29 | property bool autoScroll |
30 | @@ -1743,6 +1746,16 @@ |
31 | function var warningFormat(var line, var column, var message) |
32 | function var waitForHeaderAnimation(var mainView) |
33 | readonly property QuickTestUtil testUtil |
34 | +Ubuntu.Components.UbuntuToolkit.Button: Enum |
35 | + Negative |
36 | + Normal |
37 | + Outline |
38 | + Positive |
39 | +Ubuntu.Components.UbuntuToolkit.Button: Enum |
40 | + After |
41 | + Before |
42 | + left |
43 | + right |
44 | Ubuntu.Components.UriHandler 1.0 0.1: QtObject singleton |
45 | signal opened(QStringList uris) |
46 | Ubuntu.Components.ListItems.ValueSelector 1.0 0.1: Empty |
47 | |
48 | === modified file 'examples/ubuntu-ui-toolkit-gallery/Buttons.qml' |
49 | --- examples/ubuntu-ui-toolkit-gallery/Buttons.qml 2016-02-12 10:55:51 +0000 |
50 | +++ examples/ubuntu-ui-toolkit-gallery/Buttons.qml 2016-04-08 16:09:06 +0000 |
51 | @@ -25,85 +25,150 @@ |
52 | className: "Button" |
53 | |
54 | TemplateFlow { |
55 | - title: i18n.tr("Standard") |
56 | + title: i18n.tr("Types") |
57 | |
58 | Button { |
59 | - objectName: "button_text" |
60 | - text: i18n.tr("Call") |
61 | + objectName: "button_neutral" |
62 | + text: i18n.tr("Normal") |
63 | + } |
64 | + Button { |
65 | + objectName: "button_positive" |
66 | + text: i18n.tr("Positive") |
67 | + type: Button.Positive |
68 | + } |
69 | + Button { |
70 | + objectName: "button_negative" |
71 | + text: i18n.tr("Negative") |
72 | + type: Button.Negative |
73 | + } |
74 | + Button { |
75 | + objectName: "button_outline" |
76 | + text: i18n.tr("Outline") |
77 | + type: Button.Outline |
78 | } |
79 | } |
80 | |
81 | TemplateFlow { |
82 | - title: i18n.tr("Stroke") |
83 | + title: "Disabled" |
84 | |
85 | Button { |
86 | - objectName: "button_stroke" |
87 | - text: i18n.tr("Call") |
88 | - strokeColor: UbuntuColors.warmGrey |
89 | + objectName: "button_normal_disabled" |
90 | + text: i18n.tr("Neutral") |
91 | + enabled: false |
92 | + } |
93 | + Button { |
94 | + objectName: "button_positive_disabled" |
95 | + text: i18n.tr("Positive") |
96 | + type: Button.Positive |
97 | + enabled: false |
98 | + } |
99 | + Button { |
100 | + objectName: "button_negative_disabled" |
101 | + text: i18n.tr("Negative") |
102 | + type: Button.Negative |
103 | + enabled: false |
104 | + } |
105 | + Button { |
106 | + objectName: "button_outline_disabled" |
107 | + text: i18n.tr("Outline") |
108 | + type: Button.Outline |
109 | + enabled: false |
110 | } |
111 | } |
112 | |
113 | TemplateFlow { |
114 | title: i18n.tr("Color") |
115 | - |
116 | Button { |
117 | + id: buttonColor |
118 | objectName: "button_color" |
119 | - width: units.gu(20) |
120 | action: Action { |
121 | - text: i18n.tr("C&all %1").arg(shortcut) |
122 | - shortcut: 'Ctrl+L' |
123 | + text: i18n.tr("Switch (%1)").arg(shortcut) |
124 | + shortcut: 'Ctrl+C' |
125 | property bool flipped |
126 | onTriggered: flipped = !flipped |
127 | } |
128 | - color: action.flipped ? UbuntuColors.blue : UbuntuColors.green |
129 | + StyleHints { |
130 | + textColor: "white" |
131 | + color: ( |
132 | + buttonColor.action.flipped? "#3EB34F" : "#19B6EE" |
133 | + ) |
134 | + } |
135 | } |
136 | } |
137 | |
138 | TemplateFlow { |
139 | title: i18n.tr("Icon") |
140 | - |
141 | - Button { |
142 | - objectName: "button_iconsource" |
143 | - iconSource: "call.png" |
144 | - } |
145 | - } |
146 | - |
147 | - TemplateFlow { |
148 | - title: i18n.tr("Icon+Text") |
149 | - |
150 | - Button { |
151 | - objectName: "button_iconsource_right_text" |
152 | - width: units.gu(10) |
153 | - text: i18n.tr("Call") |
154 | - iconSource: "call.png" |
155 | - iconPosition: "right" |
156 | - } |
157 | - |
158 | - Button { |
159 | - objectName: "button_iconsource_left_text" |
160 | - width: units.gu(10) |
161 | - text: i18n.tr("Call") |
162 | - iconSource: "call.png" |
163 | - } |
164 | - } |
165 | - |
166 | - TemplateFlow { |
167 | - title: i18n.tr("Disabled") |
168 | - |
169 | - Button { |
170 | - objectName: "button_text_disabled" |
171 | - text: i18n.tr("Call") |
172 | - enabled: false |
173 | - } |
174 | - } |
175 | - } |
176 | - |
177 | - TemplateSection { |
178 | + Button { |
179 | + objectName: "button_icon" |
180 | + type: Button.Positive |
181 | + iconName: "call-start" |
182 | + StyleHints { |
183 | + minimumWidth: 0 |
184 | + } |
185 | + } |
186 | + } |
187 | + |
188 | + TemplateFlow { |
189 | + title: i18n.tr("Icon + Text") |
190 | + Button { |
191 | + objectName: "button_icon_right_text" |
192 | + text: i18n.tr("Delete") |
193 | + type: Button.Negative |
194 | + iconName: "delete" |
195 | + StyleHints { |
196 | + minimumWidth: 0 |
197 | + } |
198 | + } |
199 | + Button { |
200 | + objectName: "button_icon_left_text" |
201 | + text: i18n.tr("Call") |
202 | + iconName: "call-start" |
203 | + type: Button.Positive |
204 | + iconPosition: Button.After |
205 | + StyleHints { |
206 | + minimumWidth: 0 |
207 | + } |
208 | + } |
209 | + } |
210 | + } |
211 | + |
212 | + TemplateSection { |
213 | + className: "TextButton" |
214 | + |
215 | + TemplateFlow { |
216 | + title: i18n.tr("Text") |
217 | + TextButton { |
218 | + objectName: "textbutton_normal" |
219 | + text: i18n.tr("Normal") |
220 | + } |
221 | + TextButton { |
222 | + objectName: "textbutton_strong" |
223 | + text: i18n.tr("Strong") |
224 | + strong: true |
225 | + } |
226 | + } |
227 | + |
228 | + TemplateFlow { |
229 | + TextButton { |
230 | + objectName: "textbutton_normal_disabled" |
231 | + text: i18n.tr("Normal") |
232 | + enabled: false |
233 | + } |
234 | + TextButton { |
235 | + objectName: "textbutton_strong_disabled" |
236 | + text: i18n.tr("Strong") |
237 | + strong: true |
238 | + enabled: false |
239 | + } |
240 | + } |
241 | + } |
242 | + |
243 | + TemplateSection { |
244 | + visible: false |
245 | className: "ComboButton" |
246 | |
247 | TemplateFlow { |
248 | title: i18n.tr("Collapsed") |
249 | - |
250 | ComboButton { |
251 | text: "Press me" |
252 | objectName: "combobutton_collapsed" |
253 | @@ -119,7 +184,6 @@ |
254 | |
255 | TemplateFlow { |
256 | title: i18n.tr("Icon") |
257 | - |
258 | ComboButton { |
259 | iconSource: "call.png" |
260 | width: parent.width < units.gu(30)? parent.width : units.gu(30) |
261 | @@ -131,10 +195,8 @@ |
262 | } |
263 | } |
264 | } |
265 | - |
266 | TemplateFlow { |
267 | title: i18n.tr("Icon+Text") |
268 | - |
269 | ComboButton { |
270 | text: "Answer" |
271 | iconSource: "call.png" |
272 | @@ -149,7 +211,6 @@ |
273 | } |
274 | TemplateFlow { |
275 | title: i18n.tr("Expanded") |
276 | - |
277 | ComboButton { |
278 | text: "Press me" |
279 | objectName: "combobutton_expanded" |
280 | |
281 | === removed file 'src/Ubuntu/Components/1.3/Button.qml' |
282 | --- src/Ubuntu/Components/1.3/Button.qml 2015-09-28 14:36:54 +0000 |
283 | +++ src/Ubuntu/Components/1.3/Button.qml 1970-01-01 00:00:00 +0000 |
284 | @@ -1,125 +0,0 @@ |
285 | -/* |
286 | - * Copyright 2015 Canonical Ltd. |
287 | - * |
288 | - * This program is free software; you can redistribute it and/or modify |
289 | - * it under the terms of the GNU Lesser General Public License as published by |
290 | - * the Free Software Foundation; version 3. |
291 | - * |
292 | - * This program is distributed in the hope that it will be useful, |
293 | - * but WITHOUT ANY WARRANTY; without even the implied warranty of |
294 | - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
295 | - * GNU Lesser General Public License for more details. |
296 | - * |
297 | - * You should have received a copy of the GNU Lesser General Public License |
298 | - * along with this program. If not, see <http://www.gnu.org/licenses/>. |
299 | - */ |
300 | - |
301 | -import QtQuick 2.4 |
302 | -import Ubuntu.Components 1.3 |
303 | - |
304 | -/*! |
305 | - \qmltype Button |
306 | - \inqmlmodule Ubuntu.Components 1.1 |
307 | - \ingroup ubuntu |
308 | - \brief Standard Ubuntu button. |
309 | - |
310 | - \l {http://design.ubuntu.com/apps/building-blocks/buttons}{See also the Design Guidelines on Buttons}. |
311 | - |
312 | - Examples: |
313 | - \qml |
314 | - Column { |
315 | - Button { |
316 | - text: "Send" |
317 | - onClicked: print("clicked text-only Button") |
318 | - } |
319 | - Button { |
320 | - iconName: "compose" |
321 | - gradient: UbuntuColors.greyGradient |
322 | - onClicked: print("clicked icon-only Button") |
323 | - } |
324 | - Button { |
325 | - iconName: "compose" |
326 | - text: "Icon on left" |
327 | - iconPosition: "left" |
328 | - onClicked: print("clicked text and icon Button") |
329 | - } |
330 | - } |
331 | - \endqml |
332 | - An \l Action can be used to specify \b clicked, iconSource and text. Example: |
333 | - \qml |
334 | - Item { |
335 | - Action { |
336 | - id: action1 |
337 | - text: "Click me" |
338 | - onTriggered: print("action!") |
339 | - iconName: "compose" |
340 | - } |
341 | - Button { |
342 | - anchors.centerIn: parent |
343 | - action: action1 |
344 | - color: UbuntuColors.warmGrey |
345 | - } |
346 | - } |
347 | - \endqml*/ |
348 | -AbstractButton { |
349 | - id: button |
350 | - /*! |
351 | - \since Ubuntu.Components 1.1 |
352 | - If set to a color, the button has a stroke border instead of a filled shape. |
353 | - */ |
354 | - property color strokeColor: Qt.rgba(0.0, 0.0, 0.0, 0.0) |
355 | - |
356 | - /*! |
357 | - \qmlproperty url Button::iconSource |
358 | - The source URL of the icon to display inside the button. |
359 | - Leave this value blank for a text-only button. |
360 | - If \l action is set, the default iconSource is that of the action. |
361 | - */ |
362 | - |
363 | - /*! |
364 | - The text to display in the button. If an icon was defined, |
365 | - the text will be shown next to the icon, otherwise it will |
366 | - be centered. Leave blank for an icon-only button. |
367 | - If \l action is set, the default text is that of the action. |
368 | - \qmlproperty string Button::text |
369 | - */ |
370 | - |
371 | - /*! |
372 | - The background color of the button. |
373 | - |
374 | - \sa gradient |
375 | - */ |
376 | - property color color: __styleInstance.defaultColor |
377 | - |
378 | - /*! |
379 | - The gradient used to fill the background of the button. |
380 | - |
381 | - Standard Ubuntu gradients are defined in \l UbuntuColors. |
382 | - |
383 | - If both a gradient and a color are specified, the gradient will be used. |
384 | - |
385 | - \sa color |
386 | - */ |
387 | - property Gradient gradient: __styleInstance.defaultGradient |
388 | - |
389 | - /*! |
390 | - The font used for the button's text. |
391 | - */ |
392 | - property font font: __styleInstance.defaultFont |
393 | - |
394 | - /*! |
395 | - The position of the icon relative to the text. Options |
396 | - are "left" and "right". The default value is "left". |
397 | - |
398 | - If only text or only an icon is defined, this |
399 | - property is ignored and the text or icon is |
400 | - centered horizontally and vertically in the button. |
401 | - |
402 | - Currently this is a string value. We are waiting for |
403 | - support for enums: |
404 | - https://bugreports.qt-project.org/browse/QTBUG-14861 |
405 | - */ |
406 | - property string iconPosition: "left" |
407 | - |
408 | - styleName: "ButtonStyle" |
409 | -} |
410 | |
411 | === modified file 'src/Ubuntu/Components/ComponentModule.pro' |
412 | --- src/Ubuntu/Components/ComponentModule.pro 2016-02-16 11:39:32 +0000 |
413 | +++ src/Ubuntu/Components/ComponentModule.pro 2016-04-08 16:09:06 +0000 |
414 | @@ -83,7 +83,6 @@ |
415 | 1.3/AdaptivePageLayout.qml \ |
416 | 1.3/AnimatedItem.qml \ |
417 | 1.3/AppHeader.qml \ |
418 | - 1.3/Button.qml \ |
419 | 1.3/Captions.qml \ |
420 | 1.3/CheckBox.qml \ |
421 | 1.3/ComboButton.qml \ |
422 | |
423 | === modified file 'src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonForeground.qml' |
424 | --- src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonForeground.qml 2015-09-07 10:05:58 +0000 |
425 | +++ src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonForeground.qml 2016-04-08 16:09:06 +0000 |
426 | @@ -1,5 +1,5 @@ |
427 | /* |
428 | - * Copyright 2013 Canonical Ltd. |
429 | + * Copyright 2016 Canonical Ltd. |
430 | * |
431 | * This program is free software; you can redistribute it and/or modify |
432 | * it under the terms of the GNU Lesser General Public License as published by |
433 | @@ -14,42 +14,47 @@ |
434 | * along with this program. If not, see <http://www.gnu.org/licenses/>. |
435 | * |
436 | * Author: Florian Boucault <florian.boucault@canonical.com> |
437 | + * Author: Pierre Bertet <pierre.bertet@canonical.com> |
438 | */ |
439 | |
440 | import QtQuick 2.4 |
441 | import Ubuntu.Components 1.3 |
442 | |
443 | Item { |
444 | - id: buttonForeground |
445 | + id: root |
446 | |
447 | property alias text: label.text |
448 | property alias textColor: label.color |
449 | property alias iconSource: icon.source |
450 | - property string iconPosition |
451 | property real iconSize |
452 | property real spacing |
453 | + property alias font: label.font |
454 | + property int iconPosition |
455 | property bool hasIcon: iconSource != "" |
456 | property bool hasText: text != "" |
457 | - property alias font: label.font |
458 | + property bool hasBoth: hasIcon && hasText |
459 | |
460 | - opacity: enabled ? 1.0 : 0.5 |
461 | + state: hasBoth && iconPosition === Button.After? "right" : "left" |
462 | + implicitWidth: ( |
463 | + (hasText? label.width : 0) + |
464 | + (hasBoth? spacing : 0) + |
465 | + (hasIcon? icon.width : 0) |
466 | + ) |
467 | implicitHeight: Math.max(icon.height, label.height) |
468 | - state: hasIcon && hasText ? iconPosition : "center" |
469 | |
470 | - Image { |
471 | + Icon { |
472 | id: icon |
473 | + visible: hasIcon |
474 | anchors.verticalCenter: parent.verticalCenter |
475 | - fillMode: Image.PreserveAspectFit |
476 | width: iconSize |
477 | height: iconSize |
478 | + color: textColor |
479 | } |
480 | |
481 | Label { |
482 | id: label |
483 | - anchors { |
484 | - verticalCenter: parent.verticalCenter |
485 | - verticalCenterOffset: units.dp(-1) |
486 | - } |
487 | + visible: hasText |
488 | + anchors.verticalCenter: parent.verticalCenter |
489 | elide: Text.ElideRight |
490 | } |
491 | |
492 | @@ -58,58 +63,30 @@ |
493 | name: "left" |
494 | AnchorChanges { |
495 | target: icon |
496 | - anchors.left: buttonForeground.left |
497 | + anchors.left: root.left |
498 | } |
499 | AnchorChanges { |
500 | target: label |
501 | - anchors.left: icon.right |
502 | + anchors.left: hasIcon? icon.right : root.left |
503 | } |
504 | PropertyChanges { |
505 | target: label |
506 | - anchors.leftMargin: spacing |
507 | - width: buttonForeground.width - icon.width - spacing |
508 | - } |
509 | - PropertyChanges { |
510 | - target: buttonForeground |
511 | - implicitWidth: icon.implicitWidth + spacing + label.implicitWidth |
512 | + anchors.leftMargin: hasIcon? units.gu(1) : 0 |
513 | } |
514 | }, |
515 | State { |
516 | name: "right" |
517 | AnchorChanges { |
518 | target: icon |
519 | - anchors.right: buttonForeground.right |
520 | - } |
521 | - AnchorChanges { |
522 | - target: label |
523 | - anchors.left: buttonForeground.left |
524 | - } |
525 | - PropertyChanges { |
526 | - target: label |
527 | - width: buttonForeground.width - icon.width - spacing |
528 | - } |
529 | - PropertyChanges { |
530 | - target: buttonForeground |
531 | - implicitWidth: label.implicitWidth + spacing + icon.implicitWidth |
532 | - } |
533 | - }, |
534 | - State { |
535 | - name: "center" |
536 | - AnchorChanges { |
537 | - target: icon |
538 | - anchors.horizontalCenter: buttonForeground.horizontalCenter |
539 | - } |
540 | - AnchorChanges { |
541 | - target: label |
542 | - anchors.horizontalCenter: buttonForeground.horizontalCenter |
543 | - } |
544 | - PropertyChanges { |
545 | - target: label |
546 | - width: Math.min(label.implicitWidth, buttonForeground.width) |
547 | - } |
548 | - PropertyChanges { |
549 | - target: buttonForeground |
550 | - implicitWidth: hasText ? label.implicitWidth : icon.implicitWidth |
551 | + anchors.right: root.right |
552 | + } |
553 | + AnchorChanges { |
554 | + target: label |
555 | + anchors.right: icon.left |
556 | + } |
557 | + PropertyChanges { |
558 | + target: label |
559 | + anchors.rightMargin: units.gu(1) |
560 | } |
561 | } |
562 | ] |
563 | |
564 | === modified file 'src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonStyle.qml' |
565 | --- src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonStyle.qml 2015-12-09 14:45:54 +0000 |
566 | +++ src/Ubuntu/Components/Themes/Ambiance/1.3/ButtonStyle.qml 2016-04-08 16:09:06 +0000 |
567 | @@ -1,5 +1,5 @@ |
568 | /* |
569 | - * Copyright 2013 Canonical Ltd. |
570 | + * Copyright 2016 Canonical Ltd. |
571 | * |
572 | * This program is free software; you can redistribute it and/or modify |
573 | * it under the terms of the GNU Lesser General Public License as published by |
574 | @@ -14,169 +14,172 @@ |
575 | * along with this program. If not, see <http://www.gnu.org/licenses/>. |
576 | * |
577 | * Author: Florian Boucault <florian.boucault@canonical.com> |
578 | + * Author: Pierre Bertet <pierre.bertet@canonical.com> |
579 | */ |
580 | |
581 | import QtQuick 2.4 |
582 | import Ubuntu.Components 1.3 |
583 | +import Ubuntu.Components.Private 1.3 |
584 | |
585 | Item { |
586 | id: buttonStyle |
587 | |
588 | property var button: styledItem |
589 | - property real minimumWidth: units.gu(10) |
590 | - property real horizontalPadding: units.gu(1) |
591 | - // FIXME: Add this color to the palette |
592 | - property color defaultColor: "#b2b2b2" |
593 | - property font defaultFont: Qt.font({family: "Ubuntu", pixelSize: FontUtils.sizeToPixels("medium")}) |
594 | - property Gradient defaultGradient |
595 | - property real buttonFaceOffset: 0 |
596 | - property bool stroke: button.hasOwnProperty("strokeColor") && button.strokeColor != Qt.rgba(0.0, 0.0, 0.0, 0.0) |
597 | + property real minimumWidth: button.iconName && button.text? 0 : units.gu(10) |
598 | + property real horizontalPadding: units.gu(2) |
599 | + property real iconSpacing: units.gu(1) |
600 | + |
601 | + property QtObject palette: ( |
602 | + button.enabled? theme.palette.normal : theme.palette.disabled |
603 | + ) |
604 | + |
605 | + property color color: { |
606 | + // In Outline mode, the border has the same color than the text |
607 | + if (button.type === Button.Outline) { |
608 | + return textColor |
609 | + } |
610 | + if (button.type === Button.Positive) { |
611 | + return palette.positive |
612 | + } |
613 | + if (button.type === Button.Negative) { |
614 | + return palette.negative |
615 | + } |
616 | + return palette.foreground |
617 | + } |
618 | + |
619 | + property color textColor: { |
620 | + if (button.type === Button.Positive) { |
621 | + return palette.positiveText |
622 | + } |
623 | + if (button.type === Button.Negative) { |
624 | + return palette.negativeText |
625 | + } |
626 | + return palette.foregroundText |
627 | + } |
628 | + |
629 | + property real frameThickness: units.dp(1) |
630 | + |
631 | + property real radius: units.gu(0.6) |
632 | + |
633 | + property color overlayColor: palette.foregroundText |
634 | + |
635 | + property font defaultFont: Qt.font({ |
636 | + family: "Ubuntu", |
637 | + pixelSize: FontUtils.sizeToPixels("medium"), |
638 | + }) |
639 | + |
640 | /*! |
641 | The property overrides the button's default background with an item. This |
642 | item can be used by derived styles to reuse the ButtonStyle and override |
643 | the default coloured background with an image or any other drawing. |
644 | The default value is null. |
645 | - */ |
646 | + */ |
647 | property Item backgroundSource: null |
648 | |
649 | width: button.width |
650 | height: button.height |
651 | - implicitWidth: Math.max(minimumWidth, foreground.implicitWidth + 2*horizontalPadding) |
652 | + implicitWidth: Math.max(minimumWidth, foreground.width + 2 * horizontalPadding) |
653 | implicitHeight: units.gu(4) |
654 | |
655 | - LayoutMirroring.enabled: Qt.application.layoutDirection == Qt.RightToLeft |
656 | + LayoutMirroring.enabled: Qt.application.layoutDirection === Qt.RightToLeft |
657 | LayoutMirroring.childrenInherit: true |
658 | |
659 | - /*! \internal */ |
660 | - // Color properties in a JS ternary operator don't work as expected in |
661 | - // QML because it overwrites alpha values with 1. A workaround is to use |
662 | - // Qt.rgba(). For more information, see |
663 | - // https://bugs.launchpad.net/ubuntu-ui-toolkit/+bug/1197802 and |
664 | - // https://bugreports.qt-project.org/browse/QTBUG-32238. |
665 | - function __colorHack(color) { return Qt.rgba(color.r, color.g, color.b, color.a); } |
666 | - |
667 | - |
668 | - /* The proxy is necessary because Gradient.stops and GradientStop.color are |
669 | - non-NOTIFYable properties. They cannot be written to so it is fine but |
670 | - the proxy avoids the warnings. |
671 | - */ |
672 | - property QtObject gradientProxy: gradientProxyObject |
673 | - QtObject { |
674 | - id: gradientProxyObject |
675 | - property color topColor |
676 | - property color bottomColor |
677 | - |
678 | - function updateGradient() { |
679 | - if (button.gradient) { |
680 | - topColor = button.gradient.stops[0].color; |
681 | - bottomColor = button.gradient.stops[1].color; |
682 | - } |
683 | - } |
684 | - |
685 | - Component.onCompleted: { |
686 | - updateGradient(); |
687 | - button.gradientChanged.connect(updateGradient); |
688 | - } |
689 | - } |
690 | - |
691 | - // Use the gradient if it is defined and the color has not been set manually |
692 | - // or the gradient has been set manually |
693 | - property bool isGradient: button.gradient && (button.color == defaultColor || |
694 | - button.gradient != defaultGradient) |
695 | - |
696 | FocusShape { |
697 | } |
698 | |
699 | - Image { |
700 | - id: strokeBorder |
701 | - anchors.fill: parent |
702 | - anchors.margins: -units.gu(0.5) |
703 | - // FIXME: this PNG is way too big (462x108) and do not scale properly |
704 | - // ie. the corners are visually incorrect at most sizes |
705 | - source: stroke ? Qt.resolvedUrl("../artwork/stroke_button.png") : "" |
706 | - visible: false |
707 | - cache: false |
708 | - asynchronous: true |
709 | - } |
710 | - |
711 | - ShaderEffect { |
712 | - id: colorizedImage |
713 | - |
714 | - anchors.fill: parent |
715 | - visible: stroke && strokeBorder.status == Image.Ready |
716 | - |
717 | - property Item source: visible ? strokeBorder : null |
718 | - property color keyColorOut: stroke ? button.strokeColor : Qt.rgba(0.0, 0.0, 0.0, 0.0) |
719 | - property color keyColorIn: Qt.rgba(1.0, 1.0, 1.0, 1.0) |
720 | - property real threshold: 1.0 |
721 | - |
722 | - fragmentShader: " |
723 | - varying highp vec2 qt_TexCoord0; |
724 | - uniform sampler2D source; |
725 | - uniform highp vec4 keyColorOut; |
726 | - uniform highp vec4 keyColorIn; |
727 | - uniform lowp float threshold; |
728 | - uniform lowp float qt_Opacity; |
729 | - void main() { |
730 | - lowp vec4 sourceColor = texture2D(source, qt_TexCoord0); |
731 | - gl_FragColor = mix(vec4(keyColorOut.rgb, 1.0) * sourceColor.a, sourceColor, step(threshold, distance(sourceColor.rgb / sourceColor.a, keyColorIn.rgb))) * qt_Opacity; |
732 | - }" |
733 | - } |
734 | - |
735 | - UbuntuShape { |
736 | - id: background |
737 | - anchors.fill: parent |
738 | - borderSource: "radius_idle.sci" // Deprecated, use a dedicated shape. |
739 | - visible: stroke ? false : ((backgroundColor.a != 0.0) || backgroundSource) |
740 | - source: backgroundSource |
741 | - |
742 | - backgroundColor: backgroundSource ? "#00000000" : (isGradient ? __colorHack(gradientProxy.topColor) : __colorHack(button.color)) |
743 | - secondaryBackgroundColor: backgroundSource ? "#00000000" : (isGradient ? __colorHack(gradientProxy.bottomColor) : __colorHack(button.color)) |
744 | - backgroundMode: isGradient ? UbuntuShape.VerticalGradient : UbuntuShape.SolidColor |
745 | - opacity: styledItem.enabled ? 1.0 : 0.6 |
746 | - } |
747 | - |
748 | - UbuntuShape { |
749 | - id: backgroundPressed |
750 | - anchors.fill: parent |
751 | - backgroundColor: stroke ? button.strokeColor : background.backgroundColor |
752 | - secondaryBackgroundColor: background.secondaryBackgroundColor |
753 | - backgroundMode: stroke ? UbuntuShape.SolidColor : UbuntuShape.VerticalGradient |
754 | - borderSource: "radius_pressed.sci" // Deprecated, use a dedicated shape. |
755 | - opacity: button.pressed ? 1.0 : 0.0 |
756 | - Behavior on opacity { |
757 | - NumberAnimation { |
758 | - duration: UbuntuAnimation.SnapDuration |
759 | - easing.type: Easing.Linear |
760 | - } |
761 | - } |
762 | - visible: stroke || background.visible |
763 | - } |
764 | - |
765 | + // Drop shadow |
766 | + ShapeShadow { |
767 | + visible: button.enabled |
768 | + opacity: ( |
769 | + button.type === Button.Outline || |
770 | + styledItem.keyNavigationFocus || |
771 | + button.pressed? 0 : 1 |
772 | + ) |
773 | + width: parent.width |
774 | + height: parent.height |
775 | + radius: buttonStyle.radius |
776 | + style: ShapeShadow.Outer |
777 | + angle: 90 |
778 | + distance: units.gu(0.1) |
779 | + size: units.gu(0.1) |
780 | + color: Qt.rgba(0, 0, 0, 0.2) |
781 | + Behavior on opacity { |
782 | + UbuntuNumberAnimation { |
783 | + duration: UbuntuAnimation.SnapDuration |
784 | + } |
785 | + } |
786 | + } |
787 | + |
788 | + // Background shape |
789 | + ShapeFill { |
790 | + anchors.fill: parent |
791 | + visible: ( |
792 | + button.type !== Button.Outline || |
793 | + button.keyNavigationFocus || |
794 | + (button.hovered && !button.pressed) |
795 | + ) |
796 | + color: { |
797 | + var baseColor = buttonStyle.color |
798 | + if (button.keyNavigationFocus && button.type === Button.Outline) { |
799 | + return Qt.rgba(0, 0, 0, 0.15) |
800 | + } |
801 | + if (button.hovered && !button.pressed) { |
802 | + return button.type === Button.Outline |
803 | + ? Qt.rgba(0, 0, 0, 0.05) |
804 | + : Qt.tint(buttonStyle.color, Qt.rgba(0, 0, 0, 0.05)) |
805 | + } |
806 | + return buttonStyle.color |
807 | + } |
808 | + radius: buttonStyle.radius |
809 | + Behavior on opacity { |
810 | + UbuntuNumberAnimation { |
811 | + duration: UbuntuAnimation.SnapDuration |
812 | + } |
813 | + } |
814 | + Behavior on color { |
815 | + enabled: button.type !== Button.Outline |
816 | + ColorAnimation { |
817 | + duration: UbuntuAnimation.SnapDuration |
818 | + } |
819 | + } |
820 | + } |
821 | + |
822 | + // Outline |
823 | + ShapeFrame { |
824 | + anchors.fill: parent |
825 | + visible: button.type === Button.Outline && !button.keyNavigationFocus |
826 | + color: buttonStyle.color |
827 | + radius: buttonStyle.radius |
828 | + thickness: frameThickness |
829 | + Behavior on opacity { |
830 | + UbuntuNumberAnimation { |
831 | + duration: UbuntuAnimation.SnapDuration |
832 | + } |
833 | + } |
834 | + Behavior on color { |
835 | + ColorAnimation { |
836 | + duration: UbuntuAnimation.SnapDuration |
837 | + } |
838 | + } |
839 | + } |
840 | + |
841 | + // Foreground (text and icon) |
842 | ButtonForeground { |
843 | id: foreground |
844 | - width: parent.width - 2*horizontalPadding |
845 | anchors { |
846 | centerIn: parent |
847 | - horizontalCenterOffset: buttonFaceOffset |
848 | } |
849 | text: button.text |
850 | - /* Pick either a clear or dark text color depending on the luminance of the |
851 | - background color to maintain good contrast (works in most cases) |
852 | - */ |
853 | - textColor: ColorUtils.luminance(button.color) <= 0.85 && !(stroke && !button.pressed) ? "#FFFFFF" : "#888888" |
854 | + textColor: buttonStyle.textColor |
855 | iconSource: button.iconSource |
856 | - iconPosition: button.iconPosition |
857 | - iconSize: units.gu(3) |
858 | - font: button.font |
859 | - spacing: horizontalPadding |
860 | + iconPosition: ( |
861 | + button.iconPosition !== undefined |
862 | + ? button.iconPosition |
863 | + : Button.Before |
864 | + ) |
865 | + iconSize: units.gu(2) |
866 | + font: button.font || defaultFont |
867 | + spacing: iconSpacing |
868 | transformOrigin: Item.Top |
869 | - scale: button.pressed ? 0.98 : 1.0 |
870 | - Behavior on scale { |
871 | - NumberAnimation { |
872 | - duration: UbuntuAnimation.SnapDuration |
873 | - easing.type: Easing.Linear |
874 | - } |
875 | - } |
876 | } |
877 | } |
878 | |
879 | === modified file 'src/Ubuntu/Components/Themes/Ambiance/1.3/Palette.qml' |
880 | --- src/Ubuntu/Components/Themes/Ambiance/1.3/Palette.qml 2016-03-01 15:06:38 +0000 |
881 | +++ src/Ubuntu/Components/Themes/Ambiance/1.3/Palette.qml 2016-04-08 16:09:06 +0000 |
882 | @@ -20,14 +20,22 @@ |
883 | |
884 | Palette { |
885 | normal: AmbianceNormal {} |
886 | + |
887 | disabled: AmbianceNormal { |
888 | - field: UbuntuColors.porcelain; |
889 | - // inactive is 30% opaque normal |
890 | Component.onCompleted: { |
891 | + // specific disabled colors |
892 | + var diff = { |
893 | + field: UbuntuColors.porcelain, |
894 | + positiveText: normal.positiveText, |
895 | + negativeText: normal.negativeText, |
896 | + }; |
897 | for (var p in normal) { |
898 | // skip objectName and all change signals |
899 | - if (p == "objectName" || p == "field" || p.indexOf("Changed") > 0) continue; |
900 | - disabled[p] = Qt.rgba(normal[p].r, normal[p].g, normal[p].b, 0.3); |
901 | + if (p === "objectName" || p.indexOf("Changed") > 0) continue; |
902 | + disabled[p] = diff[p] || ( |
903 | + // if not specific, colors are 30% opaque normal |
904 | + Qt.rgba(normal[p].r, normal[p].g, normal[p].b, 0.3) |
905 | + ); |
906 | } |
907 | } |
908 | } |
909 | @@ -35,18 +43,22 @@ |
910 | // selected differs from normal in background, base, foreground |
911 | selected: AmbianceSelected {} |
912 | |
913 | - // selected differs from normal in background, base, foreground |
914 | + // selected disabled differs from normal in background, base, foreground |
915 | selectedDisabled: AmbianceSelected { |
916 | - background: UbuntuColors.porcelain |
917 | - base: UbuntuColors.porcelain |
918 | - foreground: UbuntuColors.porcelain |
919 | - // inactive is 30% opaque normal |
920 | Component.onCompleted: { |
921 | + // specific selected-disabled colors |
922 | + var diff = { |
923 | + background: UbuntuColors.porcelain, |
924 | + base: UbuntuColors.porcelain, |
925 | + foreground: UbuntuColors.porcelain, |
926 | + }; |
927 | for (var p in selected) { |
928 | // skip objectName and all change signals |
929 | - if (p == "objectName" || p.indexOf("Changed") > 0 |
930 | - || p == "background" || p == "base" || p == "foreground" ) continue; |
931 | - selectedDisabled[p] = Qt.rgba(selected[p].r, selected[p].g, selected[p].b, 0.3); |
932 | + if (p === "objectName" || p.indexOf("Changed") > 0) continue; |
933 | + selectedDisabled[p] = diff[p] || ( |
934 | + // if not specific, colors are 30% opaque normal |
935 | + Qt.rgba(selected[p].r, selected[p].g, selected[p].b, 0.3) |
936 | + ); |
937 | } |
938 | } |
939 | } |
940 | |
941 | === added file 'src/Ubuntu/Components/Themes/Ambiance/1.3/TextButtonStyle.qml' |
942 | --- src/Ubuntu/Components/Themes/Ambiance/1.3/TextButtonStyle.qml 1970-01-01 00:00:00 +0000 |
943 | +++ src/Ubuntu/Components/Themes/Ambiance/1.3/TextButtonStyle.qml 2016-04-08 16:09:06 +0000 |
944 | @@ -0,0 +1,76 @@ |
945 | +/* |
946 | + * Copyright 2016 Canonical Ltd. |
947 | + * |
948 | + * This program is free software; you can redistribute it and/or modify |
949 | + * it under the terms of the GNU Lesser General Public License as published by |
950 | + * the Free Software Foundation; version 3. |
951 | + * |
952 | + * This program is distributed in the hope that it will be useful, |
953 | + * but WITHOUT ANY WARRANTY; without even the implied warranty of |
954 | + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
955 | + * GNU Lesser General Public License for more details. |
956 | + * |
957 | + * You should have received a copy of the GNU Lesser General Public License |
958 | + * along with this program. If not, see <http://www.gnu.org/licenses/>. |
959 | + * |
960 | + * Author: Florian Boucault <florian.boucault@canonical.com> |
961 | + * Author: Pierre Bertet <pierre.bertet@canonical.com> |
962 | + */ |
963 | + |
964 | +import QtQuick 2.4 |
965 | +import Ubuntu.Components 1.3 |
966 | +import Ubuntu.Components.Private 1.3 |
967 | + |
968 | +Item { |
969 | + id: root |
970 | + |
971 | + property var button: styledItem |
972 | + property real minWidth: units.gu(10) |
973 | + property real hPadding: units.gu(2) |
974 | + property QtObject palette: ( |
975 | + button.enabled? theme.palette.normal : theme.palette.disabled |
976 | + ) |
977 | + property color bgColor: palette.foreground |
978 | + property color textColor: palette.foregroundText |
979 | + property real radius: units.gu(0.6) |
980 | + property font font: Qt.font({ |
981 | + family: "Ubuntu", |
982 | + weight: button.strong? Font.Normal : Font.Light, |
983 | + pixelSize: FontUtils.sizeToPixels("medium"), |
984 | + }) |
985 | + |
986 | + width: button.width |
987 | + height: button.height |
988 | + implicitWidth: Math.max(minWidth, foreground.width + 2 * hPadding) |
989 | + implicitHeight: units.gu(4) |
990 | + |
991 | + LayoutMirroring.enabled: Qt.application.layoutDirection === Qt.RightToLeft |
992 | + LayoutMirroring.childrenInherit: true |
993 | + |
994 | + FocusShape { |
995 | + } |
996 | + |
997 | + // Background (on hover) |
998 | + ShapeFill { |
999 | + id: background |
1000 | + visible: background.color.a > 0 |
1001 | + anchors.fill: parent |
1002 | + radius: root.radius |
1003 | + opacity: button.hovered? 1 : 0 |
1004 | + color: root.bgColor |
1005 | + Behavior on opacity { |
1006 | + UbuntuNumberAnimation { |
1007 | + duration: UbuntuAnimation.SnapDuration |
1008 | + } |
1009 | + } |
1010 | + } |
1011 | + |
1012 | + Label { |
1013 | + id: foreground |
1014 | + anchors.centerIn: parent |
1015 | + text: button.text |
1016 | + elide: Text.ElideRight |
1017 | + color: root.textColor |
1018 | + font: root.font |
1019 | + } |
1020 | +} |
1021 | |
1022 | === modified file 'src/Ubuntu/Components/Themes/Ambiance/Ambiance.pro' |
1023 | --- src/Ubuntu/Components/Themes/Ambiance/Ambiance.pro 2016-02-19 11:18:51 +0000 |
1024 | +++ src/Ubuntu/Components/Themes/Ambiance/Ambiance.pro 2016-04-08 16:09:06 +0000 |
1025 | @@ -80,6 +80,7 @@ |
1026 | 1.3/BubbleShape.qml \ |
1027 | 1.3/ButtonForeground.qml \ |
1028 | 1.3/ButtonStyle.qml \ |
1029 | + 1.3/TextButtonStyle.qml \ |
1030 | 1.3/CheckBoxStyle.qml \ |
1031 | 1.3/ComboButtonStyle.qml \ |
1032 | 1.3/DatePickerStyle.qml \ |
1033 | |
1034 | === modified file 'src/Ubuntu/Components/Themes/Ambiance/qmldir' |
1035 | --- src/Ubuntu/Components/Themes/Ambiance/qmldir 2016-02-19 11:18:51 +0000 |
1036 | +++ src/Ubuntu/Components/Themes/Ambiance/qmldir 2016-04-08 16:09:06 +0000 |
1037 | @@ -77,6 +77,7 @@ |
1038 | PageHeadStyle 1.3 ./1.3/PageHeadStyle.qml |
1039 | Palette 1.3 ./1.3/Palette.qml |
1040 | ButtonStyle 1.3 ./1.3/ButtonStyle.qml |
1041 | +TextButtonStyle 1.3 ./1.3/TextButtonStyle.qml |
1042 | SliderStyle 1.3 ./1.3/SliderStyle.qml |
1043 | SwitchStyle 1.3 ./1.3/SwitchStyle.qml |
1044 | CheckBoxStyle 1.3 ./1.3/CheckBoxStyle.qml |
1045 | |
1046 | === added file 'src/Ubuntu/Components/plugin/button.cpp' |
1047 | --- src/Ubuntu/Components/plugin/button.cpp 1970-01-01 00:00:00 +0000 |
1048 | +++ src/Ubuntu/Components/plugin/button.cpp 2016-04-08 16:09:06 +0000 |
1049 | @@ -0,0 +1,268 @@ |
1050 | +/* |
1051 | + * Copyright 2016 Canonical Ltd. |
1052 | + * |
1053 | + * This program is free software; you can redistribute it and/or modify |
1054 | + * it under the terms of the GNU Lesser General Public License as published by |
1055 | + * the Free Software Foundation; version 3. |
1056 | + * |
1057 | + * This program is distributed in the hope that it will be useful, |
1058 | + * but WITHOUT ANY WARRANTY; without even the implied warranty of |
1059 | + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
1060 | + * GNU Lesser General Public License for more details. |
1061 | + * |
1062 | + * You should have received a copy of the GNU Lesser General Public License |
1063 | + * along with this program. If not, see <http://www.gnu.org/licenses/>. |
1064 | + * |
1065 | + * Author: Pierre Bertet <pierre.bertet@canonical.com> |
1066 | + */ |
1067 | + |
1068 | +#include "button_p.h" |
1069 | +#include "ucstyleditembase_p.h" |
1070 | +#include "ucnamespace.h" |
1071 | + |
1072 | +namespace UbuntuToolkit { |
1073 | + |
1074 | +ButtonPrivate::ButtonPrivate() |
1075 | + : UCAbstractButtonPrivate() |
1076 | + , type(Button::Normal) |
1077 | + , font(QFont()) |
1078 | + , iconPosition(Button::Before) |
1079 | + , color(QColor()) |
1080 | + , strokeColor(QColor()) |
1081 | + , gradient(QGradient()) |
1082 | +{ |
1083 | +} |
1084 | + |
1085 | +/*! |
1086 | +\qmltype Button |
1087 | +\instantiates UbuntuToolkit::Button |
1088 | +\inherits UCAbstractButton |
1089 | +\inqmlmodule Ubuntu.Components 1.3 |
1090 | +\ingroup ubuntu |
1091 | +\brief Standard Ubuntu button. |
1092 | + |
1093 | +The Button component allows to create a button that follows the Ubuntu visual and behavioral standards. |
1094 | + |
1095 | +Several types are available: normal, the default, will be represented by an opaque shape with the text above it, while the outline type will display a transparent button with a border. The positive and negative types can be used to indicate the nature of the action. |
1096 | + |
1097 | +\l {http://design.ubuntu.com/apps/building-blocks/buttons}{See also the Design Guidelines on Buttons}. |
1098 | + |
1099 | +Example: |
1100 | +\qml |
1101 | + Column { |
1102 | + Button { |
1103 | + text: "Send" |
1104 | + onClicked: print("clicked text-only Button") |
1105 | + } |
1106 | + Button { |
1107 | + iconName: "compose" |
1108 | + onClicked: print("clicked icon-only Button") |
1109 | + } |
1110 | + } |
1111 | +\endqml |
1112 | + |
1113 | +An \l Action can be used to specify \b clicked, iconSource and text: |
1114 | +\qml |
1115 | + Item { |
1116 | + Action { |
1117 | + id: action1 |
1118 | + text: "Click me" |
1119 | + onTriggered: print("action!") |
1120 | + iconName: "compose" |
1121 | + } |
1122 | + Button { |
1123 | + anchors.centerIn: parent |
1124 | + action: action1 |
1125 | + } |
1126 | + } |
1127 | +\endqml |
1128 | + |
1129 | +\sa TextButton |
1130 | +*/ |
1131 | +Button::Button(QQuickItem* parent) |
1132 | + : UCAbstractButton(*(new ButtonPrivate), parent) |
1133 | +{ |
1134 | + /* |
1135 | + * From ucbottomedgehint.cpp: |
1136 | + * we cannot use setStyleName as that will trigger style loading |
1137 | + * and the qmlEngine is not known at this phase of the of the |
1138 | + * initialization. Therefore we simply set the style name default. Style |
1139 | + * loading will happen during component completion. |
1140 | + */ |
1141 | + UCStyledItemBasePrivate::get(this)->styleDocument = QStringLiteral("ButtonStyle"); |
1142 | +} |
1143 | + |
1144 | +/*! |
1145 | + \qmlproperty url Button::iconSource |
1146 | + The source URL of the icon to display inside the button. Leave this value |
1147 | + blank for a text-only button. |
1148 | + If \l action is set, the default iconSource is that of the action. |
1149 | +*/ |
1150 | + |
1151 | +/*! |
1152 | + \qmlproperty string Button::text |
1153 | + The text to display in the button. If an icon was defined, the text will be |
1154 | + shown next to the icon, otherwise it will be centered. Leave blank for an |
1155 | + icon-only button. |
1156 | + If \l action is set, the default text is that of the action. |
1157 | +*/ |
1158 | + |
1159 | +/*! |
1160 | + \qmlsignal Button::clicked() |
1161 | + This handler is called when there is a mouse click on the button and the |
1162 | + button is not disabled. If \l {ActionItem::action}{action} is defined, the |
1163 | + action will be triggered. |
1164 | + */ |
1165 | + |
1166 | +/*! |
1167 | + * |
1168 | + * \qmlsignal Button::pressAndHold() |
1169 | + * This handler is called when there is a long press. |
1170 | + */ |
1171 | + |
1172 | +/*! |
1173 | + \qmlproperty Action Button::action |
1174 | + An \l Action to specify the \l clicked, \l iconSource and \l text |
1175 | + properties. |
1176 | +*/ |
1177 | + |
1178 | +/*! |
1179 | + \qmlproperty enumeration Button::type |
1180 | + The type defines the button style. The default value is \c Button.Normal. |
1181 | + \list |
1182 | + \li \b Button.Normal - The button shape is visible. |
1183 | + \li \b Button.Outline - The button shape is transparent but a border is present. |
1184 | + \li \b Button.Positive - The action is positive. |
1185 | + \li \b Button.Negative - The action is negative. |
1186 | + \endlist |
1187 | +*/ |
1188 | +Button::Type Button::type() |
1189 | +{ |
1190 | + Q_D(Button); |
1191 | + return d->type; |
1192 | +} |
1193 | +void Button::setType(Type &type) |
1194 | +{ |
1195 | + Q_D(Button); |
1196 | + d->type = type; |
1197 | + Q_EMIT typeChanged(); |
1198 | +} |
1199 | + |
1200 | +/*! |
1201 | + \qmlproperty string Button::font |
1202 | + The font used for the button's text. |
1203 | +*/ |
1204 | +QFont Button::font() |
1205 | +{ |
1206 | + Q_D(Button); |
1207 | + return d->font; |
1208 | +} |
1209 | +void Button::setFont(QFont &font) |
1210 | +{ |
1211 | + Q_D(Button); |
1212 | + d->font = font; |
1213 | + Q_EMIT fontChanged(); |
1214 | +} |
1215 | + |
1216 | +/*! |
1217 | + \qmlproperty enumeration Button::iconPosition |
1218 | + |
1219 | + Where to position the icon in the button. The default value is \c Button.Before. |
1220 | + |
1221 | + \note If only text or only an icon is defined, this property is ignored and the |
1222 | + text or icon is centered horizontally and vertically in the button. |
1223 | + |
1224 | + \list |
1225 | + \li \b Button.Before - The icon is positioned before the text. |
1226 | + \li \b Button.After - The icon is positioned after the text. |
1227 | + \endlist |
1228 | +*/ |
1229 | +Button::IconPosition Button::iconPosition() |
1230 | +{ |
1231 | + Q_D(Button); |
1232 | + return d->iconPosition; |
1233 | +} |
1234 | +void Button::setIconPosition(IconPosition &iconPosition) |
1235 | +{ |
1236 | + Q_D(Button); |
1237 | + d->iconPosition = iconPosition; |
1238 | + Q_EMIT iconPositionChanged(); |
1239 | +} |
1240 | + |
1241 | +/*! |
1242 | + \qmlproperty string Button::color |
1243 | + \deprecated |
1244 | + The property is deprecated, use `emphasis` or a custom style instead. |
1245 | +*/ |
1246 | +QColor Button::color() |
1247 | +{ |
1248 | + Q_D(Button); |
1249 | + return d->color; |
1250 | +} |
1251 | +void Button::setColor(QColor &color) |
1252 | +{ |
1253 | + Q_D(Button); |
1254 | + |
1255 | + qDebug() << color; |
1256 | + qDebug() << d->color; |
1257 | + |
1258 | + if (color == d->color) { |
1259 | + return; |
1260 | + } |
1261 | + d->color = color; |
1262 | + |
1263 | + qDebug() << color; |
1264 | + qDebug() << d->color; |
1265 | + |
1266 | + UC_QML_DEPRECATION_WARNING("WARNING: `color` is deprecated. Use `emphasis` or `StyleHint` instead."); |
1267 | + |
1268 | + Q_EMIT colorChanged(); |
1269 | +} |
1270 | + |
1271 | +/*! |
1272 | + \qmlproperty string Button::strokeColor |
1273 | + \deprecated |
1274 | + The property is deprecated, set `type` to "outline" instead. |
1275 | +*/ |
1276 | +QColor Button::strokeColor() |
1277 | +{ |
1278 | + Q_D(Button); |
1279 | + return d->strokeColor; |
1280 | +} |
1281 | +void Button::setStrokeColor(QColor &strokeColor) |
1282 | +{ |
1283 | + Q_D(Button); |
1284 | + if (strokeColor == d->strokeColor) { |
1285 | + return; |
1286 | + } |
1287 | + d->strokeColor = strokeColor; |
1288 | + |
1289 | + UC_QML_DEPRECATION_WARNING("WARNING: `strokeColor` is deprecated. Set the `type` property to Button.Type.Normal, or use `StyleHint` instead."); |
1290 | + |
1291 | + Q_EMIT strokeColorChanged(); |
1292 | +} |
1293 | + |
1294 | +/*! |
1295 | + \qmlproperty string Button::gradient |
1296 | + \deprecated |
1297 | + The property is deprecated, use `type` or a custom style instead. |
1298 | +*/ |
1299 | +QGradient Button::gradient() |
1300 | +{ |
1301 | + Q_D(Button); |
1302 | + return d->gradient; |
1303 | +} |
1304 | +void Button::setGradient(QGradient &gradient) |
1305 | +{ |
1306 | + Q_D(Button); |
1307 | + if (gradient == d->gradient) { |
1308 | + return; |
1309 | + } |
1310 | + d->gradient = gradient; |
1311 | + |
1312 | + UC_QML_DEPRECATION_WARNING("WARNING: `gradient` is deprecated. Use `type`, `type`, or `StyleHint` instead."); |
1313 | + |
1314 | + Q_EMIT gradientChanged(); |
1315 | +} |
1316 | + |
1317 | +} |
1318 | |
1319 | === added file 'src/Ubuntu/Components/plugin/button.h' |
1320 | --- src/Ubuntu/Components/plugin/button.h 1970-01-01 00:00:00 +0000 |
1321 | +++ src/Ubuntu/Components/plugin/button.h 2016-04-08 16:09:06 +0000 |
1322 | @@ -0,0 +1,84 @@ |
1323 | +/* |
1324 | + * Copyright 2016 Canonical Ltd. |
1325 | + * |
1326 | + * This program is free software; you can redistribute it and/or modify |
1327 | + * it under the terms of the GNU Lesser General Public License as published by |
1328 | + * the Free Software Foundation; version 3. |
1329 | + * |
1330 | + * This program is distributed in the hope that it will be useful, |
1331 | + * but WITHOUT ANY WARRANTY; without even the implied warranty of |
1332 | + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
1333 | + * GNU Lesser General Public License for more details. |
1334 | + * |
1335 | + * You should have received a copy of the GNU Lesser General Public License |
1336 | + * along with this program. If not, see <http://www.gnu.org/licenses/>. |
1337 | + * |
1338 | + * Author: Pierre Bertet <pierre.bertet@canonical.com> |
1339 | + */ |
1340 | + |
1341 | +#ifndef BUTTON_H |
1342 | +#define BUTTON_H |
1343 | + |
1344 | +#include "ucabstractbutton.h" |
1345 | + |
1346 | +namespace UbuntuToolkit { |
1347 | + |
1348 | +class ButtonPrivate; |
1349 | +class Button : public UCAbstractButton |
1350 | +{ |
1351 | + Q_OBJECT |
1352 | + |
1353 | + Q_ENUMS(IconPosition) |
1354 | + Q_ENUMS(Type) |
1355 | + |
1356 | + Q_PROPERTY(Type type READ type WRITE setType NOTIFY typeChanged FINAL) |
1357 | + Q_PROPERTY(QFont font READ font WRITE setFont NOTIFY fontChanged FINAL) |
1358 | + Q_PROPERTY(IconPosition iconPosition READ iconPosition WRITE setIconPosition NOTIFY iconPositionChanged FINAL) |
1359 | + |
1360 | + // deprecated properties |
1361 | + Q_PROPERTY(QColor color READ color WRITE setColor NOTIFY colorChanged FINAL) |
1362 | + Q_PROPERTY(QColor strokeColor READ strokeColor WRITE setStrokeColor NOTIFY strokeColorChanged FINAL) |
1363 | + Q_PROPERTY(QGradient gradient READ gradient WRITE setGradient NOTIFY gradientChanged FINAL) |
1364 | + |
1365 | +public: |
1366 | + explicit Button(QQuickItem* parent=0); |
1367 | + |
1368 | + enum IconPosition { Before, left = Before, After, right = After }; |
1369 | + enum Type { Normal, Outline, Positive, Negative }; |
1370 | + |
1371 | + Type type(); |
1372 | + void setType(Type &type); |
1373 | + |
1374 | + QFont font(); |
1375 | + void setFont(QFont &font); |
1376 | + |
1377 | + IconPosition iconPosition(); |
1378 | + void setIconPosition(IconPosition &iconPosition); |
1379 | + |
1380 | + QColor color(); |
1381 | + void setColor(QColor &color); |
1382 | + |
1383 | + QColor strokeColor(); |
1384 | + void setStrokeColor(QColor &strokeColor); |
1385 | + |
1386 | + QGradient gradient(); |
1387 | + void setGradient(QGradient &gradient); |
1388 | + |
1389 | +Q_SIGNALS: |
1390 | + void typeChanged(); |
1391 | + void fontChanged(); |
1392 | + void iconPositionChanged(); |
1393 | + void colorChanged(); |
1394 | + void strokeColorChanged(); |
1395 | + void gradientChanged(); |
1396 | + |
1397 | +private: |
1398 | + Q_DECLARE_PRIVATE(Button) |
1399 | + Q_DISABLE_COPY(Button) |
1400 | +}; |
1401 | + |
1402 | +} |
1403 | + |
1404 | +QML_DECLARE_TYPE(UbuntuToolkit::Button) |
1405 | + |
1406 | +#endif // BUTTON_H |
1407 | |
1408 | === added file 'src/Ubuntu/Components/plugin/button_p.h' |
1409 | --- src/Ubuntu/Components/plugin/button_p.h 1970-01-01 00:00:00 +0000 |
1410 | +++ src/Ubuntu/Components/plugin/button_p.h 2016-04-08 16:09:06 +0000 |
1411 | @@ -0,0 +1,46 @@ |
1412 | +/* |
1413 | + * Copyright 2016 Canonical Ltd. |
1414 | + * |
1415 | + * This program is free software; you can redistribute it and/or modify |
1416 | + * it under the terms of the GNU Lesser General Public License as published by |
1417 | + * the Free Software Foundation; version 3. |
1418 | + * |
1419 | + * This program is distributed in the hope that it will be useful, |
1420 | + * but WITHOUT ANY WARRANTY; without even the implied warranty of |
1421 | + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
1422 | + * GNU Lesser General Public License for more details. |
1423 | + * |
1424 | + * You should have received a copy of the GNU Lesser General Public License |
1425 | + * along with this program. If not, see <http://www.gnu.org/licenses/>. |
1426 | + */ |
1427 | + |
1428 | +#ifndef BUTTON_P |
1429 | +#define BUTTON_P |
1430 | + |
1431 | +#include "button.h" |
1432 | +#include "ucabstractbutton_p.h" |
1433 | + |
1434 | +namespace UbuntuToolkit { |
1435 | + |
1436 | +class ButtonPrivate : public UCAbstractButtonPrivate |
1437 | +{ |
1438 | + Q_DECLARE_PUBLIC(Button) |
1439 | +public: |
1440 | + explicit ButtonPrivate(); |
1441 | + |
1442 | + static ButtonPrivate *get(Button *item) |
1443 | + { |
1444 | + return item->d_func(); |
1445 | + } |
1446 | + |
1447 | + Button::Type type; |
1448 | + QFont font; |
1449 | + Button::IconPosition iconPosition; |
1450 | + QColor color; |
1451 | + QColor strokeColor; |
1452 | + QGradient gradient; |
1453 | +}; |
1454 | + |
1455 | +} |
1456 | + |
1457 | +#endif // BUTTON_P |
1458 | |
1459 | === modified file 'src/Ubuntu/Components/plugin/plugin.cpp' |
1460 | --- src/Ubuntu/Components/plugin/plugin.cpp 2016-04-08 16:09:04 +0000 |
1461 | +++ src/Ubuntu/Components/plugin/plugin.cpp 2016-04-08 16:09:06 +0000 |
1462 | @@ -80,6 +80,8 @@ |
1463 | #include "ucperformancemonitor.h" |
1464 | #include "privates/ucpagewrapper.h" |
1465 | #include "privates/appheaderbase.h" |
1466 | +#include "button.h" |
1467 | +#include "textbutton.h" |
1468 | #include "privates/shape/shadow.h" |
1469 | #include "privates/shape/fill.h" |
1470 | #include "privates/shape/frame.h" |
1471 | @@ -237,6 +239,8 @@ |
1472 | qmlRegisterType<UCPageTreeNode>(uri, 1, 3, "PageTreeNode"); |
1473 | qmlRegisterType<UCPopupContext>(uri, 1, 3, "PopupContext"); |
1474 | qmlRegisterType<UCMainViewBase>(uri, 1, 3, "MainViewBase"); |
1475 | + qmlRegisterType<UbuntuToolkit::Button>(uri, 1, 3, "Button"); |
1476 | + qmlRegisterType<UbuntuToolkit::TextButton>(uri, 1, 3, "TextButton"); |
1477 | } |
1478 | |
1479 | void UbuntuComponentsPlugin::initializeContextProperties(QQmlEngine *engine) |
1480 | |
1481 | === modified file 'src/Ubuntu/Components/plugin/plugin.pri' |
1482 | --- src/Ubuntu/Components/plugin/plugin.pri 2016-04-08 16:09:04 +0000 |
1483 | +++ src/Ubuntu/Components/plugin/plugin.pri 2016-04-08 16:09:06 +0000 |
1484 | @@ -110,22 +110,20 @@ |
1485 | $$PWD/ucmainviewbase.h \ |
1486 | $$PWD/ucmainviewbase_p.h \ |
1487 | $$PWD/ucperformancemonitor.h \ |
1488 | - $$PWD/label_p.h \ |
1489 | $$PWD/privates/listviewextensions.h \ |
1490 | $$PWD/privates/ucpagewrapper.h \ |
1491 | $$PWD/privates/ucpagewrapper_p.h \ |
1492 | $$PWD/privates/ucpagewrapperincubator_p.h \ |
1493 | $$PWD/privates/appheaderbase.h \ |
1494 | -<<<<<<< TREE |
1495 | - $$PWD/label_p.h \ |
1496 | - $$PWD/ucbottomedgeregion_p.h |
1497 | -======= |
1498 | + $$PWD/button.h \ |
1499 | + $$PWD/textbutton.h \ |
1500 | $$PWD/privates/shape/utils.h \ |
1501 | $$PWD/privates/shape/texturefactory.h \ |
1502 | $$PWD/privates/shape/fill.h \ |
1503 | $$PWD/privates/shape/frame.h \ |
1504 | - $$PWD/privates/shape/shadow.h |
1505 | ->>>>>>> MERGE-SOURCE |
1506 | + $$PWD/privates/shape/shadow.h \ |
1507 | + $$PWD/label_p.h \ |
1508 | + $$PWD/ucbottomedgeregion_p.h |
1509 | |
1510 | SOURCES += $$PWD/plugin.cpp \ |
1511 | $$PWD/uctheme.cpp \ |
1512 | @@ -202,6 +200,8 @@ |
1513 | $$PWD/privates/ucpagewrapper.cpp \ |
1514 | $$PWD/privates/ucpagewrapperincubator.cpp \ |
1515 | $$PWD/privates/appheaderbase.cpp \ |
1516 | + $$PWD/button.cpp \ |
1517 | + $$PWD/textbutton.cpp \ |
1518 | $$PWD/privates/shape/utils.cpp \ |
1519 | $$PWD/privates/shape/texturefactory.cpp \ |
1520 | $$PWD/privates/shape/fill.cpp \ |
1521 | |
1522 | === added file 'src/Ubuntu/Components/plugin/textbutton.cpp' |
1523 | --- src/Ubuntu/Components/plugin/textbutton.cpp 1970-01-01 00:00:00 +0000 |
1524 | +++ src/Ubuntu/Components/plugin/textbutton.cpp 2016-04-08 16:09:06 +0000 |
1525 | @@ -0,0 +1,134 @@ |
1526 | +/* |
1527 | + * Copyright 2016 Canonical Ltd. |
1528 | + * |
1529 | + * This program is free software; you can redistribute it and/or modify |
1530 | + * it under the terms of the GNU Lesser General Public License as published by |
1531 | + * the Free Software Foundation; version 3. |
1532 | + * |
1533 | + * This program is distributed in the hope that it will be useful, |
1534 | + * but WITHOUT ANY WARRANTY; without even the implied warranty of |
1535 | + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
1536 | + * GNU Lesser General Public License for more details. |
1537 | + * |
1538 | + * You should have received a copy of the GNU Lesser General Public License |
1539 | + * along with this program. If not, see <http://www.gnu.org/licenses/>. |
1540 | + * |
1541 | + * Author: Pierre Bertet <pierre.bertet@canonical.com> |
1542 | + */ |
1543 | + |
1544 | +#include "textbutton_p.h" |
1545 | +#include "ucstyleditembase_p.h" |
1546 | +#include "ucnamespace.h" |
1547 | + |
1548 | +namespace UbuntuToolkit { |
1549 | + |
1550 | +TextButtonPrivate::TextButtonPrivate() |
1551 | + : UCAbstractButtonPrivate() |
1552 | + , strong(false) |
1553 | +{ |
1554 | +} |
1555 | + |
1556 | +/*! |
1557 | +\qmltype TextButton |
1558 | +\instantiates UbuntuToolkit::TextButton |
1559 | +\inherits UCAbstractButton |
1560 | +\inqmlmodule Ubuntu.Components 1.3 |
1561 | +\ingroup ubuntu |
1562 | +\brief Ubuntu text button. |
1563 | + |
1564 | +The TextButton component allows to create a text-only button that follows the Ubuntu visual and behavioral standards. |
1565 | + |
1566 | +The button can be strong, which will be represented by a bold font. |
1567 | + |
1568 | +\l {http://design.ubuntu.com/apps/building-blocks/buttons}{See also the Design Guidelines on Buttons}. |
1569 | + |
1570 | +Example: |
1571 | + |
1572 | +\qml |
1573 | +TextButton { |
1574 | + text: "Send" |
1575 | + onClicked: print("clicked text-only Button") |
1576 | +} |
1577 | +\endqml |
1578 | + |
1579 | +An \l Action can be used to specify \b clicked and \b text: |
1580 | + |
1581 | +\qml |
1582 | +Item { |
1583 | + Action { |
1584 | + id: myAction |
1585 | + text: "Click me" |
1586 | + onTriggered: print("action!") |
1587 | + } |
1588 | + TextButton { |
1589 | + action: myAction |
1590 | + } |
1591 | +} |
1592 | +\endqml |
1593 | + |
1594 | +\sa Button |
1595 | +*/ |
1596 | + |
1597 | +TextButton::TextButton(QQuickItem* parent) |
1598 | + : UCAbstractButton(*(new TextButtonPrivate), parent) |
1599 | +{ |
1600 | + /* |
1601 | + * From ucbottomedgehint.cpp: |
1602 | + * we cannot use setStyleName as that will trigger style loading |
1603 | + * and the qmlEngine is not known at this phase of the of the |
1604 | + * initialization. Therefore we simply set the style name default. Style |
1605 | + * loading will happen during component completion. |
1606 | + */ |
1607 | + UCStyledItemBasePrivate::get(this)->styleDocument = QStringLiteral("TextButtonStyle"); |
1608 | +} |
1609 | + |
1610 | +/*! |
1611 | + \qmlproperty url TextButton::iconSource |
1612 | + The source URL of the icon to display inside the button. Leave this value |
1613 | + blank for a text-only button. |
1614 | + If \l action is set, the default iconSource is that of the action. |
1615 | +*/ |
1616 | + |
1617 | +/*! |
1618 | + \qmlproperty string TextButton::text |
1619 | + The text to display in the button. If an icon was defined, the text will be |
1620 | + shown next to the icon, otherwise it will be centered. Leave blank for an |
1621 | + icon-only button. |
1622 | + If \l action is set, the default text is that of the action. |
1623 | +*/ |
1624 | + |
1625 | +/*! |
1626 | + \qmlsignal TextButton::clicked() |
1627 | + This handler is called when there is a mouse click on the button and the |
1628 | + button is not disabled. If \l {ActionItem::action}{action} is defined, the |
1629 | + action will be triggered. |
1630 | +*/ |
1631 | + |
1632 | +/*! |
1633 | + \qmlsignal TextButton::pressAndHold() |
1634 | + This handler is called when there is a long press. |
1635 | +*/ |
1636 | + |
1637 | +/*! |
1638 | + \qmlproperty Action TextButton::action |
1639 | + An \l Action to specify the clicked and \l text properties. |
1640 | +*/ |
1641 | + |
1642 | +/*! |
1643 | + \qmlproperty bool TextButton::strong |
1644 | + Set to `true` to give importance to the button. The button font will appear |
1645 | + in bold. |
1646 | +*/ |
1647 | +bool TextButton::strong() |
1648 | +{ |
1649 | + Q_D(TextButton); |
1650 | + return d->strong; |
1651 | +} |
1652 | +void TextButton::setStrong(bool &strong) |
1653 | +{ |
1654 | + Q_D(TextButton); |
1655 | + d->strong = strong; |
1656 | + Q_EMIT strongChanged(); |
1657 | +} |
1658 | + |
1659 | +} |
1660 | |
1661 | === added file 'src/Ubuntu/Components/plugin/textbutton.h' |
1662 | --- src/Ubuntu/Components/plugin/textbutton.h 1970-01-01 00:00:00 +0000 |
1663 | +++ src/Ubuntu/Components/plugin/textbutton.h 2016-04-08 16:09:06 +0000 |
1664 | @@ -0,0 +1,51 @@ |
1665 | +/* |
1666 | + * Copyright 2016 Canonical Ltd. |
1667 | + * |
1668 | + * This program is free software; you can redistribute it and/or modify |
1669 | + * it under the terms of the GNU Lesser General Public License as published by |
1670 | + * the Free Software Foundation; version 3. |
1671 | + * |
1672 | + * This program is distributed in the hope that it will be useful, |
1673 | + * but WITHOUT ANY WARRANTY; without even the implied warranty of |
1674 | + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
1675 | + * GNU Lesser General Public License for more details. |
1676 | + * |
1677 | + * You should have received a copy of the GNU Lesser General Public License |
1678 | + * along with this program. If not, see <http://www.gnu.org/licenses/>. |
1679 | + * |
1680 | + * Author: Pierre Bertet <pierre.bertet@canonical.com> |
1681 | + */ |
1682 | + |
1683 | +#ifndef TEXTBUTTON_H |
1684 | +#define TEXTBUTTON_H |
1685 | + |
1686 | +#include "ucabstractbutton.h" |
1687 | + |
1688 | +namespace UbuntuToolkit { |
1689 | + |
1690 | +class TextButtonPrivate; |
1691 | +class TextButton : public UCAbstractButton |
1692 | +{ |
1693 | + Q_OBJECT |
1694 | + |
1695 | + Q_PROPERTY(bool strong READ strong WRITE setStrong NOTIFY strongChanged) |
1696 | + |
1697 | +public: |
1698 | + explicit TextButton(QQuickItem* parent=0); |
1699 | + |
1700 | + bool strong(); |
1701 | + void setStrong(bool &strong); |
1702 | + |
1703 | +Q_SIGNALS: |
1704 | + void strongChanged(); |
1705 | + |
1706 | +private: |
1707 | + Q_DECLARE_PRIVATE(TextButton) |
1708 | + Q_DISABLE_COPY(TextButton) |
1709 | +}; |
1710 | + |
1711 | +} |
1712 | + |
1713 | +QML_DECLARE_TYPE(UbuntuToolkit::TextButton) |
1714 | + |
1715 | +#endif // TEXTBUTTON_H |
1716 | |
1717 | === modified file 'src/Ubuntu/Components/plugin/ucabstractbutton.cpp' |
1718 | --- src/Ubuntu/Components/plugin/ucabstractbutton.cpp 2016-03-01 19:36:40 +0000 |
1719 | +++ src/Ubuntu/Components/plugin/ucabstractbutton.cpp 2016-04-08 16:09:06 +0000 |
1720 | @@ -104,7 +104,7 @@ |
1721 | { |
1722 | d_func()->init(); |
1723 | } |
1724 | -UCAbstractButton::UCAbstractButton(UCAbstractButtonPrivate &&dd, QQuickItem *parent) |
1725 | +UCAbstractButton::UCAbstractButton(UCAbstractButtonPrivate &dd, QQuickItem *parent) |
1726 | : UCActionItem(dd, parent) |
1727 | { |
1728 | d_func()->init(); |
1729 | |
1730 | === modified file 'src/Ubuntu/Components/plugin/ucabstractbutton.h' |
1731 | --- src/Ubuntu/Components/plugin/ucabstractbutton.h 2016-02-10 19:35:49 +0000 |
1732 | +++ src/Ubuntu/Components/plugin/ucabstractbutton.h 2016-04-08 16:09:06 +0000 |
1733 | @@ -60,7 +60,7 @@ |
1734 | void pressAndHold(); |
1735 | |
1736 | protected: |
1737 | - UCAbstractButton(UCAbstractButtonPrivate &&, QQuickItem *parent = 0); |
1738 | + UCAbstractButton(UCAbstractButtonPrivate &, QQuickItem *parent = 0); |
1739 | |
1740 | Q_DECLARE_PRIVATE(UCAbstractButton) |
1741 | Q_PRIVATE_SLOT(d_func(), void _q_mouseAreaPressed()) |
1742 | |
1743 | === modified file 'src/Ubuntu/Components/qmldir' |
1744 | --- src/Ubuntu/Components/qmldir 2016-02-16 11:39:32 +0000 |
1745 | +++ src/Ubuntu/Components/qmldir 2016-04-08 16:09:06 +0000 |
1746 | @@ -103,7 +103,6 @@ |
1747 | ToolbarButton 1.3 1.3/ToolbarButton.qml |
1748 | MainView 1.3 1.3/MainView.qml |
1749 | ComboButton 1.3 1.3/ComboButton.qml |
1750 | -Button 1.3 1.3/Button.qml |
1751 | Panel 1.3 1.3/Panel.qml |
1752 | Tab 1.3 1.3/Tab.qml |
1753 | TabBar 1.3 1.3/TabBar.qml |
1754 | |
1755 | === added file 'tests/unit/tst_performance/ButtonGrid13.qml' |
1756 | --- tests/unit/tst_performance/ButtonGrid13.qml 1970-01-01 00:00:00 +0000 |
1757 | +++ tests/unit/tst_performance/ButtonGrid13.qml 2016-04-08 16:09:06 +0000 |
1758 | @@ -0,0 +1,30 @@ |
1759 | +/* |
1760 | + * Copyright 2016 Canonical Ltd. |
1761 | + * |
1762 | + * This program is free software; you can redistribute it and/or modify |
1763 | + * it under the terms of the GNU Lesser General Public License as published by |
1764 | + * the Free Software Foundation; version 3. |
1765 | + * |
1766 | + * This program is distributed in the hope that it will be useful, |
1767 | + * but WITHOUT ANY WARRANTY; without even the implied warranty of |
1768 | + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
1769 | + * GNU Lesser General Public License for more details. |
1770 | + * |
1771 | + * You should have received a copy of the GNU Lesser General Public License |
1772 | + * along with this program. If not, see <http://www.gnu.org/licenses/>. |
1773 | + */ |
1774 | + |
1775 | +import QtQuick 2.3 |
1776 | +import Ubuntu.Components 1.3 |
1777 | + |
1778 | +Grid { |
1779 | + width: 800 |
1780 | + height: 600 |
1781 | + rows: 16 |
1782 | + columns: 16 |
1783 | + Repeater { |
1784 | + model: 16*16 |
1785 | + Button { |
1786 | + } |
1787 | + } |
1788 | +} |
1789 | |
1790 | === modified file 'tests/unit/tst_performance/tst_performance.cpp' |
1791 | --- tests/unit/tst_performance/tst_performance.cpp 2015-12-07 22:16:52 +0000 |
1792 | +++ tests/unit/tst_performance/tst_performance.cpp 2016-04-08 16:09:06 +0000 |
1793 | @@ -110,7 +110,8 @@ |
1794 | QTest::newRow("grid with Label 1.3") << "LabelGrid13.qml" << QUrl(); |
1795 | QTest::newRow("grid with UbuntuShape") << "UbuntuShapeGrid.qml" << QUrl(); |
1796 | QTest::newRow("grid with UbuntuShapePair") << "PairOfUbuntuShapeGrid.qml" << QUrl(); |
1797 | - QTest::newRow("grid with Button") << "ButtonGrid.qml" << QUrl(); |
1798 | + QTest::newRow("grid with Button 1.1") << "ButtonGrid.qml" << QUrl(); |
1799 | + QTest::newRow("grid with Button 1.3") << "ButtonGrid13.qml" << QUrl(); |
1800 | QTest::newRow("grid with Slider") << "SliderGrid.qml" << QUrl(); |
1801 | QTest::newRow("list with QtQuick Item") << "ItemList.qml" << QUrl(); |
1802 | QTest::newRow("list with new ListItem") << "ListItemList.qml" << QUrl(); |
1803 | @@ -131,7 +132,7 @@ |
1804 | QTest::newRow("list of Scrollbar 1.3") << "ListOfScrollbars_1_3.qml" << QUrl(); |
1805 | QTest::newRow("list of ScrollView 1.3 with both Scrollbars") << "ListOfScrollView_bothScrollbars_1_3.qml" << QUrl(); |
1806 | // disable this test as it takes >20 seconds. Kept still for measurements to be done during development |
1807 | - // QTest::newRow("list with ListItems.Base (one icon, one label and one chevron)") << "ListItemsBaseList.qml" << QUrl(); |
1808 | + // QTest::newRow("list with ListItems.Base (one icon, one label and one chevron)") << "ListItemsBaseList.qml" << QUrl(); |
1809 | QTest::newRow("single MainView") << "MainView.qml" << QUrl(); |
1810 | } |
1811 |
Button implementation is missing. I've added few comments below, please condor those, they are crucial.
I was thinking whether this common style for all the buttons makes sense... Shouldn't we have separate style files for each button type rather than have one where we disable some visuals because they are not in use? Think about performance.