悬停效果正在滚动 QML GridView 上的列表答案

【问题标题】：Hover effect is scrolling the list on a QML GridView悬停效果正在滚动 QML GridView 上的列表
【发布时间】：2017-07-27 13:53:20
【问题描述】：

我有一个带有滚动条和悬停效果的 QML GridView，当我将光标移动到页面底部时，悬停会自动滚动，我想停止它。我试图将 Flickable 的 interactive 属性设置为 false "interactive: false"，但它不起作用。我怎样才能阻止这种行为？

Obs：当我移除悬停效果时，滚动以预期的方式运行，只是在滚动条中移动。

GridView{
     id: grid
     anchors.margins: 20
     anchors.fill: parent
     cellHeight: 80
     cellWidth: 80
     model: MyModel{}
     highlight: Rectangle {
        color: "lightsteelblue"
        height: parent.cellHeight
        width: parent.cellWidth
        z:2
        opacity: 0.7
     }
     delegate: Column {
            Rectangle {
               color: myColor;
               height: grid.cellHeight * 0.7
               width: grid.cellWidth * 0.7
               border.color: "white"
               anchors.margins: 5
               anchors.horizontalCenter: parent.horizontalCenter

               MouseArea {
                   id: mouseRegion
                   anchors.fill: parent
                   hoverEnabled: true
                   onEntered: grid.currentIndex = model.index

               }
          }
          Text { 
             text: name; 
             anchors.horizontalCenter: parent.horizontalCenter }
          }
 }

这是重现该行为的简单项目的链接：https://drive.google.com/open?id=0B7WUSCDDdwtIbWVDWVFvMjM1djA

【问题讨论】：

能否提供可执行代码sn-p，可以测试？
很遗憾无法提供可执行代码，但我可以发布代码sn-p。
你应该阅读MCVE。如果我们无法复制您的错误，我们将无法帮助您。我们中的大多数人都试图在他们的空闲时间帮助你，这很宝贵，而为了找到你的错误而猜测编写代码是太多了。您无需共享您的生产代码。无论如何，这太过分了。只需编写一段完整的代码，我们可以运行，其中浓缩了您的情况。没有TRScrollView 或FileGridView（我的电脑上不存在某些东西，所以......它是什么？）。如果没有必要使用简单的ListModel 而不是FileGridView，等等
因为如果你不能提供这样的东西，那么答案的可能性很高很遗憾无法提供答案。 - 另见point 1. here
伙计们，我很抱歉我的代码，我很着急，我犯了一个错误。我忘记了我正在使用自定义组件，显然这无济于事。我希望你能帮助我，我从头开始编写了一个代码，它与我的原始代码具有相同的行为。代码可以通过drive.google.com/open?id=0B7WUSCDDdwtIbWVDWVFvMjM1djA@derM 下载，谢谢建议。

标签： c++ qt gridview scroll qml

【解决方案1】：

我的同事帮我找到了解决问题的方法。我使用currentIndex 属性在gridview 中设置悬停位置，如文档中所述，如果highlightFollowsCurrentItem 设置为true（默认值）和如果 highlightFollowsCurrentItem 设置为 false，则不会滚动。
但是，将highlightFollowsCurrentItem 属性设置为false 后，自动滚动与我的悬停效果一起停止，这显然是不希望的。我不知道出了什么问题，我们提出了不同的方法。
为了使悬停在没有currentIndex 行为提供的自动滚动的情况下工作，我们将其从gridview 中删除并使用onEntered 和onExited 来控制悬停行为，更改用于模拟悬停效果的矩形可见性（id:selectedItem），如下所示。

 GridView{
     id: grid
     anchors.margins: 20
     anchors.fill: parent
     cellHeight: 80
     cellWidth: 80
     model: MyModel{}

     delegate: Item{

           height: grid.cellHeight * 0.9
           width: grid.cellWidth * 0.7

           Rectangle {
               id: selectedItem
               color: "lightsteelblue"
               height: parent.height
               width: parent.width
               z:12
               opacity: 0.7
               visible: false
           }

           Rectangle {
               id:rect
               color: myColor;
               height: parent.height-textName.height
               width: parent.width
               border.color: "white"
               anchors.margins: 5
               anchors.horizontalCenter: parent.horizontalCenter
               MouseArea {
                   id: mouseRegion
                   anchors.fill: parent
                   hoverEnabled: true
                   onEntered: selectedItem.visible = true
                   onExited: selectedItem.visible = false
                }
           }
           Text {
               id: textName
               text: name;
               anchors.horizontalCenter: parent.horizontalCenter
               anchors.bottom: parent.bottom
           }
         }
      }

它让我避免了自动滚动并保持悬停效果正常工作。

【讨论】：