I am trying to create a combo box with multiple selection using QML. Its dropdown will be a QML Window with the flag Qt.Popup so it will not have a title bar. The dropdown should disappear when the user clicks outside of it.
I tried the following code:
import QtQuick 2.0
import QtQuick.Window 2.0
Window { id: mainWindow
width: 200
height: 200
MouseArea {
anchors.fill: parent
onClicked: {
dropdown.x = mainWindow.x + 50;
dropdown.y = mainWindow.y + 50;
dropdown.visible = true;
}
}
Window { id: dropdown
height: 200
width: 200
flags: Qt.Popup
color: 'green'
visible: false
onVisibleChanged: {
if (visible) {
focusScope.focus = true;
focusScope.forceActiveFocus();
}
}
FocusScope { id: focusScope
focus: true
anchors {
fill: parent
}
onActiveFocusChanged: {
if (!activeFocus) {
dropdown.visible = false;
}
}
}
}
}
And it doesn't work.
In the code above when the user clicks on the main window, a popup appears and if the user clicks on another window or on the title bar of the main window it should disappear but it doesn't do that.
If I import version 2.1 of QtQuick.Window instead of 2.0 I can put a 'onActiveChanged' handler (without getting an error) inside the dropdown Window but it is never called.
Maybe I would be able to do this using some C++ but I try to avoid that.
I use Qt 5.1.1 on Ubuntu 13.10.
Thank you.
Update: I switched to Qt 5.2 and solved the problem (see my answer below).