Получение в PathView делегат

Question

Я пытаюсь анимировать свойство в моем делегате PathView после его появления.

    Component {
        id: pathViewDelegate
        Item {
            Text {
                id: tempText
                color: "red"
                text: "test"
            }

            function intoView() {
                myAnimation.start()
            }

            SequentialAnimation {
                id: myAnimation
                PropertyAnimation {duration: 1000; target: tempText; properties: "color"; to: "green"}
                PropertyAnimation {duration: 1000; target: tempText; properties: "color"; to: "yellow"}
            }
        }
    }

Единственный способ узнать, как правильно отобразить мой PathView (например, линейную карусель), - это иметьcurrentItem обрезается за пределами экрана.Другими словами, отображаемый элемент всегда является currentIndex + 1 в моем PathView.

    PathView {
        id: mainCarousel
        width: parent.width
        height: parent.height

        interactive: false
        highlightMoveDuration: 300

        clip: true

        model: pathViewModel
        delegate: pathViewDelegate

        path: Path {
            startX: -mainCarousel.width*0.5
            startY: mainCarousel.height/2

            PathLine { x: mainCarousel.width*0.5; y: mainCarousel.height/2 }
            PathLine { x: mainCarousel.width*(mainCarousel.count-0.5); y: mainCarousel.height/2 }
        }
    }
}

Итак, когда я пытаюсь реализовать функцию с mainCarousel.currentItem.intoView (), он анимирует вырезанный элементза кадромЯ знаю, что нет способа сделать «currentItem + 1», но есть ли какой-то другой обходной путь?

РЕДАКТИРОВАТЬ: Полный пример кода

ListModel {
    id: pathViewModel
    ListElement {header: "text 1"}
    ListElement {header: "text 2"}
    ListElement {header: "text 3"}
    ListElement {header: "text 4"}
}
Component {
    id: pathViewDelegate

    Item {
        width: mainCarousel.width
        height: mainCarousel.height

        Text {
            color: "red"
            text: header
        }

        function runAnimation() {
            myAnimation.start()
        }

        SequentialAnimation {
            id: myAnimation
            PropertyAnimation {property: "color"; to: "green"; duration: 1000}
            PropertyAnimation {property: "color"; to: "yellow"; duration: 1000}
            PropertyAnimation {property: "color"; to: "purple"; duration: 1000}
        }
    }
}
PathView {
    id: mainCarousel
    width: 500
    height: 500

    interactive: false
    highlightMoveDuration: 300

    clip: true

    model: pathViewModel
    delegate: pathViewDelegate

    path: Path {
        startX: -mainCarousel.width*0.5
        startY: mainCarousel.height/2

        PathLine { x: mainCarousel.width*0.5; y: mainCarousel.height/2 }
        PathLine { x: mainCarousel.width*(mainCarousel.count-0.5); y: mainCarousel.height/2 }
    }
}
MouseArea {
    id: telltaleMouseArea
    anchors.fill: mainCarousel
    onClicked: {
        mainCarousel.incrementCurrentIndex()
        mainCarousel.currentItem.runAnimation()
    }
}

Первоначальный отображаемый элемент «текст2" .Текущий элемент это «текст 1», изначально.В коде, когда MouseArea нажата, анимация «текст 2», но это за кадром.Я просто пытаюсь оживить видимый предмет, когда он становится видимым.

Answer 1

Измените анимацию на следующее:

Text {
    color: "red"
    text: header

    SequentialAnimation on color{
        id: myAnimation
        ColorAnimation {
            to: "green"
            duration: 1000
        }
        ColorAnimation {
            to: "yellow"
            duration: 1000
        }
        ColorAnimation {
            to: "purple"
            duration: 1000
        }
    }
} 

и убедитесь, что ваш currentItem находится в поле зрения: startX: mainCarousel.width*0.5