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

Question

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

例如：

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 14=]。我该如何继续？

Answer 1

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

在你的情况下，你需要删除 on color 部分，然后给动画一个 id: yourAnimation，然后在按钮上单击 yourAnimation.start()

其实好像on color也是可以的，跳过设置target:

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

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

How to trigger Animation on one Item in a ListView

qt

listview

qml

qtquick2