Docking in QtQuick [closed] - qt

Question

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 3 years ago.
Improve this question
As far as I understand there is no built-in functionality for dockable containers in QtQuick. I found a few sources where this is added, however I am having trouble deciding which way to go.
https://developer.blackberry.com/native/documentation/dev/custom_components/index.html
How to get a QMainWindow from ApplicationWindow QML file to allow use of QDockWidget with QML files
Can someone recommend a way (or preferably a library) to add docking to QtQuick?

Answer 1

I found a solution that works with multiple windows moving a widget from the main window (docked state) to a new window (undocked state).
Hoping that this is useful to others here is a complete example:
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0
import QtQuick.Window 2.2
ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
Window {
width: 100;
height: 100;
visible: false;
id: wnd
Rectangle {
id: greenRect
anchors.fill: parent
}
onClosing: {
blueRect.state = "docked"
}
}
Item {
width: 200; height: 100
Rectangle {
id: redRect
anchors.fill: parent
}
Rectangle {
id: blueRect
width: 50; height: 50
x: 10; y: 10;
color: "blue"
states: [
State {
name: "undocked"
ParentChange { target: blueRect; parent: greenRect; x: 10; y: 10 }
},
State {
name: "docked"
ParentChange { target: blueRect; parent: redRect; x: 10; y: 10 }
}
]
MouseArea {
anchors.fill: parent;
onClicked: {
blueRect.state = "undocked"
wnd.visible = true
}
}
}
}
}