MouseArea не может обновить свойство mouseContains при перемещении

Question

У меня проблема с тем, что свойство MouseArea containsMouse не обновляется должным образом после анимации.

Ниже я включил фрагмент коданадеюсь, это проиллюстрирует мою точку зрения:

import QtQuick 2.10

Item {
    id: root

    width: 500
    height: 240
    visible: true

    ListView {
        id: view

        anchors.fill: parent
        anchors.margins: 20
        orientation: ListView.Horizontal
        spacing: 20

        delegate: Rectangle {
            width: 100
            height: 200
            color: "black"
            radius: 10

            Rectangle {
                width: 40
                height: 40
                anchors.centerIn: parent
                color: mouseArea.containsMouse ? "white" : "grey"
                visible: model.index == view.currentIndex

                MouseArea {
                    id: mouseArea

                    anchors.fill: parent
                    hoverEnabled: true

                    onClicked: view.model.move(view.currentIndex, view.currentIndex+1, 1)
                }
            }
        }

        model: ListModel {
            ListElement { number: 1 }
            ListElement { number: 2 }
            ListElement { number: 3 }
            ListElement { number: 4 }
        }

        move: Transition {
            NumberAnimation { properties: "x"; duration: 200 }
        }

        moveDisplaced: Transition {
            NumberAnimation { properties: "x"; duration: 200 }
        }
    }
}

Если вы запустите это приложение, вам будет представлен следующий экран:

Перемещение курсора в нижнюю левую часть серого поля изменит цвет окна на белый, например:

МоментПри нажатии на кнопку запускается анимация, чтобы поменять местами первый и второй элемент ListView .После завершения, к сожалению, вы MIGHT получите следующий результат:

Исходя из строки кода color: mouseArea.containsMouse ? "white" : "grey", я быЯ ожидал, что прямоугольник будет серым, так как мышь больше не содержится в MouseArea .

Так что мой вопрос:

1. Что-то не так смой код
2. Это ошибка
3. Что можно сделать, чтобы исправить это поведение
4. Может быть объяснение, почему это происходит

Answer 1

Проблема в инструкции:

visible: model.index == view.currentIndex

Когда элемент перемещается, эта инструкция изменяется между Истиной и Ложью, поэтому она считается нестабильной при переходе, поэтому она генерирует такое неопределенное поведение.ListView предоставляет стабильное свойство с именем ListView.isCurrentItem, которое указывает текущий элемент.

Решение следующее:

delegate: Rectangle {
    id: rect // <--- set id
    width: 100
    height: 200
    color: "black"
    radius: 10

    Rectangle {
        width: 40
        height: 40
        anchors.centerIn: parent
        color: mouseArea.containsMouse ? "white" : "grey"
        visible: rect.ListView.isCurrentItem // <--- change this line
        MouseArea {
            id: mouseArea

            anchors.fill: parent
            hoverEnabled: true

            onClicked: view.model.move(view.currentIndex, view.currentIndex+1, 1)
        }
    }
}