How can we declare enumerations in QML, without any JavaScript?

Question

Does QML allow us to define enums? If so, how we can declare enumerations in QML?

I want to declare an enum in QML like the following C++ enum. If possible, I want to do this without any JavaScript.

enum Color { RED, GREEN, BLUE };
Color r = RED;
switch(r)
{
    case RED  : std::cout << "red\n";   break;
    case GREEN: std::cout << "green\n"; break;
    case BLUE : std::cout << "blue\n";  break;
}

What should I do?

score 40 · Answer 1 · answered May 04 '18 at 12:01

Since Qt 5.10, enumerations are directly supported in QML. See Qt documentation which contains sample code.

You can define one with the enum keyword. The type and its values must start with a capital letter but otherwise follow rules for naming a variable (e.g. can include digits and underscore).

To use the enum, you have to explicitly include the full scope including the component ComponentName.EnumType.EnumValue. This is true even when using it within the component itself.

e.g.

// MyComponent.qml
Rectangle {
    id: root

    // Define Shape enum
    enum Shape {
        None,
        Round,
        Pointy,
        Bobbly,
        Elusive
    }

    // Note: property using enum is of type int
    property int selectedShape: MyComponent.Shape.None

    visible: selectedShape !== MyComponent.Shape.None
    color: selectedShape === MyComponent.Shape.Pointy? "red": "green"
}

Note that enumerated values are treated as int and you can assign and compare them as such.

Although not documented (and therefore potentially subject to change), by default the first one has value 0, the second 1, etc.. However you can assign a non-negative integer value. You can even assign two enum values to the same integer value though that is probably not a good idea. You cannot assign an expression that evaluates to an integer.

e.g.

enum Shape {
    None = 5, // valid
    Round, // automatically assigned 6
    Pointy = -1, // not valid
    Bobbly = Round // not valid
    Elusive = (8-7) // not valid
}

Thanks to Michael Brasser's blog comment about assigning simple values.

where does the 'ComponentName' come from? is that the prefix of QML file name or? — Vega4, May 31 '21 at 10:05
An example of`ComponentName.EnumType.EnumValue` from my code sample is `MyComponent.Shape.Pointy`. `ComponentName` is the filename of the component you are creating. — Paul Masri-Stone, May 31 '21 at 22:38
How can this be made to work for the main qml file called by C++, e.g. `main.qml`? — Kenn Sebesta, Aug 05 '21 at 15:38
You create the enum in a component, as above, and then use it in `main.qml` via its full scope, as described above. — Paul Masri-Stone, Aug 05 '21 at 16:52

Miguel El Merendero · Accepted Answer · 2016-04-09T05:52:02.650

19

You can use a pure Qml singleton, so you don't need any C++ or javascript.

colors/MyColors.qml:

pragma Singleton
import QtQuick 2.5
QtObject {
    id: singleton

    property int red: 0
    property int green: 1
    property int blue: 2
}

colors/qmldir:

singleton MyColors 1.0 MyColors.qml

Your qml file:

import "colors" 1.0
// MyColors.red
// MyColors.green
// MyColors.blue

edited Apr 09 '16 at 05:52

answered Dec 26 '15 at 07:36

Miguel El Merendero

2,054
1
17
17

2

Just a side note, properties cannot begin with an upper case letter. – Silex Mar 22 '16 at 20:10
At least make your properties in MyColors.qml readonly for this usage. – André Dec 16 '20 at 07:04

Simon Warta · Answer 3 · 2015-12-26T10:44:02.740

First, use enum class instead of enum for better type safety

enum class Color { RED, GREEN, BLUE };
Color r = Color::RED;

Then register it for Qt using Q_ENUMS (use Q_ENUM for Qt 5.5+):

mycolors.h

#pragma once

#include <QObject>

class MyColors : public QObject
{
    Q_OBJECT

public:
    enum class Color {
        RED,
        GREEN,
        BLUE
    };
    Q_ENUMS(Color)

    static void init();
};

To make the enum available in QML, register it (in a mycolors.cpp file):

void MyColors::init()
{
    qRegisterMetaType<MyColors::Color>("MyColors::Color");
    qmlRegisterType<MyColors>("MyQmlModule", 1, 0, "MyColors");
}

and call Colors::init() in your main().

In QML you now have

import MyQmlModule 1.0

// MyColors.RED
// MyColors.GREEN
// MyColors.BLUE

score 8 · Answer 4 · answered Jan 26 '18 at 11:08

Since Qt 5.10, you can now also declare Enum types directly in QML: https://v-play.net/updates/v-play-2-15-0-qt-5-10-qt-creator-4-5-support-firebase-data-structures-and-queries#qt-5-10-qml-enum-instanceof

// MyText.qml
import QtQuick 2.0

Text {
  enum MyEnum {
    Normal,
    Heading
  }

  property int textType: MyText.MyEnum.Normal

  font.bold: textType == MyText.MyEnum.Heading
  font.pixelSize: textType == MyText.MyEnum.Heading ? 24 : 12
}

// Main.qml
import VPlayApps 1.0

App {
  MyText {
    textType: MyText.MyEnum.Heading
    text: "I'm a headline."
  }
}

How can we declare enumerations in QML, without any JavaScript?

4 Answers4

Linked

Related