Question

我尝试在SequentialAnimation的给定Item上触发ListView。

例如：

ApplicationWindow {
    id: window
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    ListModel {
        id: modelList
        ListElement {}
        ListElement {}
        ListElement {}
    }

    ListView {
        width: window.width
        height: window.height

        model: modelList
        delegate: Rectangle {
            width: window.width
            height: window.height/10
            color: "red"
            radius : 10
            SequentialAnimation on color { //Should be only triggered when button clicked
                ColorAnimation { to: "yellow"; duration: 1000 }
                ColorAnimation { to: "red"; duration: 1000 }
            }

            Button {
                text: "trigger animation"
                anchors{
                    right: parent.right
                    top: parent.top
                    bottom: parent.bottom
                    margins: 10
                }

                onClicked: {
                    //Trigger SequentialAnimation
                }
            }
        }
    }
}

我点击按钮时尝试触发Animation ，但我不知道如何在condition上使用Animation 。我该怎么办？

Answer 1

仅当您希望更改自动设置动画时才使用动画on property。

在您的情况下，您需要删除on color部分，然后为动画添加id: yourAnimation，然后点击按钮yourAnimation.start()

实际上，似乎on color也是可能的，跳过设定目标：

SequentialAnimation on color {
  id: yourAnimation
  ColorAnimation { to: "yellow"; duration: 1000 }
  ColorAnimation { to: "red"; duration: 1000 }
  running: false
}

如何在ListView中的一个项目上触发动画

1 个答案: