如何将 QListView 滑到最后并从头开始？

编程问答 2022-05-27

问题描述

我正在处理一个通过 API 获取新闻的项目。我可以清楚地从 api 获取消息并将它们加载到列表视图中。

为了清楚地说明我的问题，我简化了代码。 这里有两个问题...

1 - 我需要在给定的时间内将这个列表从顶部滑动到底部基本滑动动画。 （例如，y 从 0 到列表中的 5 秒）。重要的一点是列表的项目数是可以改变的。

2 - 当动画到达列表末尾时，我需要看到最后一项之后的第一项。但它必须是这样的；在列表的最后一项之后，第一项必须在滑动过程中显示（如无限列表）。

这是我的代码；

ma​​in.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QDebug>
#include <QQmlContext>

int main(int argc,char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

    QGuiApplication app(argc,argv);

    QStringList news = {    "news01","news02","news03","news04","news05","news06","news07","news08","news09","news10","news11","news12","news13","news14","news15","news16","news17","news18","news19",};

    QQmlApplicationEngine engine;
    engine.rootContext()->setContextProperty("listNews",news);

    const QUrl url(QStringLiteral("qrc:/main.qml"));
    QObject::connect(&engine,&QQmlApplicationEngine::objectCreated,&app,[url](QObject *obj,const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    },Qt::QueuedConnection);
    engine.load(url);

    return app.exec();
}

ma​​in.qml

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.0
import QtGraphicalEffects 1.0
import QtQuick.Layouts 1.3

Window {
    id:pencere
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    color: "black"

    ListView{
        id: newsListView
        implicitWidth: parent.width
        implicitHeight: parent.height
        model:listNews

        spacing: 5

        delegate: Rectangle {
            id: delegateBackground
            color:"#505051"
            radius: 10
            width: parent.width
            height: contentContainer.height + 20

            Item {
                id: contentContainer
                width: parent.width - 20
                height: column.height
                anchors.centerIn: delegateBackground

                RowLayout {
                    width: parent.width

                    Rectangle {
                        id: newsicon
                        width: 16
                        height: 16
                        color: "steelblue"
                        Layout.alignment: Qt.AlignTop
                    }

                    ColumnLayout {
                        id: column
                        Layout.fillWidth: true
                        spacing: 100

                        Text {
                            Layout.fillWidth: true
                            Layout.alignment: Qt.AlignBottom
                            id: messageText
                            text: modelData
                            wrapMode: TextEdit.WordWrap
                            verticalAlignment: index %2 == 0 ? Text.AlignBottom : Text.AlignTop
                            color: "white"
                        }
                    }
                }
            }
        }
    }
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

qlistviewqmlqtqt-quick