Fluid 1.3.0
Material Design for QtQuick and Qml
Loading...
Searching...
No Matches
menu.h
Go to the documentation of this file.
1// SPDX-FileCopyrightText: 2026 Pier Luigi Fiorini <pierluigi.fiorini@gmail.com>
2// SPDX-License-Identifier: MPL-2.0
3
4#pragma once
5
6#include <QtCore/qobject.h>
7#include <QtQml/qqmlregistration.h>
8
9#include "elevationtokens.h"
10#include "shapetokens.h"
11#include "statetokens.h"
12
13// Component values map to the AndroidX Material 3 generated tokens:
14// https://android.googlesource.com/platform/frameworks/support/+/5ba2cdd61be7b6945db999b238d14f3c626136fb/compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/tokens/
15// MenuTokens.kt and MenuItemTokens.kt.
16
17namespace Fluid {
18
25struct Menu
26{
27 Q_GADGET
28 QML_ANONYMOUS
29
30 Q_PROPERTY(qreal containerElevation READ containerElevation CONSTANT FINAL)
31 Q_PROPERTY(Fluid::ShapeValue containerShape READ containerShape CONSTANT FINAL)
32 Q_PROPERTY(qreal topPadding READ topPadding CONSTANT FINAL)
33 Q_PROPERTY(qreal bottomPadding READ bottomPadding CONSTANT FINAL)
34 Q_PROPERTY(qreal viewportMargin READ viewportMargin CONSTANT FINAL)
35 Q_PROPERTY(qreal minimumWidth READ minimumWidth CONSTANT FINAL)
36 Q_PROPERTY(qreal maximumWidth READ maximumWidth CONSTANT FINAL)
37 Q_PROPERTY(qreal itemHeight READ itemHeight CONSTANT FINAL)
38 Q_PROPERTY(qreal itemHorizontalPadding READ itemHorizontalPadding CONSTANT FINAL)
39 Q_PROPERTY(qreal iconSize READ iconSize CONSTANT FINAL)
40 Q_PROPERTY(qreal iconLabelGap READ iconLabelGap CONSTANT FINAL)
41 Q_PROPERTY(qreal hoverStateLayerOpacity READ hoverStateLayerOpacity CONSTANT FINAL)
42 Q_PROPERTY(qreal focusStateLayerOpacity READ focusStateLayerOpacity CONSTANT FINAL)
43 Q_PROPERTY(qreal pressedStateLayerOpacity READ pressedStateLayerOpacity CONSTANT FINAL)
44 Q_PROPERTY(qreal disabledContentOpacity READ disabledContentOpacity CONSTANT FINAL)
46 Q_PROPERTY(Fluid::ShapeValue verticalGroupShape READ verticalGroupShape CONSTANT FINAL)
51 Q_PROPERTY(Fluid::ShapeValue verticalItemShape READ verticalItemShape CONSTANT FINAL)
54 Q_PROPERTY(
58 FINAL)
60 FINAL)
61 Q_PROPERTY(qreal verticalItemHeight READ verticalItemHeight CONSTANT FINAL)
62 Q_PROPERTY(qreal verticalGroupPadding READ verticalGroupPadding CONSTANT FINAL)
63 Q_PROPERTY(qreal verticalGroupContentPadding READ verticalGroupContentPadding CONSTANT FINAL)
64 Q_PROPERTY(qreal verticalSegmentedGap READ verticalSegmentedGap CONSTANT FINAL)
65 Q_PROPERTY(qreal verticalDividerInset READ verticalDividerInset CONSTANT FINAL)
66 Q_PROPERTY(qreal verticalSectionLabelHeight READ verticalSectionLabelHeight CONSTANT FINAL)
68 FINAL)
70 FINAL)
71 Q_PROPERTY(qreal verticalItemTopPadding READ verticalItemTopPadding CONSTANT FINAL)
72 Q_PROPERTY(qreal verticalItemBottomPadding READ verticalItemBottomPadding CONSTANT FINAL)
73 Q_PROPERTY(qreal verticalItemLeadingSpace READ verticalItemLeadingSpace CONSTANT FINAL)
74 Q_PROPERTY(qreal verticalItemTrailingSpace READ verticalItemTrailingSpace CONSTANT FINAL)
75 Q_PROPERTY(qreal verticalItemBetweenSpace READ verticalItemBetweenSpace CONSTANT FINAL)
76 Q_PROPERTY(qreal verticalIconSize READ verticalIconSize CONSTANT FINAL)
77 Q_PROPERTY(qreal closedScale READ closedScale CONSTANT FINAL)
78 Q_PROPERTY(qreal horizontalViewportMargin READ horizontalViewportMargin CONSTANT FINAL)
79 Q_PROPERTY(qreal verticalViewportMargin READ verticalViewportMargin CONSTANT FINAL)
80
81public:
83 constexpr qreal containerElevation() const
84 {
85 return ElevationTokens{ }.level2();
86 }
87
89 constexpr ShapeValue containerShape() const
90 {
91 return ShapeTokens{ }.cornerExtraSmall();
92 }
93
95 constexpr qreal topPadding() const
96 {
97 return 8.0;
98 }
99
101 constexpr qreal bottomPadding() const
102 {
103 return 8.0;
104 }
105
107 constexpr qreal viewportMargin() const
108 {
109 return 8.0;
110 }
111
113 constexpr qreal minimumWidth() const
114 {
115 return 112.0;
116 }
117
119 constexpr qreal maximumWidth() const
120 {
121 return 280.0;
122 }
123
125 constexpr qreal itemHeight() const
126 {
127 return 48.0;
128 }
129
131 constexpr qreal itemHorizontalPadding() const
132 {
133 return 16.0;
134 }
135
137 constexpr qreal iconSize() const
138 {
139 return 24.0;
140 }
141
143 constexpr qreal iconLabelGap() const
144 {
145 return 12.0;
146 }
147
149 constexpr qreal hoverStateLayerOpacity() const
150 {
152 }
153
155 constexpr qreal focusStateLayerOpacity() const
156 {
158 }
159
161 constexpr qreal pressedStateLayerOpacity() const
162 {
164 }
165
167 constexpr qreal disabledContentOpacity() const
168 {
169 return 0.38;
170 }
171
174 {
175 return ShapeTokens{ }.cornerLarge();
176 }
177
180 {
181 return ShapeTokens{ }.cornerSmall();
182 }
183
190
193 {
194 return verticalGroupShape();
195 }
196
203
206 {
207 return verticalContainerShape();
208 }
209
212 {
213 return ShapeTokens{ }.cornerExtraSmall();
214 }
215
218 {
219 return ShapeTokens{ }.cornerMedium();
220 }
221
228
231 {
232 return ShapeTokens{ }.cornerExtraSmall();
233 }
234
241
244 {
245 return ShapeTokens{ }.cornerMedium();
246 }
247
250 {
251 return ShapeTokens{ }.cornerSmall();
252 }
253
255 constexpr qreal verticalItemHeight() const
256 {
257 return 44.0;
258 }
259
261 constexpr qreal verticalGroupPadding() const
262 {
263 return 4.0;
264 }
265
267 constexpr qreal verticalGroupContentPadding() const
268 {
269 return 2.0;
270 }
271
273 constexpr qreal verticalSegmentedGap() const
274 {
275 return 2.0;
276 }
277
279 constexpr qreal verticalDividerInset() const
280 {
281 return 12.0;
282 }
283
285 constexpr qreal verticalSectionLabelHeight() const
286 {
287 return 32.0;
288 }
289
291 constexpr qreal verticalSectionLabelLeadingSpace() const
292 {
293 return 12.0;
294 }
295
297 constexpr qreal verticalSectionLabelTrailingSpace() const
298 {
299 return 4.0;
300 }
301
303 constexpr qreal verticalItemTopPadding() const
304 {
305 return 8.0;
306 }
307
309 constexpr qreal verticalItemBottomPadding() const
310 {
311 return 8.0;
312 }
313
315 constexpr qreal verticalItemLeadingSpace() const
316 {
317 return 16.0;
318 }
319
321 constexpr qreal verticalItemTrailingSpace() const
322 {
323 return 16.0;
324 }
325
327 constexpr qreal verticalItemBetweenSpace() const
328 {
329 return 12.0;
330 }
331
333 constexpr qreal verticalIconSize() const
334 {
335 return 20.0;
336 }
337
339 constexpr qreal closedScale() const
340 {
341 return 0.8;
342 }
343
345 constexpr qreal horizontalViewportMargin() const
346 {
347 return 8.0;
348 }
349
351 constexpr qreal verticalViewportMargin() const
352 {
353 return 48.0;
354 }
355};
356
357} // namespace Fluid
Material Design 3 system elevation tokens.
Material Design 3 tokens for menus and menu items.
Definition menu.h:26
constexpr qreal pressedStateLayerOpacity() const
Opacity of the pressed state layer.
Definition menu.h:161
qreal verticalSectionLabelTrailingSpace
Definition menu.h:70
QML_ANONYMOUSqreal containerElevation
Definition menu.h:30
Fluid::ShapeValue verticalLastItemShape
Definition menu.h:56
Fluid::ShapeValue verticalContainerShape
Definition menu.h:45
qreal hoverStateLayerOpacity
Definition menu.h:41
Fluid::ShapeValue containerShape
Definition menu.h:31
constexpr qreal verticalViewportMargin() const
Minimum vertical distance from a menu to the viewport edge.
Definition menu.h:351
constexpr ShapeValue verticalFirstGroupShape() const
Shape of the first surface in a grouped Expressive vertical menu.
Definition menu.h:185
qreal pressedStateLayerOpacity
Definition menu.h:43
qreal verticalIconSize
Definition menu.h:76
qreal iconSize
Definition menu.h:39
Fluid::ShapeValue verticalSelectedItemShape
Definition menu.h:58
qreal verticalSectionLabelLeadingSpace
Definition menu.h:68
constexpr ShapeValue containerShape() const
Corner radius of the menu surface.
Definition menu.h:89
constexpr qreal focusStateLayerOpacity() const
Opacity of the keyboard-focus state layer.
Definition menu.h:155
qreal focusStateLayerOpacity
Definition menu.h:42
qreal verticalGroupContentPadding
Definition menu.h:63
constexpr ShapeValue verticalOnlyGroupShape() const
Shape of the only surface in an Expressive vertical menu.
Definition menu.h:205
constexpr qreal closedScale() const
Scale at which an Expressive menu starts and ends its motion.
Definition menu.h:339
constexpr qreal verticalItemHeight() const
Height of an Expressive vertical menu item.
Definition menu.h:255
constexpr ShapeValue verticalGroupShape() const
Shape of a group within an Expressive vertical menu.
Definition menu.h:179
constexpr ShapeValue verticalFirstItemShape() const
Shape of the first item in a group.
Definition menu.h:223
constexpr qreal verticalDividerInset() const
Horizontal inset of a divider within an Expressive menu group.
Definition menu.h:279
constexpr qreal verticalSectionLabelLeadingSpace() const
Logical leading padding of an Expressive menu section label.
Definition menu.h:291
Fluid::ShapeValue verticalInactiveItemShape
Definition menu.h:60
qreal verticalItemBetweenSpace
Definition menu.h:75
qreal itemHeight
Definition menu.h:37
constexpr qreal hoverStateLayerOpacity() const
Opacity of the hover state layer.
Definition menu.h:149
constexpr qreal verticalSectionLabelHeight() const
Minimum height of an Expressive menu section label.
Definition menu.h:285
qreal viewportMargin
Definition menu.h:34
qreal verticalViewportMargin
Definition menu.h:79
constexpr qreal maximumWidth() const
Preferred maximum menu width.
Definition menu.h:119
qreal verticalItemHeight
Definition menu.h:61
constexpr qreal disabledContentOpacity() const
Opacity of disabled menu-item content.
Definition menu.h:167
constexpr qreal bottomPadding() const
Space below the last menu item.
Definition menu.h:101
constexpr qreal verticalItemBottomPadding() const
Bottom content padding of an Expressive menu item.
Definition menu.h:309
constexpr ShapeValue verticalContainerShape() const
Shape of an Expressive vertical menu surface.
Definition menu.h:173
qreal disabledContentOpacity
Definition menu.h:44
constexpr ShapeValue verticalLastItemShape() const
Shape of the last item in a group.
Definition menu.h:236
qreal verticalItemTrailingSpace
Definition menu.h:74
qreal iconLabelGap
Definition menu.h:40
Fluid::ShapeValue verticalOnlyItemShape
Definition menu.h:52
constexpr qreal verticalItemTrailingSpace() const
Logical trailing content space of an Expressive menu item.
Definition menu.h:321
constexpr ShapeValue verticalSelectedItemShape() const
Shape of a selected Expressive menu item.
Definition menu.h:243
constexpr qreal verticalGroupPadding() const
Padding between an Expressive menu surface and its item groups.
Definition menu.h:261
constexpr ShapeValue verticalMiddleGroupShape() const
Shape of a middle surface in a grouped Expressive vertical menu.
Definition menu.h:192
Fluid::ShapeValue verticalOnlyGroupShape
Definition menu.h:50
constexpr qreal minimumWidth() const
Preferred minimum menu width.
Definition menu.h:113
qreal minimumWidth
Definition menu.h:35
constexpr ShapeValue verticalInactiveItemShape() const
Shape used for an inactive Expressive menu item group.
Definition menu.h:249
qreal closedScale
Definition menu.h:77
qreal horizontalViewportMargin
Definition menu.h:78
qreal topPadding
Definition menu.h:32
Fluid::ShapeValue verticalGroupShape
Definition menu.h:46
qreal maximumWidth
Definition menu.h:36
Fluid::ShapeValue verticalLastGroupShape
Definition menu.h:49
qreal bottomPadding
Definition menu.h:33
Fluid::ShapeValue verticalItemShape
Definition menu.h:51
qreal verticalItemBottomPadding
Definition menu.h:72
constexpr qreal verticalItemLeadingSpace() const
Logical leading content space of an Expressive menu item.
Definition menu.h:315
constexpr qreal verticalGroupContentPadding() const
Vertical content padding inside an Expressive menu group surface.
Definition menu.h:267
constexpr qreal topPadding() const
Space above the first menu item.
Definition menu.h:95
constexpr ShapeValue verticalLastGroupShape() const
Shape of the last surface in a grouped Expressive vertical menu.
Definition menu.h:198
qreal verticalDividerInset
Definition menu.h:65
constexpr qreal verticalSectionLabelTrailingSpace() const
Logical trailing padding of an Expressive menu section label.
Definition menu.h:297
constexpr qreal iconSize() const
Size of leading, selection, and cascading-menu icons.
Definition menu.h:137
constexpr qreal verticalItemBetweenSpace() const
Space between content elements in an Expressive menu item.
Definition menu.h:327
constexpr qreal itemHorizontalPadding() const
Logical leading and trailing padding of a menu item.
Definition menu.h:131
qreal itemHorizontalPadding
Definition menu.h:38
constexpr ShapeValue verticalOnlyItemShape() const
Shape of an item that is the only member of a group.
Definition menu.h:217
constexpr qreal verticalIconSize() const
Size of icons in an Expressive menu item.
Definition menu.h:333
Fluid::ShapeValue verticalFirstItemShape
Definition menu.h:53
qreal verticalGroupPadding
Definition menu.h:62
qreal verticalSegmentedGap
Definition menu.h:64
constexpr qreal viewportMargin() const
Minimum distance maintained between a menu and a viewport edge.
Definition menu.h:107
qreal verticalSectionLabelHeight
Definition menu.h:66
Fluid::ShapeValue verticalFirstGroupShape
Definition menu.h:47
constexpr ShapeValue verticalMiddleItemShape() const
Shape of a middle item in a group.
Definition menu.h:230
constexpr qreal horizontalViewportMargin() const
Minimum horizontal distance from a menu to the viewport edge.
Definition menu.h:345
constexpr qreal verticalSegmentedGap() const
Gap between adjacent surfaces in an Expressive grouped menu.
Definition menu.h:273
Fluid::ShapeValue verticalMiddleGroupShape
Definition menu.h:48
constexpr qreal itemHeight() const
Height of a one-line menu item.
Definition menu.h:125
constexpr qreal verticalItemTopPadding() const
Top content padding of an Expressive menu item.
Definition menu.h:303
constexpr qreal iconLabelGap() const
Space between adjacent menu-item content elements.
Definition menu.h:143
constexpr ShapeValue verticalItemShape() const
Base shape of an Expressive vertical menu item.
Definition menu.h:211
qreal verticalItemTopPadding
Definition menu.h:71
Fluid::ShapeValue verticalMiddleItemShape
Definition menu.h:55
qreal verticalItemLeadingSpace
Definition menu.h:73
Material Design 3 system shape tokens.
Definition shapetokens.h:48
Fluid::ShapeValue cornerLarge
Definition shapetokens.h:60
Fluid::ShapeValue cornerSmall
Definition shapetokens.h:67
qreal cornerValueExtraSmall
Definition shapetokens.h:72
Fluid::ShapeValue cornerExtraSmall
Definition shapetokens.h:57
Fluid::ShapeValue cornerMedium
Definition shapetokens.h:65
Material Design 3 system state tokens.
Definition statetokens.h:18
qreal focusStateLayerOpacity
Definition statetokens.h:23
qreal hoverStateLayerOpacity
Definition statetokens.h:24
qreal pressedStateLayerOpacity
Definition statetokens.h:25