题目:模仿QQ做登录、注册界面
版本:Qt5
目录
一、效果
1.登录界面
2.注册界面
二、部分功能介绍
1.小眼睛
鼠标放上去:
鼠标移动开:
2.验证码
点击可变化
3.复选框
这边主要用到QCheckBox来进行实现
#include <QCheckBox>
以上功能文末附相关参考文章
三、源代码展示
1.登录界面代码
源代码:.cpp
#include "widget.h"
#include "indexwidget.h"
#include <QMessageBox>
#include "RegisterWidget.h"
#include "DB_Operation.h"
#include <QByteArray>
#include <QCryptographicHash>
#include <QDebug>
Widget::Widget(QWidget *parent)
: QWidget(parent)
{
this->resize(QSize(748,600));
QValidator * input=new QIntValidator(100,1000000,this);
//设置窗口的标题
this->setWindowTitle("登录界面");
//设置窗口的起始位置和大小
this->setFixedSize(800,600);
//设置窗口左上角的图标
this->setWindowIcon(QIcon(QPixmap(":/image/qq登录.png")));
//账号编辑框
this->EdtAC=new QLineEdit(this);
this->EdtAC->setGeometry(285,270,300,50);
this->EdtAC->setPlaceholderText("请输入账号");
this->EdtAC->setValidator(input);
//密码编辑框
this->EdtPW =new QLineEdit(this);
this->EdtPW->setGeometry(285,350,300,50);
this->EdtPW->setPlaceholderText("请输入密码");
this->EdtPW->setValidator(input);
this->EdtPW->setEchoMode(QLineEdit::Password);
/*
//验证码编辑框
this->EdtYZ =new QLineEdit(this);
this->EdtYZ->setGeometry(305,505,150,50);
this->EdtYZ->setPlaceholderText("请输入验证码");
this->EdtYZ->setValidator(input);
*/
//小眼睛
this->eye = new QLabel(this);
this->eye->setAlignment(Qt::AlignCenter);
this->eye->setPixmap(QPixmap(":/image/眼睛.png"));
this->eye->setGeometry(540,360,30,30);
this->eye->installEventFilter(this);
//复选框
pRemember_CheckBox = new QCheckBox(this);
pRemember_CheckBox->setGeometry(185,430,120,40);
pRemember_CheckBox->setText(QStringLiteral("自动登录"));
pAutoLogin_CheckBox = new QCheckBox(this);
pAutoLogin_CheckBox->setGeometry(345,430,120,40);
pAutoLogin_CheckBox->setText(QStringLiteral("记住密码"));
//标签:
//账号标签
this->LblAC=new QLabel("账号:",this);
this->LblAC->setGeometry(220,270,100,50);
//密码标签
this->LblPW=new QLabel("密码:",this);
this->LblPW->setGeometry(220,350,100,50);
/*
//验证码标签
this->LblYZ=new QLabel("验证码:",this);
this->LblYZ->setGeometry(220,510,100,50);
*/
//登录按钮
this->BtnLogin=new QPushButton("登陆",this);
this->BtnLogin->setStyleSheet("background-color:DeepSkyBlue");
this->BtnLogin->setGeometry(185,505,400,65);
//注册按钮
this->BtnRegister=new QPushButton("注册账号",this);
this->BtnRegister->setGeometry(30,550,100,40);
this->BtnRegister->setFlat(true);//(无外框按钮)
//找回密码按钮
this->BtnBack=new QPushButton("找回密码",this);
this->BtnBack->setGeometry(500,430,100,40);
this->BtnBack->setFlat(true);//(无外框按钮)
/*
//验证码
this->yanzhenma=new Verification(this);
this->yanzhenma->setGeometry(480,505,100,40);
*/
connect(this->BtnLogin,SIGNAL(clicked(bool)),this,SLOT(gotoLogining()));
connect(this->BtnRegister,SIGNAL(clicked(bool)),this,SLOT(gotoRegister()));
}
Widget::~Widget()
{
delete this->BtnLogin;
delete this->BtnRegister;
delete this->EdtAC;
delete this->EdtPW;
delete this->EdtYZ;
delete this->LblAC;
delete this->LblPW;
delete this->LblYZ;
}
void Widget::paintEvent(QPaintEvent *)
{
QPainter painter(this);
QPixmap pix;
//背景设置
painter.drawPixmap(0,0,width(),height(), QPixmap(":/image/米色背景.png"));
//图标
pix.load(":/image/视频.png");
painter.drawPixmap(185,285,20,20,pix);
pix.load(":/image/锁.png");
painter.drawPixmap(185,365,20,20,pix);
/*
pix.load(":/image/验证.png");
painter.drawPixmap(185,525,20,20,pix);
*/
pix.load(":/image/背景.png");
painter.drawPixmap(25,15,753,205,pix);
}
void Widget::gotoLogining()
{
QString AC=this->EdtAC->text();
QString PW=this->EdtPW->text();
char* ac=const_cast<char *>(AC.toStdString().c_str());
QString MD5;
QByteArray str;
str=QCryptographicHash::hash(PW.toLatin1(),QCryptographicHash::Md5);
MD5.append(str.toHex());
char *pw=const_cast<char *>(MD5.toStdString().c_str());
if(DB_Operation::LonginDB(ac,pw))
{
IndexWidget * idwg =new IndexWidget;
idwg->show();
this->hide();
}
else
{
QMessageBox::information(this,"登录失败","账号或者密码不正确");
}
/*
qDebug()<<QData::UserMap.count(AC);
if(QData::UserMap.count(AC))//若不存在此账号,则结束
{
if(!QString::compare(QData::UserMap.value(AC).PW,PW))
{
IndexWidget * idwg =new IndexWidget;
idwg->show();
this->hide();
}
else
{
QMessageBox::information(this,"登录失败","密码错误");
}
}
else
{
QMessageBox::information(this,"登录失败","不存在此账号");
}
*/
}
void Widget::gotoRegister()
{
RegisterWidget * rgtwg = new RegisterWidget;
rgtwg->show();
this->hide();
}
bool Widget::eventFilter(QObject *watched, QEvent *event)
{
switch (event->type()) {
case QEvent::Enter:
EdtPW->setEchoMode(QLineEdit::Normal); //显示密码
break;
case QEvent::Leave:
EdtPW->setEchoMode(QLineEdit::Password);//隐藏密码
break;
default:
break;
}
return QWidget::eventFilter(watched, event);
}
源代码:.h
#ifndef WIDGET_H
#define WIDGET_H
#include <QLabel>
#include <QButtonGroup>
#include <QLineEdit>
#include <QPushButton>
#include <QWidget>
#include <QTextEdit>
#include <QPixmap>
#include <QPainter>
#include <QDebug>
#include "verification.h"
#include <QEvent>
#include <QCheckBox>
class Widget : public QWidget
{
Q_OBJECT
public:
Widget(QWidget *parent = 0);
~Widget();
QLabel * LblAC;
QLabel * LblYZ;
QLabel * eye;
QLabel * LblPW;
QLineEdit * EdtAC;
QLineEdit * EdtPW;
QLineEdit * EdtYZ;
QPushButton * BtnLogin;
QPushButton * BtnRegister;
QPushButton * BtnBack;
QCheckBox * pRemember_CheckBox;
QCheckBox * pAutoLogin_CheckBox;
Verification * yanzhenma;
protected:
void paintEvent(QPaintEvent *);
bool eventFilter(QObject *watched, QEvent *event);
public slots:
void gotoLogining();
void gotoRegister();
};
#endif // WIDGET_H
2.注册界面代码
源代码:.cpp
#include "RegisterWidget.h"
#include "widget.h"
#include "DB_Operation.h"
#include "indexwidget.h"
#include <QMessageBox>
#include <QCryptographicHash>
#include <QDebug>
#include <QIntValidator>
#include "SetupPage.h"
RegisterWidget::RegisterWidget(QWidget *parent) : QWidget(parent)
{
//this->resize(QSize(1500,600));
QValidator * input=new QIntValidator(100,1000000,this);
this->setWindowTitle("新用户注册");
this->setFixedSize(800,600);
//设置窗口左上角的图标
this->setWindowIcon(QIcon(QPixmap(":/image/icon-注册头像.png")));
this->LblAC=new QLabel("用户账号:",this);
this->LblAC->setGeometry(100,100,100,50);
this->LblPW=new QLabel("登录密码:",this);
this->LblPW->setGeometry(100,180,100,50);
this->LblPW2=new QLabel("确认密码:",this);
this->LblPW2->setGeometry(100,260,200,50);
//验证码标签
this->LblYZ=new QLabel("验证码:",this);
this->LblYZ->setGeometry(100,340,100,50);
this->EdtAC=new QLineEdit(this);
this->EdtAC->setGeometry(270,100,400,50);
this->EdtAC->setPlaceholderText("请输入账号 (3~10位以内数字)");
this->EdtAC->setValidator(input);
this->EdtPW=new QLineEdit(this);
this->EdtPW->setGeometry(270,180,400,50);
this->EdtPW->setEchoMode(QLineEdit::Password);
this->EdtPW->setPlaceholderText("请输入密码 (内容为3~6位数字)");
this->EdtPW->setValidator(input);
this->EdtPW2=new QLineEdit(this);
this->EdtPW2->setGeometry(270,260,400,50);
this->EdtPW2->setPlaceholderText("请再次输入密码");
this->EdtPW2->setEchoMode(QLineEdit::Password);
this->EdtPW2->setValidator(input);
//验证码编辑框
this->EdtYZ =new QLineEdit(this);
this->EdtYZ->setGeometry(270,340,250,50);
this->EdtYZ->setPlaceholderText("请输入验证码");
this->EdtYZ->setValidator(input);
//验证码
this->yanzhenma=new Verification(this);
this->yanzhenma->setGeometry(555,340,100,50);
this->BtnLogin=new QPushButton("注册并登陆",this);
this->BtnLogin->setGeometry(180,450,200,80);
this->returnLogin=new QPushButton("返回登陆页面",this);
this->returnLogin->setGeometry(400,450,200,80);
connect(this->BtnLogin,SIGNAL(clicked(bool)),this,SLOT(RegistertoLogin()));
connect(this->returnLogin,SIGNAL(clicked(bool)),this,SLOT(gotoLogining()));
}
RegisterWidget::~RegisterWidget()
{
}
void RegisterWidget::paintEvent(QPaintEvent *)
{
QPainter painter(this);
QPixmap pix;
//背景设置
painter.drawPixmap(0,0,width(),height(), QPixmap(":/image/蓝色背景2.png"));
pix.load(":/image/像素-蜜蜂-01.png");
painter.drawPixmap(60,110,30,30,pix);
pix.load(":/image/像素-蜜蜂-01.png");
painter.drawPixmap(60,190,30,30,pix);
pix.load(":/image/像素-蜜蜂-01.png");
painter.drawPixmap(60,270,30,30,pix);
pix.load(":/image/像素-蜜蜂-01.png");
painter.drawPixmap(60,350,30,30,pix);
}
void RegisterWidget::gotoLogining()
{
Widget * login= new Widget;
login->show();
this->hide();
}
void RegisterWidget::RegistertoLogin()
{
QString AC=this->EdtAC->text();
QString PW=this->EdtPW->text();
QString PW2=this->EdtPW2->text();
if(AC.length()<3 || PW.length()<3)
{
QMessageBox::information(this,"注册失败","输入的账号或密码不符合要求");
}
else if(PW==PW2)
{
char * ac=const_cast<char *>(AC.toStdString().c_str());
QString PWMD5;
QString passWd=PW;
QByteArray str;
str = QCryptographicHash::hash(passWd.toLatin1(),QCryptographicHash::Md5);
PWMD5.append(str.toHex());
char * pw=const_cast<char *>(PWMD5.toStdString().c_str());
qDebug()<<"在注册页面中"<<pw;
if(DB_Operation::RegisterDB(ac,pw))
{
//注册成功并登陆
QMessageBox::information(this,"注册成功","正在为您登录...");
DB_Operation::LonginDB(ac,pw);
SetupPage * idwg =new SetupPage;
idwg->show();
this->hide();
}
else
{
QMessageBox::information(this,"注册失败","已存在此账号");
}
}
else
{
QMessageBox::information(this,"注册失败","两次密码输入不一致");
}
}
源代码:.h
#ifndef REGISTERWIDGET_H
#define REGISTERWIDGET_H
#include <QObject>
#include <QWidget>
#include <QLabel>
#include <QButtonGroup>
#include <QLineEdit>
#include <QPushButton>
#include <QTextEdit>
#include <QPixmap>
#include <QPainter>
#include <QDebug>
#include <QValidator>
#include "verification.h"
class RegisterWidget : public QWidget
{
Q_OBJECT
public:
RegisterWidget(QWidget *parent = 0);
~RegisterWidget();
QLabel * LblAC;//账号标签
QLineEdit * EdtAC;//账号编辑框
QLabel * LblPW,*LblYZ;//密码标签
QLineEdit * EdtPW;//密码编辑框
QLabel * LblPW2;//再次输入密码标签
QLineEdit * EdtPW2 ,* EdtYZ;//再次输入密码编辑框
QPushButton * BtnLogin;//注册并登陆
QPushButton * returnLogin;//返回登陆页面
Verification * yanzhenma;
protected:
void paintEvent(QPaintEvent *);
public slots:
void gotoLogining();
void RegistertoLogin();
};
class Validato:public QValidator
{
};
#endif // REGISTERWIDGET_H