aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--src/imports/controls/doc/src/includes/qquickmaterialstyle.qdocinc16
-rw-r--r--src/imports/controls/material/BusyIndicator.qml4
-rw-r--r--src/imports/controls/material/Button.qml2
-rw-r--r--src/imports/controls/material/CheckDelegate.qml2
-rw-r--r--src/imports/controls/material/ComboBox.qml2
-rw-r--r--src/imports/controls/material/DelayButton.qml2
-rw-r--r--src/imports/controls/material/DialogButtonBox.qml4
-rw-r--r--src/imports/controls/material/Frame.qml2
-rw-r--r--src/imports/controls/material/GroupBox.qml3
-rw-r--r--src/imports/controls/material/ItemDelegate.qml4
-rw-r--r--src/imports/controls/material/Menu.qml2
-rw-r--r--src/imports/controls/material/MenuItem.qml6
-rw-r--r--src/imports/controls/material/RadioDelegate.qml2
-rw-r--r--src/imports/controls/material/RoundButton.qml4
-rw-r--r--src/imports/controls/material/SpinBox.qml10
-rw-r--r--src/imports/controls/material/SwipeDelegate.qml2
-rw-r--r--src/imports/controls/material/SwitchDelegate.qml6
-rw-r--r--src/imports/controls/material/TabButton.qml2
-rw-r--r--src/imports/controls/material/ToolButton.qml4
-rw-r--r--src/imports/controls/material/ToolTip.qml2
-rw-r--r--src/imports/controls/material/qquickmaterialstyle.cpp89
-rw-r--r--src/imports/controls/material/qquickmaterialstyle_p.h28
-rw-r--r--src/imports/controls/material/qquickmaterialtheme.cpp19
-rw-r--r--src/quickcontrols2/qquickstyle.cpp1
-rw-r--r--tests/auto/qquickmaterialstyleconf/data/applicationwindow.qml5
-rw-r--r--tests/auto/qquickmaterialstyleconf/qquickmaterialstyleconf.qrc10
-rw-r--r--tests/auto/qquickmaterialstyleconf/tst_qquickmaterialstyleconf.cpp42
-rw-r--r--tests/auto/qquickmaterialstyleconf/variant-dense.conf6
-rw-r--r--tests/auto/qquickmaterialstyleconf/variant-normal.conf6
29 files changed, 234 insertions, 53 deletions
diff --git a/src/imports/controls/doc/src/includes/qquickmaterialstyle.qdocinc b/src/imports/controls/doc/src/includes/qquickmaterialstyle.qdocinc
index c5d94279..72c97bb6 100644
--- a/src/imports/controls/doc/src/includes/qquickmaterialstyle.qdocinc
+++ b/src/imports/controls/doc/src/includes/qquickmaterialstyle.qdocinc
@@ -8,6 +8,14 @@
\li Specifies the default \l {material-theme-attached-prop}{Material theme}.
The value can be one of the available themes, for example \c "Dark".
\row
+ \li \c Variant
+ \li Specifies the Material variant. The Material Design has two
+ variants: a normal variant designed for touch devices, and a dense
+ variant for desktop. The dense variant uses smaller sizes for
+ controls and their fonts.
+
+ The value can be \c "Normal" or \c "Dense".
+ \row
\li \c Accent
\li Specifies the default \l {material-accent-attached-prop}{Material accent color}.
The value can be any \l {colorbasictypedocs}{color}, but it is recommended to use
@@ -40,6 +48,14 @@
\li Specifies the default \l {material-theme-attached-prop}{Material theme}.
The value can be one of the available themes, for example \c "Dark".
\row
+ \li \c QT_QUICK_CONTROLS_MATERIAL_VARIANT
+ \li Specifies the Material variant. The Material Design has two
+ variants: a normal variant designed for touch devices, and a dense
+ variant for desktop. The dense variant uses smaller sizes for
+ controls and their fonts.
+
+ The value can be \c "Normal" or \c "Dense".
+ \row
\li \c QT_QUICK_CONTROLS_MATERIAL_ACCENT
\li Specifies the default \l {material-accent-attached-prop}{Material accent color}.
The value can be any \l {colorbasictypedocs}{color}, but it is recommended to use
diff --git a/src/imports/controls/material/BusyIndicator.qml b/src/imports/controls/material/BusyIndicator.qml
index 5e53bdb9..41e5d25f 100644
--- a/src/imports/controls/material/BusyIndicator.qml
+++ b/src/imports/controls/material/BusyIndicator.qml
@@ -48,8 +48,8 @@ T.BusyIndicator {
padding: 6
contentItem: BusyIndicatorImpl {
- implicitWidth: 48
- implicitHeight: 48
+ implicitWidth: control.Material.buttonHeight
+ implicitHeight: control.Material.buttonHeight
color: control.Material.accentColor
running: control.running
diff --git a/src/imports/controls/material/Button.qml b/src/imports/controls/material/Button.qml
index 6401b2ad..7ed2aa2c 100644
--- a/src/imports/controls/material/Button.qml
+++ b/src/imports/controls/material/Button.qml
@@ -82,7 +82,7 @@ T.Button {
// TODO: Add a proper ripple/ink effect for mouse/touch input and focus state
background: Rectangle {
implicitWidth: 64
- implicitHeight: 48
+ implicitHeight: control.Material.buttonHeight
// external vertical padding is 6 (to increase touch area)
y: 6
diff --git a/src/imports/controls/material/CheckDelegate.qml b/src/imports/controls/material/CheckDelegate.qml
index 1d3ff61d..f6c687d3 100644
--- a/src/imports/controls/material/CheckDelegate.qml
+++ b/src/imports/controls/material/CheckDelegate.qml
@@ -82,7 +82,7 @@ T.CheckDelegate {
}
background: Rectangle {
- implicitHeight: 48
+ implicitHeight: control.Material.delegateHeight
color: control.highlighted ? control.Material.listHighlightColor : "transparent"
diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml
index 3dd3cf30..7ecf5d1a 100644
--- a/src/imports/controls/material/ComboBox.qml
+++ b/src/imports/controls/material/ComboBox.qml
@@ -99,7 +99,7 @@ T.ComboBox {
background: Rectangle {
implicitWidth: 120
- implicitHeight: 48
+ implicitHeight: control.Material.buttonHeight
// external vertical padding is 6 (to increase touch area)
y: 6
diff --git a/src/imports/controls/material/DelayButton.qml b/src/imports/controls/material/DelayButton.qml
index 4043949c..43d09ef5 100644
--- a/src/imports/controls/material/DelayButton.qml
+++ b/src/imports/controls/material/DelayButton.qml
@@ -75,7 +75,7 @@ T.DelayButton {
// TODO: Add a proper ripple/ink effect for mouse/touch input and focus state
background: Rectangle {
implicitWidth: 64
- implicitHeight: 48
+ implicitHeight: control.Material.buttonHeight
// external vertical padding is 6 (to increase touch area)
y: 6
diff --git a/src/imports/controls/material/DialogButtonBox.qml b/src/imports/controls/material/DialogButtonBox.qml
index 628e85f7..c3bea49f 100644
--- a/src/imports/controls/material/DialogButtonBox.qml
+++ b/src/imports/controls/material/DialogButtonBox.qml
@@ -62,7 +62,7 @@ T.DialogButtonBox {
contentItem: ListView {
implicitWidth: contentWidth
- implicitHeight: 48
+ implicitHeight: control.Material.buttonHeight
model: control.contentModel
spacing: control.spacing
@@ -72,7 +72,7 @@ T.DialogButtonBox {
}
background: PaddedRectangle {
- implicitHeight: 52
+ implicitHeight: control.Material.dialogButtonBoxHeight
radius: 2
color: control.Material.dialogColor
// Rounded corners should be only at the top or at the bottom
diff --git a/src/imports/controls/material/Frame.qml b/src/imports/controls/material/Frame.qml
index 51721c2c..46f5c13e 100644
--- a/src/imports/controls/material/Frame.qml
+++ b/src/imports/controls/material/Frame.qml
@@ -49,6 +49,8 @@ T.Frame {
contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0)
padding: 12
+ topPadding: Material.frameVerticalPadding
+ bottomPadding: Material.frameVerticalPadding
background: Rectangle {
radius: 2
diff --git a/src/imports/controls/material/GroupBox.qml b/src/imports/controls/material/GroupBox.qml
index 7ac30ec6..e99deffd 100644
--- a/src/imports/controls/material/GroupBox.qml
+++ b/src/imports/controls/material/GroupBox.qml
@@ -52,7 +52,8 @@ T.GroupBox {
spacing: 6
padding: 12
- topPadding: padding + (label && label.implicitWidth > 0 ? label.implicitHeight + spacing : 0)
+ topPadding: Material.frameVerticalPadding + (label && label.implicitWidth > 0 ? label.implicitHeight + spacing : 0)
+ bottomPadding: Material.frameVerticalPadding
label: Text {
x: control.leftPadding
diff --git a/src/imports/controls/material/ItemDelegate.qml b/src/imports/controls/material/ItemDelegate.qml
index 0efb3b93..0793dddd 100644
--- a/src/imports/controls/material/ItemDelegate.qml
+++ b/src/imports/controls/material/ItemDelegate.qml
@@ -51,7 +51,7 @@ T.ItemDelegate {
indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding)
baselineOffset: contentItem.y + contentItem.baselineOffset
- padding: 16
+ padding: control.Material.itemDelegateVerticalPadding
spacing: 16
icon.width: 24
@@ -71,7 +71,7 @@ T.ItemDelegate {
}
background: Rectangle {
- implicitHeight: 48
+ implicitHeight: control.Material.delegateHeight
color: control.highlighted ? control.Material.listHighlightColor : "transparent"
diff --git a/src/imports/controls/material/Menu.qml b/src/imports/controls/material/Menu.qml
index 0f40380c..c91d450e 100644
--- a/src/imports/controls/material/Menu.qml
+++ b/src/imports/controls/material/Menu.qml
@@ -84,7 +84,7 @@ T.Menu {
background: Rectangle {
implicitWidth: 200
- implicitHeight: 48
+ implicitHeight: control.Material.menuItemHeight
radius: 3
color: control.Material.dialogColor
diff --git a/src/imports/controls/material/MenuItem.qml b/src/imports/controls/material/MenuItem.qml
index 13d4694c..9ef530b7 100644
--- a/src/imports/controls/material/MenuItem.qml
+++ b/src/imports/controls/material/MenuItem.qml
@@ -52,8 +52,8 @@ T.MenuItem {
baselineOffset: contentItem.y + contentItem.baselineOffset
padding: 16
- topPadding: 12
- bottomPadding: 12
+ topPadding: Material.menuItemVerticalPadding
+ bottomPadding: Material.menuItemVerticalPadding
spacing: 16
icon.width: 24
@@ -96,7 +96,7 @@ T.MenuItem {
background: Rectangle {
implicitWidth: 200
- implicitHeight: 48
+ implicitHeight: control.Material.menuItemHeight
color: control.highlighted ? control.Material.listHighlightColor : "transparent"
Ripple {
diff --git a/src/imports/controls/material/RadioDelegate.qml b/src/imports/controls/material/RadioDelegate.qml
index d498ee80..f97a86e9 100644
--- a/src/imports/controls/material/RadioDelegate.qml
+++ b/src/imports/controls/material/RadioDelegate.qml
@@ -82,7 +82,7 @@ T.RadioDelegate {
}
background: Rectangle {
- implicitHeight: 48
+ implicitHeight: control.Material.delegateHeight
color: control.highlighted ? control.Material.listHighlightColor : "transparent"
diff --git a/src/imports/controls/material/RoundButton.qml b/src/imports/controls/material/RoundButton.qml
index 92e6bc84..b900e4d1 100644
--- a/src/imports/controls/material/RoundButton.qml
+++ b/src/imports/controls/material/RoundButton.qml
@@ -79,8 +79,8 @@ T.RoundButton {
// TODO: Add a proper ripple/ink effect for mouse/touch input and focus state
background: Rectangle {
- implicitWidth: 48
- implicitHeight: 48
+ implicitWidth: control.Material.buttonHeight
+ implicitHeight: control.Material.buttonHeight
// external vertical padding is 6 (to increase touch area)
x: 6
diff --git a/src/imports/controls/material/SpinBox.qml b/src/imports/controls/material/SpinBox.qml
index cf9196ac..5ac617ba 100644
--- a/src/imports/controls/material/SpinBox.qml
+++ b/src/imports/controls/material/SpinBox.qml
@@ -83,8 +83,8 @@ T.SpinBox {
up.indicator: Item {
x: control.mirrored ? 0 : parent.width - width
- implicitWidth: 48
- implicitHeight: 48
+ implicitWidth: control.Material.buttonHeight
+ implicitHeight: control.Material.buttonHeight
height: parent.height
width: height
@@ -117,8 +117,8 @@ T.SpinBox {
down.indicator: Item {
x: control.mirrored ? parent.width - width : 0
- implicitWidth: 48
- implicitHeight: 48
+ implicitWidth: control.Material.buttonHeight
+ implicitHeight: control.Material.buttonHeight
height: parent.height
width: height
@@ -144,7 +144,7 @@ T.SpinBox {
background: Item {
implicitWidth: 192
- implicitHeight: 48
+ implicitHeight: control.Material.buttonHeight
Rectangle {
x: parent.width / 2 - width / 2
diff --git a/src/imports/controls/material/SwipeDelegate.qml b/src/imports/controls/material/SwipeDelegate.qml
index 1095ac68..2ffa8797 100644
--- a/src/imports/controls/material/SwipeDelegate.qml
+++ b/src/imports/controls/material/SwipeDelegate.qml
@@ -75,7 +75,7 @@ T.SwipeDelegate {
}
background: Rectangle {
- implicitHeight: 48
+ implicitHeight: control.Material.delegateHeight
color: control.Material.backgroundColor
diff --git a/src/imports/controls/material/SwitchDelegate.qml b/src/imports/controls/material/SwitchDelegate.qml
index 308e9772..f3969a5f 100644
--- a/src/imports/controls/material/SwitchDelegate.qml
+++ b/src/imports/controls/material/SwitchDelegate.qml
@@ -52,8 +52,8 @@ T.SwitchDelegate {
baselineOffset: contentItem.y + contentItem.baselineOffset
padding: 16
- topPadding: 8
- bottomPadding: 8
+ topPadding: Material.switchDelegateVerticalPadding
+ bottomPadding: Material.switchDelegateVerticalPadding
spacing: 16
icon.width: 24
@@ -82,7 +82,7 @@ T.SwitchDelegate {
}
background: Rectangle {
- implicitHeight: 48
+ implicitHeight: control.Material.delegateHeight
color: control.highlighted ? control.Material.listHighlightColor : "transparent"
diff --git a/src/imports/controls/material/TabButton.qml b/src/imports/controls/material/TabButton.qml
index 3134cca9..10da9a5f 100644
--- a/src/imports/controls/material/TabButton.qml
+++ b/src/imports/controls/material/TabButton.qml
@@ -69,7 +69,7 @@ T.TabButton {
}
background: Ripple {
- implicitHeight: 48
+ implicitHeight: control.Material.buttonHeight
clip: true
pressed: control.pressed
diff --git a/src/imports/controls/material/ToolButton.qml b/src/imports/controls/material/ToolButton.qml
index 86a9f5c0..a1c47f2a 100644
--- a/src/imports/controls/material/ToolButton.qml
+++ b/src/imports/controls/material/ToolButton.qml
@@ -70,8 +70,8 @@ T.ToolButton {
}
background: Ripple {
- implicitWidth: 48
- implicitHeight: 48
+ implicitWidth: control.Material.buttonHeight
+ implicitHeight: control.Material.buttonHeight
readonly property bool square: control.contentItem.width <= control.contentItem.height
diff --git a/src/imports/controls/material/ToolTip.qml b/src/imports/controls/material/ToolTip.qml
index 0d690f59..1f786a3f 100644
--- a/src/imports/controls/material/ToolTip.qml
+++ b/src/imports/controls/material/ToolTip.qml
@@ -76,7 +76,7 @@ T.ToolTip {
}
background: Rectangle {
- implicitHeight: 32
+ implicitHeight: control.Material.tooltipHeight
color: control.Material.tooltipColor
opacity: 0.9
radius: 2
diff --git a/src/imports/controls/material/qquickmaterialstyle.cpp b/src/imports/controls/material/qquickmaterialstyle.cpp
index 313ceca2..9aad1199 100644
--- a/src/imports/controls/material/qquickmaterialstyle.cpp
+++ b/src/imports/controls/material/qquickmaterialstyle.cpp
@@ -387,6 +387,10 @@ static bool globalPrimaryCustom = false;
static bool globalAccentCustom = false;
static bool globalForegroundCustom = true;
static bool globalBackgroundCustom = true;
+// This is global because:
+// 1) The theme needs access to it to determine font sizes.
+// 2) There can only be one variant used for the whole application.
+static QQuickMaterialStyle::Variant globalVariant = QQuickMaterialStyle::Normal;
static const QRgb backgroundColorLight = 0xFFFAFAFA;
static const QRgb backgroundColorDark = 0xFF303030;
@@ -445,7 +449,7 @@ QQuickMaterialStyle::QQuickMaterialStyle(QObject *parent) : QQuickAttachedObject
m_background(globalBackground),
m_elevation(0)
{
- init();
+ QQuickAttachedObject::init();
}
QQuickMaterialStyle *QQuickMaterialStyle::qmlAttachedProperties(QObject *object)
@@ -1135,17 +1139,60 @@ QColor QQuickMaterialStyle::shade(const QColor &color, Shade shade) const
}
}
-void QQuickMaterialStyle::attachedParentChange(QQuickAttachedObject *newParent, QQuickAttachedObject *oldParent)
+int QQuickMaterialStyle::buttonHeight() const
{
- Q_UNUSED(oldParent);
- QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(newParent);
- if (material) {
- inheritPrimary(material->m_primary, material->m_customPrimary);
- inheritAccent(material->m_accent, material->m_customAccent);
- inheritForeground(material->m_foreground, material->m_customForeground, material->m_hasForeground);
- inheritBackground(material->m_background, material->m_customBackground, material->m_hasBackground);
- inheritTheme(material->theme());
- }
+ // https://material.io/guidelines/components/buttons.html#buttons-style
+ return globalVariant == Dense ? 44 : 48;
+}
+
+int QQuickMaterialStyle::delegateHeight() const
+{
+ // https://material.io/guidelines/components/lists.html#lists-specs
+ return globalVariant == Dense ? 40 : 48;
+}
+
+int QQuickMaterialStyle::dialogButtonBoxHeight() const
+{
+ return globalVariant == Dense ? 48 : 52;
+}
+
+int QQuickMaterialStyle::frameVerticalPadding() const
+{
+ return globalVariant == Dense ? 8 : 12;
+}
+
+int QQuickMaterialStyle::itemDelegateVerticalPadding() const
+{
+ return globalVariant == Dense ? 12 : 16;
+}
+
+int QQuickMaterialStyle::menuItemHeight() const
+{
+ // https://material.io/guidelines/components/menus.html#menus-simple-menus
+ return globalVariant == Dense ? 32 : 48;
+}
+
+int QQuickMaterialStyle::menuItemVerticalPadding() const
+{
+ return globalVariant == Dense ? 8 : 12;
+}
+
+int QQuickMaterialStyle::switchDelegateVerticalPadding() const
+{
+ // SwitchDelegate's indicator is much larger than the others due to the shadow,
+ // so we must reduce its padding to ensure its implicitHeight is 40 when dense.
+ return globalVariant == Dense ? 4 : 8;
+}
+
+int QQuickMaterialStyle::tooltipHeight() const
+{
+ // https://material.io/guidelines/components/tooltips.html
+ return globalVariant == Dense ? 22 : 32;
+}
+
+QQuickMaterialStyle::Variant QQuickMaterialStyle::variant()
+{
+ return globalVariant;
}
template <typename Enum>
@@ -1177,6 +1224,13 @@ void QQuickMaterialStyle::initGlobals()
else if (!themeValue.isEmpty())
qWarning().nospace().noquote() << "Material: unknown theme value: " << themeValue;
+ QByteArray variantValue = resolveSetting("QT_QUICK_CONTROLS_MATERIAL_VARIANT", settings, QStringLiteral("Variant"));
+ Variant variantEnum = toEnumValue<Variant>(variantValue, &ok);
+ if (ok)
+ globalVariant = variantEnum;
+ else if (!variantValue.isEmpty())
+ qWarning().nospace().noquote() << "Material: unknown variant value: " << variantValue;
+
QByteArray primaryValue = resolveSetting("QT_QUICK_CONTROLS_MATERIAL_PRIMARY", settings, QStringLiteral("Primary"));
Color primaryEnum = toEnumValue<Color>(primaryValue, &ok);
if (ok) {
@@ -1242,6 +1296,19 @@ void QQuickMaterialStyle::initGlobals()
}
}
+void QQuickMaterialStyle::attachedParentChange(QQuickAttachedObject *newParent, QQuickAttachedObject *oldParent)
+{
+ Q_UNUSED(oldParent);
+ QQuickMaterialStyle *material = qobject_cast<QQuickMaterialStyle *>(newParent);
+ if (material) {
+ inheritPrimary(material->m_primary, material->m_customPrimary);
+ inheritAccent(material->m_accent, material->m_customAccent);
+ inheritForeground(material->m_foreground, material->m_customForeground, material->m_hasForeground);
+ inheritBackground(material->m_background, material->m_customBackground, material->m_hasBackground);
+ inheritTheme(material->theme());
+ }
+}
+
bool QQuickMaterialStyle::variantToRgba(const QVariant &var, const char *name, QRgb *rgba, bool *custom) const
{
*custom = false;
diff --git a/src/imports/controls/material/qquickmaterialstyle_p.h b/src/imports/controls/material/qquickmaterialstyle_p.h
index 4b63747c..37baa450 100644
--- a/src/imports/controls/material/qquickmaterialstyle_p.h
+++ b/src/imports/controls/material/qquickmaterialstyle_p.h
@@ -98,6 +98,16 @@ class QQuickMaterialStyle : public QQuickAttachedObject
Q_PROPERTY(QColor toolTextColor READ toolTextColor NOTIFY paletteChanged FINAL)
Q_PROPERTY(QColor spinBoxDisabledIconColor READ spinBoxDisabledIconColor NOTIFY paletteChanged FINAL)
+ Q_PROPERTY(int buttonHeight READ buttonHeight CONSTANT FINAL)
+ Q_PROPERTY(int delegateHeight READ delegateHeight CONSTANT FINAL)
+ Q_PROPERTY(int dialogButtonBoxHeight READ dialogButtonBoxHeight CONSTANT FINAL)
+ Q_PROPERTY(int frameVerticalPadding READ frameVerticalPadding CONSTANT FINAL)
+ Q_PROPERTY(int itemDelegateVerticalPadding READ itemDelegateVerticalPadding CONSTANT FINAL)
+ Q_PROPERTY(int menuItemHeight READ menuItemHeight CONSTANT FINAL)
+ Q_PROPERTY(int menuItemVerticalPadding READ menuItemVerticalPadding CONSTANT FINAL)
+ Q_PROPERTY(int switchDelegateVerticalPadding READ switchDelegateVerticalPadding CONSTANT FINAL)
+ Q_PROPERTY(int tooltipHeight READ tooltipHeight CONSTANT FINAL)
+
public:
enum Theme {
Light,
@@ -105,6 +115,11 @@ public:
System
};
+ enum Variant {
+ Normal,
+ Dense
+ };
+
enum Color {
Red,
Pink,
@@ -145,6 +160,7 @@ public:
};
Q_ENUM(Theme)
+ Q_ENUM(Variant)
Q_ENUM(Color)
Q_ENUM(Shade)
@@ -225,8 +241,20 @@ public:
Q_INVOKABLE QColor color(Color color, Shade shade = Shade500) const;
Q_INVOKABLE QColor shade(const QColor &color, Shade shade) const;
+ int buttonHeight() const;
+ int delegateHeight() const;
+ int dialogButtonBoxHeight() const;
+ int frameVerticalPadding() const;
+ int itemDelegateVerticalPadding() const;
+ int menuItemHeight() const;
+ int menuItemVerticalPadding() const;
+ int switchDelegateVerticalPadding() const;
+ int tooltipHeight() const;
+
static void initGlobals();
+ static Variant variant();
+
Q_SIGNALS:
void themeChanged();
void primaryChanged();
diff --git a/src/imports/controls/material/qquickmaterialtheme.cpp b/src/imports/controls/material/qquickmaterialtheme.cpp
index 0c30ae8f..471f5143 100644
--- a/src/imports/controls/material/qquickmaterialtheme.cpp
+++ b/src/imports/controls/material/qquickmaterialtheme.cpp
@@ -35,6 +35,7 @@
****************************************************************************/
#include "qquickmaterialtheme_p.h"
+#include "qquickmaterialstyle_p.h"
#include <QtGui/qpa/qplatformdialoghelper.h>
#include <QtGui/qfont.h>
@@ -67,29 +68,33 @@ void QQuickMaterialTheme::resolveFonts(const QFont &defaultFont)
editorFont.setFamily(family);
}
- systemFont.setPixelSize(14);
+ const bool dense = QQuickMaterialStyle::variant() == QQuickMaterialStyle::Dense;
+ systemFont.setPixelSize(dense ? 13 : 14);
systemFont = defaultFont.resolve(systemFont);
- buttonFont.setPixelSize(14);
+ // https://material.io/guidelines/components/buttons.html#buttons-style
+ buttonFont.setPixelSize(dense ? 13 : 14);
buttonFont.setCapitalization(QFont::AllUppercase);
buttonFont.setWeight(QFont::Medium);
buttonFont = defaultFont.resolve(buttonFont);
- toolTipFont.setPixelSize(14);
+ // https://material.io/guidelines/components/tooltips.html
+ toolTipFont.setPixelSize(dense ? 10 : 14);
toolTipFont.setWeight(QFont::Medium);
toolTipFont = defaultFont.resolve(toolTipFont);
- itemViewFont.setPixelSize(14);
+ itemViewFont.setPixelSize(dense ? 13 : 14);
itemViewFont.setWeight(QFont::Medium);
itemViewFont = defaultFont.resolve(itemViewFont);
- listViewFont.setPixelSize(16);
+ // https://material.io/guidelines/components/lists.html#lists-specs
+ listViewFont.setPixelSize(dense ? 13 : 16);
listViewFont = defaultFont.resolve(listViewFont);
- menuItemFont.setPixelSize(16);
+ menuItemFont.setPixelSize(dense ? 13 : 16);
menuItemFont = defaultFont.resolve(menuItemFont);
- editorFont.setPixelSize(16);
+ editorFont.setPixelSize(dense ? 13 : 16);
editorFont = defaultFont.resolve(editorFont);
}
diff --git a/src/quickcontrols2/qquickstyle.cpp b/src/quickcontrols2/qquickstyle.cpp
index 800341d7..daa48144 100644
--- a/src/quickcontrols2/qquickstyle.cpp
+++ b/src/quickcontrols2/qquickstyle.cpp
@@ -233,6 +233,7 @@ struct QQuickStyleSpec
style.clear();
fallbackStyle.clear();
fallbackMethod.clear();
+ configFilePath.clear();
}
QString resolveConfigFilePath()
diff --git a/tests/auto/qquickmaterialstyleconf/data/applicationwindow.qml b/tests/auto/qquickmaterialstyleconf/data/applicationwindow.qml
index 65196393..9a31966f 100644
--- a/tests/auto/qquickmaterialstyleconf/data/applicationwindow.qml
+++ b/tests/auto/qquickmaterialstyleconf/data/applicationwindow.qml
@@ -57,8 +57,13 @@ ApplicationWindow {
height: 400
property alias label: label
+ property alias button: button
Label {
id: label
}
+
+ Button {
+ id: button
+ }
}
diff --git a/tests/auto/qquickmaterialstyleconf/qquickmaterialstyleconf.qrc b/tests/auto/qquickmaterialstyleconf/qquickmaterialstyleconf.qrc
index 53ba6450..49219139 100644
--- a/tests/auto/qquickmaterialstyleconf/qquickmaterialstyleconf.qrc
+++ b/tests/auto/qquickmaterialstyleconf/qquickmaterialstyleconf.qrc
@@ -1,5 +1,7 @@
-<!DOCTYPE RCC><RCC version="1.0">
-<qresource>
- <file>qtquickcontrols2.conf</file>
-</qresource>
+<RCC>
+ <qresource prefix="/">
+ <file>qtquickcontrols2.conf</file>
+ <file>variant-dense.conf</file>
+ <file>variant-normal.conf</file>
+ </qresource>
</RCC>
diff --git a/tests/auto/qquickmaterialstyleconf/tst_qquickmaterialstyleconf.cpp b/tests/auto/qquickmaterialstyleconf/tst_qquickmaterialstyleconf.cpp
index 17d1ea6d..72136445 100644
--- a/tests/auto/qquickmaterialstyleconf/tst_qquickmaterialstyleconf.cpp
+++ b/tests/auto/qquickmaterialstyleconf/tst_qquickmaterialstyleconf.cpp
@@ -36,6 +36,7 @@
#include <qtest.h>
#include <QtQuick/private/qquickitem_p.h>
+#include <QtQuickControls2/private/qquickstyle_p.h>
#include "../shared/util.h"
#include "../shared/visualtestutil.h"
@@ -49,6 +50,8 @@ public:
private slots:
void conf();
+ void variants_data();
+ void variants();
};
void tst_qquickmaterialstyleconf::conf()
@@ -73,6 +76,45 @@ void tst_qquickmaterialstyleconf::conf()
QCOMPARE(label->property("font").value<QFont>(), customFont);
}
+void tst_qquickmaterialstyleconf::variants_data()
+{
+ QTest::addColumn<QByteArray>("confPath");
+ QTest::addColumn<int>("expectedButtonHeight");
+ // Just to ensure that the correct conf is loaded.
+ QTest::addColumn<QColor>("expectedColor");
+
+ // (36 button height + 12 touchable area)
+ QTest::newRow("normal") << QByteArray(":/variant-normal.conf") << 48 << QColor::fromRgb(0x123456);
+ // We specified a custom variant (dense), so the button should be small.
+ // (32 button height + 12 touchable area)
+ QTest::newRow("dense") << QByteArray(":/variant-dense.conf") << 44 << QColor::fromRgb(0x789abc);
+}
+
+void tst_qquickmaterialstyleconf::variants()
+{
+ QFETCH(QByteArray, confPath);
+ QFETCH(int, expectedButtonHeight);
+ QFETCH(QColor, expectedColor);
+
+ qmlClearTypeRegistrations();
+ QQuickStylePrivate::reset();
+ qputenv("QT_QUICK_CONTROLS_CONF", confPath);
+
+ QQuickApplicationHelper helper(this, QLatin1String("applicationwindow.qml"));
+
+ QQuickApplicationWindow *window = helper.appWindow;
+ window->show();
+ QVERIFY(QTest::qWaitForWindowExposed(window));
+
+ QQuickItem *label = window->property("label").value<QQuickItem*>();
+ QVERIFY(label);
+ QCOMPARE(label->property("color").value<QColor>(), expectedColor);
+
+ QQuickItem *button = window->property("button").value<QQuickItem*>();
+ QVERIFY(button);
+ QCOMPARE(button->height(), expectedButtonHeight);
+}
+
QTEST_MAIN(tst_qquickmaterialstyleconf)
#include "tst_qquickmaterialstyleconf.moc"
diff --git a/tests/auto/qquickmaterialstyleconf/variant-dense.conf b/tests/auto/qquickmaterialstyleconf/variant-dense.conf
new file mode 100644
index 00000000..6636894e
--- /dev/null
+++ b/tests/auto/qquickmaterialstyleconf/variant-dense.conf
@@ -0,0 +1,6 @@
+[Controls]
+Style=Material
+
+[Material]
+Variant=Dense
+Foreground=#789abc
diff --git a/tests/auto/qquickmaterialstyleconf/variant-normal.conf b/tests/auto/qquickmaterialstyleconf/variant-normal.conf
new file mode 100644
index 00000000..08778e92
--- /dev/null
+++ b/tests/auto/qquickmaterialstyleconf/variant-normal.conf
@@ -0,0 +1,6 @@
+[Controls]
+Style=Material
+
+[Material]
+Variant=Normal
+Foreground=#123456