qt分页组件

---

前言

最近使用qt搭建项目框架，其中有列表页面，需要使用到分页，在网上查询到相关代码，结合自己的需求进行了一些修改，实现效果如下：

---

实现步骤

1.页面布局

• 1、在需要显示分页组件的地方，添加QWidget，

• 2、进行水平布局

• 3、在QWidget中加入如下样式：

QPushButton{border:1px solid #eeeeee;background:#ffffff;border-radius:5px;font-family:"Microsoft YaHei";font-size:13px;}
QPushButton:hover{background: #01048a;color:#ffffff}
QPushButton[currentPage="true"]{background: #01048a;color:#ffffff;border-radius:5px;}
QLabel{font-family:"Microsoft YaHei";font-size:13px;}
QLineEdit{border-radius:5px;border:1px solid #eeeeee;font-family:"Microsoft YaHei";font-size:13px;}

上述演示可以根据自己的需要进行修改

2. 引入分页类，并添加如下代码

• 在头文件中引入分页类，分页类：点击下载

#include "utils/pagecontrol.h"

• 在头文件中声明

private slots:
    void pageNumberChange(int pageNum);
    
private:
    PageControl* m_pageControl;

• 在cpp中添加如下代码

SysUser::SysUser(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::SysUser)
{
    ui->setupUi(this);
    
    m_pageControl = new PageControl();

    delete ui->pageWidget->layout();
    ui->pageWidget->setLayout(m_pageControl->getPageHLayout());
    m_pageControl->initPage(200);
    m_pageControl->setCurrentPage(1);

    connect(m_pageControl, m_pageControl->pageChanged, this, this->pageNumberChange);

}

SysUser::~SysUser()
{
    qDebug() << "释放SysUser";
    disconnect(m_pageControl, m_pageControl->pageChanged, this, this->pageNumberChange);
    delete ui;
    delete m_pageControl;
}

void SysUser::pageNumberChange(int pageNum)
{	
	// 点击页码事件
    qDebug() << "点击页码事件：pageNumber:" << pageNum;
}

---

3. 点击页码效果

单机页码效果图如下：