ListView 滚动动画 [英] ListView scrolling animation

问题描述

我想为 QML ListView 实现滚动动画.这是一个示例图像:

有人可以建议我实施这个吗?

I want to implement a scrolling animation for QML ListView. Here is a sample image:

Can anybody advise me for implementing this?

谢谢.

推荐答案

经过数小时的工作、研究和@BaCaRoZzo 的大力帮助(感谢@BaCaRoZzo)，我终于找到了正确的解决方案.只需使用 Component.onCompleted() 事件处理程序来运行与每个委托关联的动画.

After many hours of work, research and @BaCaRoZzo's great help (Thanks @BaCaRoZzo), I finally found the right solution. Just use Component.onCompleted() event handler to run the animation associated with each delegate.

这是一个例子，享受吧！

Here is an example, enjoy!

import QtQuick 2.3

ListView {
    anchors.fill: parent
    id: list
    model: 100
    cacheBuffer: 50

    delegate: Rectangle {
        id: itemDelegate
        Component.onCompleted: showAnim.start();
        transform: Rotation { id:rt; origin.x: width; origin.y: height; axis { x: 0.3; y: 1; z: 0 } angle: 0}//     <--- I like this one more!
        width: parent.width
        height: 50
        color: index % 2 === 0 ? "#EEE" : "#DDD"
        SequentialAnimation {
            id: showAnim
            running: false
            RotationAnimation { target: rt; from: 180; to: 0; duration: 800; easing.type: Easing.OutBack; property: "angle" }
        }
    }
}

这篇关于ListView 滚动动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！