Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Building an app that works like Qt Designer



  • I'm quite inexperienced with Qt, but I have to build an app that works somehow like Qt Designer (the interactive part); i.e. while is watching a report built with many widgets/views displaying data, the user can click a button to toggle a different mode where he/she can reposition widgets on screen, insert new ones from a pool, "rewire" them to show different available data from a detail panel and so on...

    I'm lost on how to tackle this problem. I've tried to skim through the source code of Qt Designer itself, but with limited success.

    Anyone knows the actual design of Qt Designer? Or a good, fast way to implement something similar? What widgets/views are best suited to do this?


  • Lifetime Qt Champion

    Hi
    And a report generator like
    https://sourceforge.net/projects/qtrpt/
    could not be a solution?
    It already has a visual designer and data links.

    If you want to make your own, then maybe
    https://wiki.qt.io/Widget-moveable-and-resizeable
    could be ok start to be able to resize/move widgets around.

    Or you can have a look at
    https://doc.qt.io/qt-5/graphicsview.html
    where selection/move works out of the box.


  • Lifetime Qt Champion

    Hi
    And a report generator like
    https://sourceforge.net/projects/qtrpt/
    could not be a solution?
    It already has a visual designer and data links.

    If you want to make your own, then maybe
    https://wiki.qt.io/Widget-moveable-and-resizeable
    could be ok start to be able to resize/move widgets around.

    Or you can have a look at
    https://doc.qt.io/qt-5/graphicsview.html
    where selection/move works out of the box.



  • Sorry for the late reply.

    I'd like to build something on my own in order to learn a bit more Qt, so the report generator, even if it may work, is not what I'm looking for.

    I was looking at the documentation and some tutorials about QGraphicsScene and I've found out you can directly add a widget through QGraphicsProxyWidget.
    As far as I can tell, this means that most of the functionalities I need can be easily implemented by properly setting a few flags (events are already forwarded by the proxy).

    The second option seems a bit more efficient (if I understand it correctly, the proxy needs to map the widget from an integer geometry to a floating point geometry), but would mean a lot more work.

    Still, I have a couple of question:

    • zoom in/out mechanics (like in every doc reader/editor) should be trivial to implement with QGraphicsScene. Can be done easily also with the second approach?

    • can layout (vertical, horizontal, grid) be added in a similar way to Qt Designer (drag and drop of widget onto it, the other way around, ...)?


  • Lifetime Qt Champion

    @Ignis

    Hi
    Zooming plain Widgets is doable but
    QGraphicsView is both much more efficient at it and works out of the box.

    QGraphicsView does not allow dropping into layouts directly.
    However, it supports drag and drop so you can implement it yourself.
    https://doc.qt.io/qt-5/qtwidgets-graphicsview-basicgraphicslayouts-example.html



  • If you want to know how Qt Designer is structured then the easiest way is to check the source code: https://github.com/qt/qttools/tree/dev/src/designer, you could modify it for your objective



  • Thank you for the link, didn't find it while looking around and seems exactly what I need. I'm implementing a proper QGraphicsScene and it seems flexible enough and very easy to code.

    Thanks for the help. Marked as solved.



  • Solutions provided above are probably the best.
    Just to complete the list I would like to point out another way of doing it (I've done it in past in different framework), which might be more feasible in some specific usecases.

    I used a bitmap as a design area, a list of available widgets and a tree of inserted widgets. I created a little drawing code for each widget and handles when widgets are moved. I employed drag and drop for inserting widgets, where they get in the same time inserted into a list and displayed in the tree view and drawn at the insertion point in the bitmap. I handled mouse down and move events for moving widgets around, loading properties into a panel to edit the widgets, etc.

    It might sound like a lot of work, but actually it's not that much and probably much less work then implementing a new framework and libraries. One works only with elementary stuff of the framework he/she's used to (provided Drawing2D and such libraries are counted as elementary to all :-)). For the same reason (no dependencies) it's also very lightweight and stable.

    But in most cases and specifically for Qt, I would follow advices suggested above.


Log in to reply