リストビュー内の1つのアイテムでアニメーションをトリガーする方法

Question

SequentialAnimationをListViewという特定のItemにトリガーしようとしました。例えば

は：

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をトリガーしようとするが、私はAnimationにconditionを使用する方法がわかりません。 どうすればいいですか？

Answer 1

アニメーションon propertyは、変更を自動的にアニメーション化する場合にのみ使用します。あなたがアニメーションにid: yourAnimationを与え、その後、on color一部を除去し、ボタンをyourAnimation.start()

をクリックする必要があり、あなたの場合は

は実際には、目標を設定飛ばし、on colorも可能であると思われる：

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