how to get the tumbler to 'base style'

Question

I am creating a simple tumbler with QML. When I run the application, the tumbler is in the "Flat Style". How to I change it to the "Base Style" (the 3D Look)?

You can see the "3D Look" at this page: https://doc.qt.io/qt-5/qtquickcontrolsstyles-index.html

Near the top, right under Styles, Base Style

I tried setting the Style in qtquickcontrols2.conf, where I added:

 [Controls]
 Style=Base

This is my source code:

import QtQuick 2.13
import QtQuick.Window 2.12
import QtQuick.Controls 2.5

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Tumbler {
        id: tumbler
        x: 290
        y: 140
        model: 10
    }
}

I get a working Tumbler in a Flat Style. I have no idea where to tell Qt that I want the 'Base Style' (i.e., the '3D Look').

Note: I have tried to import various versions of QtQuick.Controls 1.x (and of 2.x), but they all result in a Flat Style or an error.

Thank you.

Answer 1

The problem is that you are trying to apply a style of Qt Quick Controls 1 to an item of Qt Quick Controls 2. So the solution is to use the appropriate item and avoid mixing elements from different packages, and set the style using QT_QUICK_CONTROLS_1_STYLE.

main.qml

import QtQuick 2.13
import QtQuick.Window 2.12

import QtQuick.Extras 1.4 as QQE

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    QQE.Tumbler { // https://doc.qt.io/qt-5/qml-qtquick-extras-tumbler.html
        id: tumbler
        x: 290
        y: 140
        QQE.TumblerColumn {
            model: 10
        }
    }
}

main.cpp

#include <QtGui>
#include <QtQml>

int main(int argc, char *argv[]) {
    qputenv("QT_QUICK_CONTROLS_1_STYLE", "Base");
    QGuiApplication app(argc, argv);
    QQmlApplicationEngine engine;
    const QUrl url(QStringLiteral("qrc:/main.qml"));
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                     &app, [url](QObject *obj, const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    }, Qt::QueuedConnection);
    engine.load(url);
    return app.exec();
}

qml.qrc

<RCC>
    <qresource prefix="/">
        <file>main.qml</file>
    </qresource>
</RCC>