Qt and QML on 2017: Fast Prototyping

Question

I'm coming from Web Dev and i'm used to fast html prototyping with tool that automatically update browser after any code change, and want to know what are the best way/tool to achieve this when programming with Qml.

Answer 1

Qt has far less tooling for this than web developers are used to, which is kind of a shame.

There's Terrarium: http://www.terrariumapp.com/ It's fairly cool.

Another tool you might try: https://github.com/penk/qml-livereload

Although it has limitations, it gives you some basic live reloading functionality.

I'd definitely like to see more in this area. I keep thinking about writing/contributing to projects like this.

Answer 2

Qt 5.9 and the latest Qt Creator supports this pretty well.

The latest code editor is probably exactly what you are looking for.

http://blog.qt.io/blog/2017/05/24/qt-creator-4-3-0-released/

For Qt Creator 4.3 we integrated a code editor into Qt Quick Designer. This allows you to use the Properties editor and the Navigator also while editing code. Additionally, you can split the view to show both the graphical and the code editor, and directly see how a change in the graphical editor affects the code, and vice versa. Of course, you can still use the code-only editor in the Edit mode as well.

https://blog.qt.io/blog/2017/05/24/qt-quick-designer-qt-creator-4-3/

Integrated text editor

The most obvious addition is an integrated text editor in the Design mode that also allows editing the QML code side by side with the form editor as a preview. Besides being able to edit QML code while seeing a preview also the property editor can be used together with the text editor. Qt Quick Designer will always select the item that currently contains the cursor.

So if you just forgot the name of a property or enum, you can now use the property editor instead. Switching between the form editor and the integrated text editor is also a lot faster than switching between Edit and Design mode. This makes it more convenient to move to the integrated text editor to refactor or clean up something.

Hope that helps.