Qt QML中的嵌套滚动视图不';对鼠标滚轮没有反应
我有一个嵌套的ScrollView,类似于以下QML:Qt QML中的嵌套滚动视图不';对鼠标滚轮没有反应,qt,qml,qtquick2,Qt,Qml,Qtquick2,我有一个嵌套的ScrollView,类似于以下QML: import QtQuick 2.0 import QtQuick.Controls 1.1 Rectangle { width: 200 height: 600 ScrollView { id: sView anchors.fill: parent ListView { id: list boundsBehavior
import QtQuick 2.0
import QtQuick.Controls 1.1
Rectangle {
width: 200
height: 600
ScrollView {
id: sView
anchors.fill: parent
ListView {
id: list
boundsBehavior: Flickable.StopAtBounds
clip: true
focus: true
interactive: true
model: 5
delegate: Component {
MouseArea {
id: hoverArea
width: 100
height: 200
onClicked: list.currentIndex = index;
Rectangle {
id: fauxParent
anchors.fill: parent
border.width: 1
border.color: "black"
Rectangle {
anchors.top: parent.top
anchors.left: parent.left
height: parent.height
width: parent.width / 2
border.width: 1
border.color: "purple"
color: "green"
Text {
anchors.centerIn: parent
text: "stuff"
}
}
ScrollView {
//parent: sView
anchors.top: fauxParent.top
anchors.right: fauxParent.right
height: fauxParent.height
width: fauxParent.width / 2
ListView {
model: 3
delegate: Component {
Rectangle {
radius: 10
height: 100
width: 100
color: "blue"
}
}
}
}
}
}
}
}
}
}
它似乎运行正常,只是内部ScrollView不会响应鼠标滚轮:外部ScrollView截获该事件。我在研究中发现的唯一修复方法是将内部scrollview的父视图直接设置为外部scrollview(取消注释父视图:sView
行)。不幸的是,这会将所有五个scrollview代理重新定位到外部scrollview的右上角。ScrollView似乎是基于其父视图来定位自己的
作为记录,我的实际应用程序在scrollview中包装了页面的一大部分,以便允许用户访问可能超出当前窗口大小界限的部分。但是,本节的内容有各种不同的控件,用于各种不同的目的,包括一些滚动视图。因此,我也会接受另一种方式,在一组对窗口来说太大的通用内容周围移动
这是一个Windows桌面应用程序,所以我不需要考虑特定于移动的问题。
你嵌套了四个处理滚动事件的元素。 为什么将滚动视图放在列表视图的周围 如果移除滚动视图,鼠标滚轮工作正常Rectangle {
width: 200
height: 600
ListView {
anchors.fill: parent
id: list
boundsBehavior: Flickable.StopAtBounds
clip: true
focus: true
interactive: true
model: 5
delegate: Component {
MouseArea {
id: hoverArea
width: 100
height: 200
onClicked: list.currentIndex = index;
Rectangle {
id: fauxParent
anchors.fill: parent
border.width: 1
border.color: "black"
Rectangle {
anchors.top: parent.top
anchors.left: parent.left
height: parent.height
width: parent.width / 2
border.width: 1
border.color: "purple"
color: "green"
Text {
anchors.centerIn: parent
text: "stuff"
}
}
ListView {
anchors.top: fauxParent.top
anchors.right: fauxParent.right
height: fauxParent.height
width: fauxParent.width / 2
model: 3
delegate: Component {
Rectangle {
radius: 10
height: 100
width: 100
color: "blue"
}
}
}
}
}
}
}
}
如果错过滚动条,请查看以下内容: