106

I am new to Qt and don't quite understand the difference between a Qt Quick Project and a Qt Widget Project.

I am hoping to create a program that draws a lattice of hexagons that the user can rotate and shear, as well as pan around and zoom in and out of. It will eventually be a MIDI controller. Which type of project would be better for this, and why?

I am hoping for this to work on both desktop and mobile platforms.

Anurag Singh
  • 492
  • 6
  • 16
Anthony
  • 8,570
  • 3
  • 38
  • 46
  • 3
    Spend a bit of time on the [Qt Quick](http://qt.nokia.com/qtquick/) website and look around the examples. If that's what you need, use it. If not, got for normal Qt widget project, but mobile platforms will possibly be an issue. – Mat Dec 24 '11 at 20:01
  • Updated link for Mat's comment https://doc.qt.io/qt-5/qtquick-index.html – Aykhan Hagverdili Oct 13 '20 at 20:02
  • Updated link for Ayxan Haqverdili's comment [doc.qt.io/qt-6/qtquick-index.html](https://doc.qt.io/qt-6/qtquick-index.html) – bturner1273 Mar 24 '22 at 15:32

5 Answers5

74

Note: In this answer, "Qt Widgets" refers to a Qt Widgets Application, selectable when creating a new Qt application.

This is seven years after the question was first posted... but here's my "objective" two cents to neutralise any developments since then.

A Refresher

Language

Qt Quick projects use QML and JavaScript. The latter carries the brunt of program logic: event actions (Component.onCompleted, onClicked, etc.), math, etc.

Qt Widgets projects use C++ code. (PyQt and PySide, Python bindings for Qt, uses Python.)

Performance and Coding

As such, Qt Widgets could be considered low-level compared to Qt Quick. But this implies that in the long run, a Qt Widgets project will run faster and have better performance. Being low-level can be good though, as Qt Widgets is more exposed to native API (the QtCore module, etc). That said, it is often used for desktop development.

Qt Quick caters to both desktop and mobile development. It has ready-to-use popups, animations, tabs and layouts, flickables, drawers, and the usual controls; all ubiquitous in mobile development.

Look-and-Feel

As mentioned before, Qt Widgets is more in touch with the native look-and-feel, so styling defaults to the native look-and-feel. You can use Qt Style Sheets to enhance your widgets, but these are still limited.

Qt Quick is more flexible in terms of styling. One interesting case study is MuseScore. In the migration from version 3 to 4, MuseScore changed many UI components from Qt Widgets to Qt Quick/QML. Why? Because of ambitious UI/UX designs. Pop-ups (among other things) were more convenient to implement with Qt Quick. (Source: Tantacrul on MuseScore 4, 8:08-9:30)

UI Design

Both have ui files which work with QtDesigner, providing a high-level view for setting layouts and creating interfaces. This also enables designers with little knowledge of programming to do their magic. (In Qt Quick, extensions are .ui.qml. In Qt Widgets, they are .ui.) It's not necessary to use .ui files; you can still choose to programmatically design your UI using QML/JS or C++/Python.

Learning

If you're completely new to programming, I suggest having a look at Qt Quick first. Personally, I think Qt Quick has a gentler learning curve and is easier to work with to accomplish myriads of projects. It's called "Qt Quick" for a reason. (Don't look down on Qt Widgets though, they have some nice modules that outdo QtQuick.)

However, if you've been programming with C++ or Python before, I would suggest taking a look at Qt Widgets first, to get used to their signals and slot mechanism and modules that might interest you (e.g. sql, network, gui) alongside programming designs (e.g. model/view programming for displaying data).

Especially with C++, most non-Qt libraries that do event-handling use while-loops, this is not the case with Qt. They use signals and slots.

In the end, even if you're mainly using Qt Widgets, you might want to look at Qt Quick as it offers a high-level declarative language to work with and allows you to set things up more quickly. (Especially for mobile development.)

Qt provides examples in abundance for both Qt Quick and Qt Widget projects, along with a forum. You shouldn't worry about getting help in the long run. (Don't forget StackOverflow!)

Qt Quick + Qt Widget

So far we've been treating them like separate entities. But it is possible to integrate QML into C++. This allows you to take advantage of Qt Widget, C++, and other modules. For example, QtQuick provides a TreeView but not a TreeModel, which can/should be registered into QML from C++. Often there is a separation of concerns pitch, where Qt recommends separating programs into UI and logic into QML and C++ respectively.

This also comes in handy, if say, you need a backend for intense SQL queries, algorithms, or asynchronous http/xml requests. Isn't that cool? QML/JS frontend plus a C++ backend. Fullstack Qt'er. :-)

