前言
最近使用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. 点击页码效果
单机页码效果图如下: