QT 自定义随机验证码校验

发布时间:2026/7/10 6:46:27
QT 自定义随机验证码校验 QT实现随机验证码校验废话不多说直接先来上效果刚开始一看觉得实现起来可能会比较麻烦但是实际操作过程很简单下面来看来具体的实现操作吧具体实现1.首先我这里是一个弹窗的校验效果所以第一时间想到的是创建一个QDialogVerifyCodeDialog.h#ifndefVERIFYCODEDIALOG_H#defineVERIFYCODEDIALOG_H#includeQDialog#includeQPushButton#includeQLineEdit#includeQLabel#includeQRandomGenerator#includeQHBoxLayout#includeQVBoxLayout#includeQMessageBox#includecodelabel.hclassVerifyCodeDialog:publicQDialog{Q_OBJECTpublic:explicitVerifyCodeDialog(QWidget*parentnullptr);// 获取用户输入的验证码QStringgetInputCode()const;private:// 生成4位随机数字验证码voidgenerateCode();// 刷新验证码voidrefreshCode();// 校验验证码boolcheckCode();private:CodeLabel*m_labCode;// 展示验证码QLineEdit*m_editInput;// 用户输入框QString m_realCode;// 当前正确验证码};#endif// VERIFYCODEDIALOG_HVerifyCodeDialog.cpp#includeverifycodedialog.h#includeQPushButtonVerifyCodeDialog::VerifyCodeDialog(QWidget*parent):QDialog(parent){Qt::WindowFlags flagswindowFlags();flags~Qt::WindowContextHelpButtonHint;setWindowFlags(flags);setWindowTitle(QStringLiteral(请输入验证码));setFixedSize(320,160);setModal(true);m_labCodenewCodeLabel(this);// 样式表全部一行不换行拆分彻底杜绝常量换行报错m_labCode-setStyleSheet(font-size:26px; font-weight:bold; color:#0066cc; background:#f0f7ff; padding:6px 12px;);m_labCode-setFixedWidth(120);QPushButton*btnRefreshnewQPushButton(QStringLiteral(换一张),this);btnRefresh-setFixedWidth(80);m_editInputnewQLineEdit(this);m_editInput-setPlaceholderText(QStringLiteral(请输入4位数字验证码));m_editInput-setMaxLength(4);QPushButton*btnOknewQPushButton(QStringLiteral(确认),this);QPushButton*btnCancelnewQPushButton(QStringLiteral(取消),this);QHBoxLayout*layCodenewQHBoxLayout();layCode-addWidget(m_labCode);layCode-addWidget(btnRefresh);QHBoxLayout*layBtnnewQHBoxLayout();layBtn-addStretch();layBtn-addWidget(btnOk);layBtn-addWidget(btnCancel);QVBoxLayout*mainLaynewQVBoxLayout(this);mainLay-setContentsMargins(20,20,20,20);mainLay-setSpacing(16);mainLay-addLayout(layCode);mainLay-addWidget(m_editInput);mainLay-addLayout(layBtn);generateCode();connect(btnRefresh,QPushButton::clicked,this,VerifyCodeDialog::refreshCode);connect(btnCancel,QPushButton::clicked,this,QDialog::reject);connect(btnOk,QPushButton::clicked,this,[this](){if(checkCode()){accept();}});}voidVerifyCodeDialog::generateCode(){m_realCode.clear();constQString charsabcdefghijklmnopqrstuvwxyz0123456789;for(inti0;i4;i){intidxQRandomGenerator::global()-bounded(chars.size());m_realCodechars.at(idx);}m_labCode-setText(m_realCode);}voidVerifyCodeDialog::refreshCode(){m_labCode-clear();// 清空旧文字m_labCode-update();// 强制重绘清除残影generateCode();m_editInput-clear();}boolVerifyCodeDialog::checkCode(){QString inputm_editInput-text().trimmed();if(input.isEmpty()){QMessageBox::warning(this,提示,请输入验证码);returnfalse;}if(input.toLower()!m_realCode.toLower()){QMessageBox::warning(this,错误,验证码不正确请重新输入);refreshCode();returnfalse;}returntrue;}QStringVerifyCodeDialog::getInputCode()const{returnm_editInput-text().trimmed();}这样就实现了弹窗的效果并且显示换一张点击换一张按钮会再次随机生成内容我这里的内容范围是abcdefghijklmnopqrstuvwxyz0123456789数字和字母并且再点击确认的时候 校验部分大小写。那字母带横线去混淆是如何实现的呢刚开始我觉得这个可能会不好实现但是很简单.h文件中我引入了一个**#include “codelabel.h”** 这个就是实现的类具体代码如下#ifndefCODELABEL_H#defineCODELABEL_H#includeQLabel#includeQPainter#includeQRandomGeneratorclassCodeLabel:publicQLabel{public:explicitCodeLabel(QWidget*pnullptr):QLabel(p){}protected:voidpaintEvent(QPaintEvent*)override{QPainterp(this);p.fillRect(rect(),QColor(240,247,255));// 绘制干扰线for(inti0;i4;i){p.setPen(QPen(QColor(100,100,100),1));p.drawLine(QRandomGenerator::global()-bounded(width()),QRandomGenerator::global()-bounded(height()),QRandomGenerator::global()-bounded(width()),QRandomGenerator::global()-bounded(height()));}// 绘制验证码文字p.setPen(QColor(0,102,204));p.setFont(QFont(,26,QFont::Bold));p.drawText(rect(),Qt::AlignCenter,text());}};#endif// CODELABEL_H继承自QLabel 重写paintEvent绘制干扰线即可具体使用VerifyCodeDialog dlg;intretdlg.exec();if(retQDialog::Accepted){}else{}再使用的地方调用即可即可include.h哦欧克到这里就实现了 自定义随机验证码的功能了具体校验的内容可以自己定义 感谢观看