QT Stacked Widget实现表格翻页

QT Stacked Widget实现表格翻页

需求：表格中的每一项都可被点击，下方有翻页按钮。可统计所有表单中被点击的项。

思路：根据Stacked Widget中的setCurrentIndex实现页的切换。根据表中项的数量确定有多少页，每一页创建一个空白的Widget，加入对应的QPushButton数量并移动到相应位置。然后将Widget加入到Stacked Widget中。

mainwindow.h代码

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    QWidget *nowpage = nullptr;
};
#endif // MAINWINDOW_H

mainwindow.cpp代码

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include <QPushButton>
#include <QDebug>
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //模拟表单项的数量
    int num = 40;
    //清空QStackedWidget
    for(int i = ui->stackedWidget->count(); i >= 0; i--)

    {
        QWidget* widget = ui->stackedWidget->widget(i);
        ui->stackedWidget->removeWidget(widget);
        widget->deleteLater();
    }

    //加入按钮
    for(int i = 1; i <= num; i++)
    {
        //每页10个按钮
        if((i-1) % 10 == 0)
        {
            QWidget *widget = new QWidget(ui->stackedWidget);
            ui->stackedWidget->addWidget(widget);
            nowpage = widget;
        }
        //加入按钮
        QPushButton *btn = new QPushButton(nowpage);
        btn->setFixedSize(320,50);
        if(i % 2 != 0)
        {
            btn->move(0,(i%10/2)*50+50);
        }else
        {
            btn->move(440,(i%10/2)*50+50);
        }
        //设置点击事件
        connect(btn,&QPushButton::clicked,[=](){
            if(btn->toolTipDuration() == -1)
            {
                btn->setText("勾选");
                btn->setToolTipDuration(0);
            }else
            {
                btn->setText("取消勾选");
                btn->setToolTipDuration(-1);
            }
        });
    }
    ui->stackedWidget->setCurrentIndex(0);
    //上一页 可用转到槽写这里为了方便运行
    connect(ui->pageUp,&QPushButton::clicked,[=](){
        if(ui->stackedWidget->currentIndex()!=0)
        {
            ui->stackedWidget->setCurrentIndex(ui->stackedWidget->currentIndex()-1);
        }
        ui->label->setText(QString::number(ui->stackedWidget->currentIndex()+1)+"/"+QString::number(ui->stackedWidget->count()));
    });

    //下一页
    connect(ui->pageDown,&QPushButton::clicked,[=](){
        if(ui->stackedWidget->currentIndex()!=ui->stackedWidget->count()-1)
        {
            ui->stackedWidget->setCurrentIndex(ui->stackedWidget->currentIndex()+1);
        }
        ui->label->setText(QString::number(ui->stackedWidget->currentIndex()+1)+"/"+QString::number(ui->stackedWidget->count()));
    });

    //统计被点击的按钮
    connect(ui->count,&QPushButton::clicked,[=](){
        int num = 0;
        for (int i = 0; i < ui->stackedWidget->count(); i++) {
            QWidget* widget = ui->stackedWidget->widget(i);
            QList<QPushButton*> btns = widget->findChildren<QPushButton*>();
            for(auto btn : btns)
            {
                if(btn->toolTipDuration() == 0)
                    num++;
            }
        ui->label_2->setText("数量："+QString::number(num));
        }
    });

    ui->label->setText(QString::number(1)+"/"+QString::number(ui->stackedWidget->count()));
}

MainWindow::~MainWindow()
{
    delete ui;
}

运行截图

后续可添加翻页效果————采用lable设置grab()当前页后的图片罩住Stacked Widget。Stacked Widget移到左侧或右侧遮掩处然后设置分别左右移动动画，然后用动画组执行（或者底部用QscollArea，这样可以实现手机滑动的效果，但难度稍大，且需要考虑不完全翻页的情况）。