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