QT实现列表通过向上向下翻页按钮翻页，以及上下键逐行显示文本行，向左向右键翻页功能

概述

效果

本篇文章的主旨如下：
在窗口中显示一个列表，通过点击界面上的向上翻页按钮和向下翻页按钮，进行翻页，点击键盘上的向上、向下按键实现逐行向上、向下移动选中项，点击向左按键和向右按键实现向前翻页和向后翻页，但向后翻页到最后一页时，若最后一页不够可显示的行数，则从最后一行向前显示，使最后一页显示时不留空行。
本文只要记录上述功能如何实现。

效果

程序运行的效果如下：

qt实现列表翻页，逐行显示功能

编译环境

在ubuntu下QtCreator4.11.0。

代码实现

这里主要附上该窗口实现的类代码。

mylistwidget.h

cpp 复制代码

#ifndef MYLISTWIDGET_H
#define MYLISTWIDGET_H

#include <QObject>
#include <QWidget>
#include <QListWidget>

class MyListWidget : public QWidget
{
    Q_OBJECT
public:
    explicit MyListWidget(QWidget *parent = nullptr);

signals:
private:
    void initInterface();
    void updateVisibleItems();
protected:
    void keyPressEvent(QKeyEvent *event) override;
private slots:
    void slotUpPage();
    void slotDownPage();
private:
    QListWidget *listWidget;
    int currentPageStart = 0; // 当前页开始的索引
};

#endif // MYLISTWIDGET_H

mylistwidget.cpp

cpp 复制代码

#include "mylistwidget.h"

#include <QKeyEvent>
#include <QListWidgetItem>
#include <QPushButton>
#include <QVBoxLayout>

MyListWidget::MyListWidget(QWidget *parent) : QWidget(parent)
{
    initInterface();
}

void MyListWidget::initInterface()
{
    auto *layout = new QVBoxLayout(this);

    listWidget = new QListWidget(this);

    // 填充一些示例数据
    for (int i = 0; i < 13; ++i) {
        QListWidgetItem *item = new QListWidgetItem(QString("项 %1").arg(i + 1));
        listWidget->addItem(item);
    }

    // 初始显示前5项
    currentPageStart = 0;
    updateVisibleItems();
    auto *prevPageButton = new QPushButton("向上翻页", this);
    auto *nextPageButton = new QPushButton("向下翻页", this);

    layout->addWidget(listWidget);
    layout->addWidget(prevPageButton);
    layout->addWidget(nextPageButton);

    connect(prevPageButton,&QPushButton::clicked,this,&MyListWidget::slotUpPage);
    connect(nextPageButton,&QPushButton::clicked,this,&MyListWidget::slotDownPage);
    // 设置焦点策略以便接收键盘事件
    setFocusPolicy(Qt::StrongFocus);
}

void MyListWidget::updateVisibleItems()
{
    // 隐藏所有项
    for (int i = 0; i < listWidget->count(); ++i) {
        listWidget->item(i)->setHidden(true);
    }

    // 显示当前页的项
    for (int i = 0; i < 5 && currentPageStart + i < listWidget->count(); ++i) {
        listWidget->item(currentPageStart + i)->setHidden(false);
    }

    // 确保滚动到可见项
    listWidget->scrollToItem(listWidget->item(currentPageStart));
}

void MyListWidget::keyPressEvent(QKeyEvent *event)
{
    switch (event->key()) {
    case Qt::Key_Up:
    {
        if (currentPageStart > 0) {
            currentPageStart--;
            updateVisibleItems();
        }
    }
        break;
    case Qt::Key_Down:
    {
        if (currentPageStart + 4 < listWidget->count()) { // 假设每页显示5项，但最后一页可能不足5项
            currentPageStart++;
            updateVisibleItems();
        }
    }
        break;
    case Qt::Key_Left: // 向上翻页
     {
        if(currentPageStart - 5 >= 0){
            currentPageStart -= 5;
        }else{
            currentPageStart = 0;
        }
        updateVisibleItems();
     }
        break;
    case Qt::Key_Right: // 向下翻页
    {
        int totalPages = 0;
        if(listWidget->count()%5){
            totalPages = listWidget->count() / 5 + 1;
        }


        if(currentPageStart/5*5 +currentPageStart+ 5 >= listWidget->count()){
            currentPageStart = listWidget->count() -5;
        }else{
             currentPageStart += 5;
        }
        updateVisibleItems();
    }
        break;
    default:
        QWidget::keyPressEvent(event);
    }
}

void MyListWidget::slotUpPage()//向上翻页
{
    if(currentPageStart-5 <= 0){
        currentPageStart = 0;
    }else{
        currentPageStart -= 5;
    }
    updateVisibleItems();
}

void MyListWidget::slotDownPage()//向下翻页
{

    if(currentPageStart + 5 >= listWidget->count()){
        return ;
    }else{
        currentPageStart +=5;
    }
    updateVisibleItems();
}

main.cpp

cpp 复制代码

#include "mylistwidget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MyListWidget widget;
    widget.show();

    return a.exec();
}

运行效果

程序运行效果如文章开头的视频所示。

可以点击向上翻页和向下翻页按钮来翻页，点击向上向下按键逐行选中显示，到最后一页时会调整所显示的行占满整个规定的行。

备注

此程序写的时间距离编写这篇文章较早，可能会有一些瑕疵。