"Floating" popups/dialogs
-
I know that the normal QML way is that Popup and Dialog are effectively drawn inside rectangles that are completely within the main window area. This is often fine but for more complex content I have often wished for the more traditional desktop app approach where the dialog is a floating window that can be moved around freely and possibly resized - basically not being constrained by the bounds of the main window.
Is the best/only way to achieve this to create my own popup component using a
Window
? Is there anything wrong in doing this other than it is a bit non-standard in terms of QML paradigms?Thanks.
-
Best way is to simply use a
Window
. You can customize it to your needs (remove the title bar, etc.).import QtQuick 2.15 import QtQuick.Window 2.15 ApplicationWindow { id: root visible : true width: 400 height: 300 Window { visible: true modality: Qt.ApplicationModal // prevent user interacting with parent window transientParent: root // indicates that this window acts as a modal for its parent window } }
-
Best way is to simply use a
Window
. You can customize it to your needs (remove the title bar, etc.).import QtQuick 2.15 import QtQuick.Window 2.15 ApplicationWindow { id: root visible : true width: 400 height: 300 Window { visible: true modality: Qt.ApplicationModal // prevent user interacting with parent window transientParent: root // indicates that this window acts as a modal for its parent window } }
-
Thanks. I assumed
Window
must be the way to go but I have struggled to find much discussion about this and so wondered if what I wanted to do was fundamentally at odds with QML paradigms. -
@Bob64 Hi do not quite understand the problem :( You can place your popup wherever you want using x an y coordinates.
If you parent it to the main window you can do whatever you want regarding positioning?
Regards,
Emmanuel@Allon Apologies for not replying sooner. I have not had access to my PC for a few days and wanted to post a couple of images.
The basic issue is that the default QML way does not allow a popup menu or a dialog to extend outside of the rectangle of the main window. Here are a couple of examples where this would be completely natural behaviour in a normal desktop interface:
Sure it is possible to set the x,y position to mitigate this somewhat but it still does not necessarily provide a convenient solution. To be honest, I am more concerned by dialogs than popups - particularly the use case where the dialog provides some sort of tool for dealing with more complex input as in the second image above. Cases where it is convenient for the user to be able to move the tool out of the way, resize it and so on.
-
If the idea is to use it for "short lifespan" windows, you can also use
Dialog
: https://doc.qt.io/qt-5/qml-qtquick-controls2-dialog.htmlDepending on your use case, it can be better than
Window
. -
If the idea is to use it for "short lifespan" windows, you can also use
Dialog
: https://doc.qt.io/qt-5/qml-qtquick-controls2-dialog.htmlDepending on your use case, it can be better than
Window
.@ebatsin Well this gets to the crux of my question. I am aware of
Dialog
but my question arises precisely from the observation that for some use cases it is fairly useless. It's just a rectangle embedded at a static position in the main window. The user cannot resize it or move it outside the boundary of the main window. In fact the user can't move it at all (at least not without what I would assume would be fairly extensive custom code).Perhaps I should ask whether there are any 'gotchas' or issues I should be aware of in using
Window
?(I suppose a more general question is whether I should be using QML at all for a desktop environment but I think I will reserve that for a separate question at some point.)
-
@ebatsin Well this gets to the crux of my question. I am aware of
Dialog
but my question arises precisely from the observation that for some use cases it is fairly useless. It's just a rectangle embedded at a static position in the main window. The user cannot resize it or move it outside the boundary of the main window. In fact the user can't move it at all (at least not without what I would assume would be fairly extensive custom code).Perhaps I should ask whether there are any 'gotchas' or issues I should be aware of in using
Window
?(I suppose a more general question is whether I should be using QML at all for a desktop environment but I think I will reserve that for a separate question at some point.)
-
@ebatsin Well this gets to the crux of my question. I am aware of
Dialog
but my question arises precisely from the observation that for some use cases it is fairly useless. It's just a rectangle embedded at a static position in the main window. The user cannot resize it or move it outside the boundary of the main window. In fact the user can't move it at all (at least not without what I would assume would be fairly extensive custom code).Perhaps I should ask whether there are any 'gotchas' or issues I should be aware of in using
Window
?(I suppose a more general question is whether I should be using QML at all for a desktop environment but I think I will reserve that for a separate question at some point.)
@Bob64 said in "Floating" popups/dialogs:
Perhaps I should ask whether there are any 'gotchas' or issues I should be aware of in using
Window
?No, there shouldn't be any gotcha.
Window
is the correct component for your usecase.Note that comments related to your issue has been made in this issue : https://bugreports.qt.io/browse/QTBUG-69790
-
@Bob64 Hi,
It seems here that it can be resized:
https://youtu.be/t_UFPXHeiiM?t=413
Regards,@Allon I think they are using QtQuick 1 dialogs there, which were indeed more like the traditional desktop style that I am talking about. But QtQuick 1 is on its way out so I am not about to start using it. I already have the impending nightmare of what to do about my current use of
TreeView
. -
@Bob64 said in "Floating" popups/dialogs:
Perhaps I should ask whether there are any 'gotchas' or issues I should be aware of in using
Window
?No, there shouldn't be any gotcha.
Window
is the correct component for your usecase.Note that comments related to your issue has been made in this issue : https://bugreports.qt.io/browse/QTBUG-69790