QML: ScrollView и MouseAreas: на панели прокрутки не обнаружено "наведение мыши"
У меня есть приложение QML, и мне нужно открыть диалоговое окно, когда я нажимаю кнопку. Диалог должен быть закрыт, когда мышь находится вне диалогового окна (без щелчка, поэтому я думаю, что элемент управления "Всплывающее окно" не может быть использован).
Для этого я использую MouseAreas и контролирую, когда мышь находится над одним из MouseAreas. Я решил некоторые проблемы (см. QML: Проблемы с перекрытием мышиной области), но теперь я обнаружил еще одну проблему с ScrollView (диалог должен содержать ScrollView с ListView). Я не могу контролировать, когда мышь находится над полосой прокрутки... И диалоговое окно закрыто, так как ни у MouseArea "нет" мыши над...
Как я могу контролировать события мыши на полосе прокрутки?
Заранее спасибо, Диего
Test.qml
import QtQuick 2.5
import QtQuick.Controls 2.1
import QtQuick.Window 2.0
Item {
width: 800
height: 800
property bool m_bButtonHovered: false
onM_bButtonHoveredChanged: updateOpen()
Rectangle{
id: rect
anchors { top: parent.top; topMargin: 100; horizontalCenter: parent.horizontalCenter }
height: 50; width: 50
color: "red"
MouseArea {
anchors.fill: parent
hoverEnabled: true
onEntered: m_bButtonHovered = true;
onExited: m_bButtonHovered = false;
}
}
Loader {
id: loader_dialog
anchors { top: rect.bottom; horizontalCenter: rect.horizontalCenter}
active: false
sourceComponent: TestMenu {
onClose: loader_dialog.active = false;
}
}
Timer {
id: timerOpen
interval: 200
running: false
repeat: false
onTriggered: checkOpen();
}
function updateOpen() {
if (m_bButtonHovered)
timerOpen.start();
}
function checkOpen(){
if (m_bButtonHovered)
loader_dialog.active = true;
}
}
TestMenu.qml
import QtQuick 2.0
import QtQuick.Controls 1.3
Rectangle {
id: id_dialog
signal close()
width: 400
height: 600
color: "lightgrey"
property int m_iNumHovered: 0
onM_iNumHoveredChanged: update();
function update() {
if (m_iNumHovered == 0)
timer.start();
}
function check() {
if (m_iNumHovered == 0)
id_dialog.close();
}
Timer {
id: timer
interval: 100
running: false
repeat: false
onTriggered: check();
}
MouseArea {
id: mouseAreaTopZone
anchors { bottom: parent.top; horizontalCenter: parent.horizontalCenter}
width: 50; height: 50
hoverEnabled: true
onEntered: m_iNumHovered++;
onExited: m_iNumHovered--;
}
MouseArea {
id: mouseAreaDialog
anchors.fill: parent
hoverEnabled: true
onEntered: m_iNumHovered++;
onExited: m_iNumHovered--;
}
ScrollView {
id: id_scrollView
anchors.centerIn: parent
height: 400; width: parent.width
ListView {
id: id_list
model: modelTest
anchors { left: parent.left; right: parent.right }
height: contentHeight
clip: true
interactive: false
delegate: Text {
height: 100
width: id_list.width
text: displayname
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
}
}
}
ListModel {
id: modelTest
ListElement { optionId: 1; displayname: "Option 1" }
ListElement { optionId: 2; displayname: "Option 2" }
ListElement { optionId: 3; displayname: "Option 3" }
ListElement { optionId: 4; displayname: "Option 4" }
ListElement { optionId: 5; displayname: "Option 5" }
ListElement { optionId: 6; displayname: "Option 6" }
ListElement { optionId: 7; displayname: "Option 7" }
}
}