diff options
author | Mitch Curtis <mitch.curtis@qt.io> | 2018-02-12 10:20:06 +0100 |
---|---|---|
committer | Mitch Curtis <mitch.curtis@qt.io> | 2018-02-19 15:48:03 +0000 |
commit | 55fa922b4f9350c320a4a949b70498269f0aaf79 (patch) | |
tree | aef0292380fc40dd639cfea93d1ad503bf2bb122 /tests/auto/qquickmaterialstyleconf | |
parent | a57754609cec57d1298bbcd1206fb0f114c7610e (diff) |
Add Dense Material style variant for desktop
The current Material style is based on the mobile variant of the
design, which is far too large for desktop applications.
From https://material.io/guidelines/components/lists.html#lists-usage:
"When the mouse and keyboard are the primary input methods,
measurements may be condensed to accommodate denser layouts."
This patch adds a dense variant of the style where most controls like
buttons and delegates are smaller in height and use smaller font sizes.
Note that the Material design guidelines seem to distinguish between
mobile, desktop and dense measurements, where "dense" seems to be a
specialization of desktop. We cannot afford to/do not see sense in
maintaining three separate variants, so the dense variant will be the
only desktop version of the Material style.
[ChangeLog][Material] Added Dense variant of the Material style for use
on desktop platforms. Some controls are slightly smaller in height and
use smaller font sizes. The variant can be enabled by setting
QT_QUICK_CONTROLS_MATERIAL_VARIANT to Dense or setting Variant=Dense
in the qtquickcontrols.conf file.
Task-number: QTBUG-51109
Change-Id: I11846b7f6e61f7b5dcf3c146b18c220234a73ef2
Reviewed-by: J-P Nurmi <jpnurmi@qt.io>
Diffstat (limited to 'tests/auto/qquickmaterialstyleconf')
5 files changed, 65 insertions, 4 deletions
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 |