Git Product home page Git Product logo

qmldev's Introduction

Qml Dev

This little project is a hot-reload test-bed for QML applications. This means that you run once, and then can edit your QML application during runtime. As soon as you save, the app is reloaded, taking your changes into account. Compilation / runtime errors are dynamically shown in place of the application if needed:

demo

Build

It's built using CMake or any IDE supporting it. Tested:

The project includes example configuration files for Visual Studio Code and 2019. You just need to update the path to Qt library in their launch settings (in .vscode/settings.json for Code and .vs/launch.vs.json for 201x) The path to the Qt libraries is located in CMakeLists.txt and setup for my installs, but you can easily use your own by setting the QT_DIR CMake variable when configuring (e.g. run cmake with -DQT_DIR=<path_to_qt> while configuring)

Usage

Once built, run it and it will try to load a Main.qml file from the current working directory, and if not found, from the executable's directory.

If it succeeds, the app will show, and a file watcher will listen for any modification of any file / directory in the current working directory or the executable's directory. When something changes, it will re-load the Main.qml file (so it's advised to create an empty workspace to avoid other file modifications to trigger the reloading)

This allows live development of quick QML test applications.

In case of error, an Error.qml file will be loaded in the same way as Main.qml (e.g. tries loading it from the current working directory, and if not found, from the exeuctable's directory) The provided Error.qml file displays the QML errors that prevented Main.qml to be correctly loaded.

You can customize Error.qml as long as you make absolutely certain it's valid QML. 2 context properties are made available:

  • fixedFont: system's default fixed width font (returned by QFontDatabase::systemFont(QFontDatabase::FixedFont))
  • errors: a string containing the QQuickView's errors that happened while loading Main.qml

This project being based on QtUtils I also made a few utilities globally available:

  • rootView: the main QuickView instance
  • settings: global instance of the Settings class.
  • file: global instance of the File class.

Options

The executable supports a few options to allow overriding the application (in C++, so no hot-reload there)

  • --style <style>: by default, the style used is Material, you can override that with this option.
  • --transparent: if you want to experiment with transparent / frameless QML applications, use this flag, and in the root QML item's Component.onCompleted callback, set the rootView's flags to Qt.Window | Qt.FramelessWindowHint)
  • --backend <backend>: override the default backend used to render the QQuick scene.
  • --app <file.qml>: override the name of the main QML file which is loaded (the Main.qml file)
  • --clearSettings: this will clear all settings before starting the application (used to check how it behaves on a fresh run)

Use the --help option to display a bit more informations.

Examples

Custom client-side window decoration

$> qmldev --transparent --app Frameless.qml

This display a small framework for displaying a custom title bar, and uses the new methods (Qt 5.15) of QWindow to handle system resize and move.

Contributing

Feel free to open an issue if you find some bugs, broken things, or have an idea of a an interesting feature you'd like to see implemented.

qmldev's People

Contributors

dcourtois avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.