QML custom style

Rick Walsh rickmwalsh at gmail.com
Tue Jul 18 13:10:26 PDT 2017


Dirk and Jocke (especially),
I can see you've done a lot over the past few weeks to make the mobile UI
much more attracted.  Have you considered using a custom Subsurface style
(falling back to Material) to make it more efficient to theme the QML
controls?  It would be easier to customize the controls in one place, and
have the change made consistently throughout, following the guidance in:
https://doc.qt.io/qt-5/qtquickcontrols2-customize.html#creating-a-custom-style

In the attached patch I have done that for the button controls (only used
on DownloadFromDiveComputer.qml) moving the styling into
SubsurfaceStyle/Button.qml, but it would not be hard to do it for the other
controls.  Using the Button as an example, we could then add code to make
the button depress and change colour when down, and only have to add the
code in one place.

The big problem now, is that the only way I've been able to use the custom
style is to select it from the command line (testing on desktop):
./subsurface-mobile -style
/home/rick/src/subsurface/mobile-widgets/qml/SubsurfaceStyle
Clearly that is useless for the mobile app.  I believe we should also be
able to use QQuickStyle::SetStyle to set it from within the app (see
https://doc.qt.io/qt-5/qquickstyle.html), but the following doesn't work
for me, either with or with setting the fallback style.  Maybe the problem
is that I'm using Qt5.7, but I'm not sure.

diff --git a/subsurface-mobile-helper.cpp b/subsurface-mobile-helper.cpp
index 68dd228b..cd1df6c6 100644
--- a/subsurface-mobile-helper.cpp
+++ b/subsurface-mobile-helper.cpp
@@ -14,6 +14,7 @@

 #include <QQuickWindow>
 #include <QScreen>
+#include <QQuickStyle>
 #include <QQmlApplicationEngine>
 #include <QQmlContext>
 #include <QSortFilterProxyModel>
@@ -43,6 +44,10 @@ void run_ui()
        qmlRegisterType<DownloadThread>("org.subsurfacedivelog.mobile", 1,
0, "DCDownloadThread");
        qmlRegisterType<DiveImportedModel>("org.subsurfacedivelog.mobile",
1, 0, "DCImportModel");

+       // set style for custom constrols
+       QQuickStyle::setStyle(":/SubsurfaceStyle");
+       QQuickStyle::setFallbackStyle("Material");
+
        QQmlApplicationEngine engine;
        KirigamiPlugin::getInstance().registerTypes();
 #if __APPLE__

Cheers,

Rick
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.subsurface-divelog.org/pipermail/subsurface/attachments/20170719/5ff97bbd/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: 0001-QML-Create-and-use-new-SubsurfaceStyle-for-button-co.patch
Type: text/x-patch
Size: 4316 bytes
Desc: not available
URL: <http://lists.subsurface-divelog.org/pipermail/subsurface/attachments/20170719/5ff97bbd/attachment.bin>


More information about the subsurface mailing list