QtQuick2：处理滚动视图内的滚动事件

Question

我必须将组件X放置在滚动视图内。组件X必须处理鼠标滚轮事件，但ScrollView处理它。所以，下面的例子（简化）不起作用。

如何让矩形的鼠标区域处理OnWheel事件？

import QtQuick 2.1 
import QtQuick.Controls 1.0 
import QtQuick.Window 2.0 
import QtQuick.Layouts 1.0 

ApplicationWindow { 
    width: 640 
    height: 480 

    ScrollView { 
     height: 100 
     width: 100 

     ColumnLayout{ 
      Rectangle { 
       color: "red" 
       width: 50 
       height: 50 
       MouseArea { 
        anchors.fill: parent 
        onWheel: { 
         console.log("onWheel"); // it doesn't work 
        } 
        onClicked: { 
         console.log("onClicked"); // it works 
        } 
       } 
      } 
     } 
    } 
} 

Answer 1

我找到了解决方法，但我不能正确解释它。 :(

This document说明的visual parent和object parent的概念，但它这么想的告诉他们如何影响事件传播。

希望有人能给出一个明确的交代。

ApplicationWindow { 
    width: 640 
    height: 480 

    ScrollView { 
     id: scroll // add an id 
     height: 100 
     width: 100 

     ColumnLayout{ 
      Rectangle { 
       id: rect // add an id 
       color: "red" 
       width: 50 
       height: 50 
       MouseArea { 
        parent: scroll  // specify the `visual parent` 
        anchors.fill: rect  // fill `object parent` 
        onWheel: { 
         console.log("onWheel"); // now it works 
        } 
        onClicked: { 
         console.log("onClicked"); // it works 
        } 
       } 
      } 
      Repeater { 
       model: 30 
       Text{ text: index } 
      } 
     } 
    } 
} 

Answer 2

这实际上为在Qt的一个bug：

• https://bugreports.qt.io/browse/QTBUG-38083

这是正在解决中：

• https://codereview.qt-project.org/#change,82572
• https://codereview.qt-project.org/#change,82576