qt - QML ListView填充动画不起作用

Question

我有一个 C++ 模型QAbstractListModel，我在 QML 中使用它ListView

ListView {
    id: listView
    populate: Transition {
        id: addTrans
        SequentialAnimation {
            PauseAnimation {
                duration: (addTrans.ViewTransition.index -
                           addTrans.ViewTransition.targetIndexes[0]) * 100
            }
            NumberAnimation { property: "scale"; from: 0; to: 1 }
        }
    }

    anchors.fill: parent
    delegate: listDelegate
    model: newsModel
}

我尝试为填充列表时添加动画，但它不起作用。所以我所做的是我尝试更改populate为add并触发动画，但是问题是动画开始时每个项目都已经在列表中：换句话说，不是有一个添加项目的空列表，我有一个完整的元素列表，然后单独动画。我也尝试过遵循这个建议，但它不起作用。

编辑：根据要求，我提供了一个最小的工作示例来重现我的问题。该问题可以通过以下方式重现：

#include <QObject>
#include <QQmlObjectListModel.h>

class Item : public QObject{
    Q_OBJECT
    Q_PROPERTY(QString name READ name NOTIFY nameChanged)

public:
    Item(QObject* parent = nullptr): QObject(parent)
    {
    }
    QString name() const{
        return mName;
    }
    void setName(QString const &name){
        if(mName != name){
            mName = name;
            emit nameChanged();
        }
    }
signals:
    void nameChanged();
private:
    QString mName;
};

class DataManager : public QObject{
    Q_OBJECT
    Q_PROPERTY(QQmlObjectListModel<Item>* itemsModel READ itemsModel CONSTANT)
public:
    DataManager(){
        mItemsModel = new QQmlObjectListModel<Item>(this);
        qRegisterMetaType<QQmlObjectListModel<Item>*>("QQmlObjectListModel<Item>*");
        // I have also tried to add items from here, but the result is even worse
//        for(int i = 0; i < 20; i++){
//            addItem(QString::number(i));
//        }
    }
    QQmlObjectListModel<Item>* itemsModel(){
        return mItemsModel;
    }
    Q_INVOKABLE void addItem(QString const &name){
        Item* item = new Item(mItemsModel);
        item->setName(name);
        mItemsModel->append(item);
    }
private:
    QQmlObjectListModel<Item>* mItemsModel;
};

然后在qml中：

import QtQuick 2.12
import QtQuick.Controls 2.5

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Scroll")

    ScrollView {
        anchors.fill: parent

        ListView {
            width: parent.width
// dataManager is a context property set via c++
            model: dataManager.itemsModel
            populate: Transition {
                id: popTrans
                SequentialAnimation {
                    PauseAnimation {
                        duration: (popTrans.ViewTransition.index -
                                   popTrans.ViewTransition.targetIndexes[0]) * 100
                    }
                    NumberAnimation { property: "scale"; from: 0; to: 1 }
                }
            }
            add: Transition {
                id: addTrans
                SequentialAnimation {
                    PauseAnimation {
                        duration: (addTrans.ViewTransition.index -
                                   addTrans.ViewTransition.targetIndexes[0]) * 100
                    }
                    NumberAnimation { property: "scale"; from: 0; to: 1 }
                }
            }
            delegate: ItemDelegate {
                text: "Item" + name
                width: parent.width
            }
        }
    }
    Component.onCompleted: {
        var p;
        for(p=0; p < 20; p++){
            dataManager.addItem(p)
        }
    }
}

这是我从这里QQmlObjectListModel借来的助手类

标签： qtlistviewqml

Answer 1

我不确定您到底想要什么，但我希望我的代码对您有所帮助。

    populate: Transition {
        id: addTrans
        SequentialAnimation {
            PropertyAction {
                property: "visible"
                value: false
            }
            PauseAnimation {
                duration: (addTrans.ViewTransition.index -
                           addTrans.ViewTransition.targetIndexes[0]) * 100
            }
            PropertyAction {
                property: "visible"
                value: true
            }
            NumberAnimation { property: "scale"; from: 0; to: 1 }
        }
    }