Search code examples
c++qtqmlqtwidgets

Qt Widgets vs QML language relevance


Most of the guides on the internet suggest to use QML instead of Qt Widgets when it comes to dealing with graphics.

  • What is the difference between Qt Widgets and QML?
  • What does QML give us, that Qt Widgets does not?

Solution

  • UI Technology

    It's actually not so much a question of QML vs C++, rather it is a question of what UI technology to use with Qt:

    • QtWidgets (code written with C++)
    • QtQuick (code written with QML/JS)
    • HTML5 (via WebEngine, embedded into a widget or QtQuick item)
    • OpenGL (embedded into a widget or QtQuick item)

    Leaving aside HTML5 and OpenGL, the question QtWidgets vs QtQuick has been discussed in other placed, for example at Qt Quick vs. Qt Widget and at this Qt DevDays 2014 presentation.

    My personal opinion: Use QtWidgets for traditional desktop applications, and QtQuick for mobile and embedded (devices with touchscreen), unless you have good reasons to do otherwise. QtWidgets has better and more mature support for traditional desktop controls, while QtQuick is better for animations and completely custom styling.

    One reason to use QtQuick on the desktop is when you want lots of custom animations and styling, at the cost of fighting a bit more with traditional desktop controls such a toolbars, menubars, drag&drop etc.

    Language

    When choosing QtWidgets, the language is always C++ (well, unless you use the Python bindings). While you can use the Qt Designer tool to visually create UIs, in the end those get compiled to C++.

    When choosing QtQuick, the language for the UI parts will be QML and JavaScript. However, in any moderately large QtQuick application, you will at some point also have a C++ part - for example to interface with other C and C++ libraries, for operations that don't have an associated JavaScript API or simply for quicker and more maintainable code than JS. C++ classes and objects can be accessed from QML, check the documentation for more details.