TrebledJ
  • 8,713
  • 7
  • 26
  • 48
  • Thank you, it was a useful introduction to the UI options in Qt. – Vladimir Sep 22 '21 at 14:40
  • 1
    Qt Quick allows hot reload, see [qhot](https://github.com/patrickelectric/qhot) or [Hot reload QML when using ApplicationWindow](https://stackoverflow.com/questions/55147206/hot-reload-qml-when-using-applicationwindow) or [felgo live](https://felgo.com/qml-hot-reload-for-qt-with-felgo-live) – milahu Feb 18 '23 at 10:06
  • qtdeclarative (for Qt Quick) is a large dependency -> runtime size, bundle size – milahu Feb 19 '23 at 13:50
45

Note: Qt Widgets have been replaced with QML Widgets; this answer responds to the question as asked, which is now strictly a historical question about the old Qt Widgets.

Qt Quick is a declarative, smartphone-style user interface with support for a lot of the cool animation transitions that are common in smartphone apps. Quick is also a good choice for rapidly developing a prototype. Qt Widget is the traditional desktop-oriented UI model.

Right now (pre-Qt5), Qt Quick support for desktop system features is lacking (but improving). There's not as much support for menus, toolbars, dialogs, and other standard desktop behaviors in Quick, while Widget supports those elements extremely well.

Do you want your app to look and feel native on desktop and tablet platforms, or are you building a simple application around your own custom UI widget? As Mat said, if Qt Quick supports the features you want, that will probably be your fastest approach. If you want to build full-featured desktop versions, Qt Widget is probably your best bet.

AndrewS
  • 8,196
  • 5
  • 39
  • 53
  • 1
    I'd like both. :) Using Qt Widget for now. – Anthony Feb 02 '12 at 02:48
  • 11
    This answer should be either removed, edited or downvoted as we are now in a post Qt 5.0, we are even approaching 6.0 and Qt Widgets were superseded by QML Widgets. – Ariel M. Feb 05 '18 at 20:55
  • The answer, or the question? Seems like you're saying that the question is no longer relevant. – AndrewS Feb 08 '18 at 16:49
  • 23
    QML is NOT a replacement for Qt Widgets, even now in 2019, at least until it replace projects like Qwt, QCustomPlot and bunch of others which seems is not the case. Until when it is just another way of implementation, no more no less. – Andry Jan 26 '19 at 13:06
  • 2
    @Ariel M. Qt Widgets is not superseded and can not be, at least until everything is rewrited, which is not the case. – Andry Jan 26 '19 at 13:08
  • 1
    Qwt and QCustomPlot are third party projects, and not part of QtWidgets so it's irrelevant if they are or aren't ported. Furthermore, Anthony is a newbie and was asking about creating a MIDI controller where a heavily customized UI would be needed (see Arena, Lemur PS Elements and similar software). QML is the way to go. – Ariel M. Jan 27 '19 at 22:12
  • 1
    @Ariel M. You said about QML supersede something which is not a supersede at all. It is a way to write new code, but not a way to replace existed code. – Andry Feb 02 '19 at 14:14
  • "Supercede" as in "replace in the long run" then, like a tracktor replaced a plow, the world has mostly moved to fluid uI's and simpler languages with simpler tooling. – Ariel M. Feb 03 '19 at 20:49
  • Where did you get that `Qt Widgets have been replaced with QML Widgets` from?! They're just two different ways to achieve what you what. Where each of which has its advantages and disadvantages over the other, by NO means one is a replacement for the other!! – Bobo Feugo Sep 18 '21 at 07:00
  • Seems you are way too passionate about this. Keep your cool man. – Ariel M. Aug 23 '23 at 16:02
42

As someone who develops qt applications professionally, I will choose qml over widgets any day.

Widgets are good for the very basic stuff, but I once you need to create something that is a bit more fancy, widgets will fall short very soon.

Qml is simply way more flexible, you can anchor items wherever you want instead of using the limited layout system of widgets. There are almost no platform-dependency flaws while widgets are full of these. And the property binding system makes it so damn easy to keep your ui in sync with your model.

Teimpz
  • 945
  • 7
  • 8
  • 3
    Thanks! I just decided to start with QML/QtQuick, based on your professional background stated in your answer. Just realize I can easily use the *.ui.qml from QtCreator and use it directly in PyQt. Solved my initial setup of Python + QtQuick! – swdev Jan 27 '16 at 17:23
  • 2
    Using QtQuick for complex desktop programs is bad idea in performance... – Yousha Aleayoub Aug 03 '18 at 21:02
  • 2
    Maybe you are not experienced enough with the layouts API? Any example of what you can do with QML that you cannot do with Widgets? I'm working with Qt on apps with 10Ks users worldwide for more than 5 years and we use Widgets because only they provide unlimited power. QML is good for prototypes and small projects. And yes, performance matters. Also, since QML is OpenGL driven, this is a show stopper if your userbase is full of old hardware. – Dalamber Mar 20 '20 at 08:42
  • Or current hardware with graphics chipsets that don't support OpenGL, i.e. most laptop GPUs. – Alan B Aug 24 '21 at 14:42
  • 1
    @AlanB may I ask which laptop GPUs do not support OpenGL nowadays? – Sentouki Dec 14 '21 at 19:07
  • Alas, Qt Quick is no longer OpenGL dependant. It can go from raster to OpenGL to Vulkan to DirectX. QML for the win! – Ariel M. Aug 23 '23 at 16:06
8

Firstly, I think you should start with Widget. Widget UI help to learn qt easily additionally if your previous expriences are about front-end things you would learn Quick easily.

myd0
  • 138
  • 1
  • 4
7

Qt Quick defaults to QML, JSON declarative dialect with inline ECMAscript enabled. With Qt widgets, stylesheets can be made by the designer, and the developer does native C++ coding.

QML is processed at run-time. Within the framework everything can run together, the differences just add flexibility to software architect's decision making.

Chawathe Vipul S
  • 1,636
  • 15
  • 28