Qt软件开发文档8---登陆界面的绘制及其封装

1.登陆界面的绘制

绘制一个登陆界面很简单，直接上代码 signin.h

#ifndef SIGNIN_H #define SIGNIN_H #include <QDialog> #include <QMouseEvent> #include <QPixmap> #include <QVBoxLayout> #include <QStyle> #include <QPainter> #include <QPaintEvent> #include <QHBoxLayout> #include <QDebug> #include <QFrame> class SignIn : public QDialog { Q_OBJECT public: SignIn(QWidget *parent = 0); ~SignIn(); protected: void mousePressEvent(QMouseEvent *event); void mouseMoveEvent(QMouseEvent *event); void mouseReleaseEvent(QMouseEvent *event); private: bool mMoveing; QPoint mMovePosition; void initPage(); public slots: void btnSignInClicked(); void btnRegisterClicked(); void btnForgetClicked(); }; #endif // SIGNIN_H

.cpp

#include "signin.h" #include <QLabel> #include <QLineEdit> #include <QPushButton> #include <QCheckBox> SignIn::SignIn(QWidget *parent) : QDialog(parent) { mMoveing=false; setWindowFlags(Qt::FramelessWindowHint|Qt::WindowStaysOnTopHint);//无边框 隐藏Top栏 this->setFixedSize(660,393); this->setStyleSheet("border:1px solid #92C8E8; margin: 0,0,0,0;"); initPage(); } SignIn::~SignIn() { } void SignIn::initPage() { QVBoxLayout *mainLayout = new QVBoxLayout(this); mainLayout->setContentsMargins(0,0,0,0); QWidget *topWidget = new QWidget(this); topWidget->setStyleSheet("QWidget{border:1px solid #92C8E8; margin: 0px;background-color:white}" "QPushButton{border:0px;margin:0px;}" "QLabel{border:0px;margin:0px;}"); topWidget->setMaximumHeight(60); ////////////////////////////////////////////// /// \brief topHLayout ////////////////////////////////////////////// QHBoxLayout *topHLayout = new QHBoxLayout(this); QLabel *labelIcon = new QLabel(this); labelIcon->setPixmap(QPixmap(":/img/logo_xuanzhong.png")); labelIcon->setAlignment(Qt::AlignLeft|Qt::AlignVCenter); QPushButton *btnClose = new QPushButton(this); btnClose->setMaximumSize(20,20); btnClose->setIcon(QIcon(":/img/guanbi.png")); QPushButton *btnMin = new QPushButton(this); btnMin->setMaximumSize(20,20); btnMin->setIcon(QIcon(":/img/suoxiao.png")); topHLayout->addWidget(labelIcon); topHLayout->addWidget(btnMin); topHLayout->addWidget(btnClose); topWidget->setLayout(topHLayout); ////////////////////////////////////////////// /// \brief bottomWidget ////////////////////////////////////////////// QWidget *bottomWidget = new QWidget(this); bottomWidget->setContentsMargins(0,0,0,0); bottomWidget->setStyleSheet("border:1px solid #92C8E8; background-color:#D6EFFB;"); QVBoxLayout *bottomVLayout = new QVBoxLayout(bottomWidget); bottomVLayout->setAlignment(Qt::AlignCenter); QWidget *bottomCenterWidget = new QWidget(bottomWidget); bottomCenterWidget->setMaximumWidth(290); bottomCenterWidget->setMinimumHeight(250); bottomCenterWidget->setStyleSheet("QWidget{border:0px;}" "QLabel{color:#3F3A39;font-size:16px;font-family:楷体;}" "QLineEdit{border:1px solid #CBD2D5 ;height:32px;border-radius:6px;background:white;padding-left:5px;}" "QPushButton{border:0px;background:#F3A026;color:white;border-radius:6px;font-size:16px}"); QVBoxLayout *bottomCenterLayout = new QVBoxLayout(bottomCenterWidget); QHBoxLayout *userLayout = new QHBoxLayout(bottomCenterWidget); userLayout->setAlignment(Qt::AlignRight); QLabel *user = new QLabel(bottomCenterWidget); user->setText(QString::fromLocal8Bit("帐号")); user->setMaximumWidth(32); QLineEdit *userLine = new QLineEdit(bottomCenterWidget); userLine->setMaximumWidth(230); userLayout->addWidget(user); userLayout->addWidget(userLine); QHBoxLayout *pwdLayout = new QHBoxLayout(bottomCenterWidget); pwdLayout->setAlignment(Qt::AlignRight); QLabel *pwd = new QLabel(bottomCenterWidget); pwd->setText(QString::fromLocal8Bit("密码")); pwd->setMaximumWidth(32); QLineEdit *pwdLine = new QLineEdit(bottomCenterWidget); pwdLine->setMaximumWidth(230); pwdLayout->addWidget(pwd); pwdLayout->addWidget(pwdLine); QHBoxLayout *checkLayout = new QHBoxLayout(bottomCenterWidget); checkLayout->setAlignment(Qt::AlignJustify); QCheckBox *checkBox = new QCheckBox(bottomCenterWidget); QLabel *checkLabel = new QLabel(bottomCenterWidget); checkLabel->setText(QString::fromLocal8Bit("保存用户信息")); checkLabel->setMaximumHeight(20); checkLayout->addWidget(checkBox); checkLayout->addWidget(checkLabel); QHBoxLayout *signInLayout = new QHBoxLayout(bottomCenterWidget); signInLayout->setAlignment(Qt::AlignRight); QPushButton *btnSignIn = new QPushButton(bottomCenterWidget); btnSignIn->setChecked(false); btnSignIn->setMinimumSize(230,38); btnSignIn->setText(QString::fromLocal8Bit("登陆")); signInLayout->addWidget(btnSignIn); QHBoxLayout *restoreLayout = new QHBoxLayout(bottomCenterWidget); restoreLayout->setAlignment(Qt::AlignRight); QPushButton *btnRegister = new QPushButton(bottomCenterWidget); btnRegister->setText(QString::fromLocal8Bit("用户注册")); btnRegister->setStyleSheet("QPushButton{border:0;background-color:transparent;color:#3F3A39;font-size:14px}" "QPushButton:hover{color:#CBD2D5}"); QLabel *labelV = new QLabel(bottomCenterWidget); labelV->setText(tr("|")); QPushButton *btnForget = new QPushButton(bottomCenterWidget); btnForget->setText(QString::fromLocal8Bit("忘记密码?")); btnForget->setStyleSheet("QPushButton{border:0;background-color:transparent;color:#3F3A39;font-size:14px}" "QPushButton:hover{color:#CBD2D5;}"); restoreLayout->addWidget(btnRegister); restoreLayout->addWidget(labelV); restoreLayout->addWidget(btnForget); bottomCenterLayout->addLayout(userLayout); bottomCenterLayout->addLayout(pwdLayout); bottomCenterLayout->addLayout(checkLayout); bottomCenterLayout->addLayout(signInLayout); bottomCenterLayout->addLayout(restoreLayout); bottomVLayout->addWidget(bottomCenterWidget); bottomWidget->setLayout(bottomVLayout); ////////////////////////////////////////////// mainLayout->setSpacing(0); mainLayout->addWidget(topWidget); mainLayout->addWidget(bottomWidget); connect(btnClose,SIGNAL(clicked(bool)),this,SLOT(close())); connect(btnMin,SIGNAL(clicked(bool)),this,SLOT(lower())); connect(btnSignIn,SIGNAL(clicked(bool)),this,SLOT(btnSignInClicked())); connect(btnRegister,SIGNAL(clicked(bool)),this,SLOT(btnRegisterClicked())); connect(btnForget,SIGNAL(clicked(bool)),this,SLOT(btnForgetClicked())); } void SignIn::btnSignInClicked() { qDebug()<<"signIn btn clicked"; } void SignIn::btnRegisterClicked() { qDebug()<<"register btn clicked"; } void SignIn::btnForgetClicked() { qDebug()<<"forget btn clicked"; } //重写鼠标按下事件 void SignIn::mousePressEvent(QMouseEvent *event) { mMoveing = true; mMovePosition = event->globalPos() - pos(); } void SignIn::mouseMoveEvent(QMouseEvent *event) { if (mMoveing && (event->buttons() && Qt::LeftButton)) { move(event->globalPos()-mMovePosition); mMovePosition = event->globalPos() - pos(); } } void SignIn::mouseReleaseEvent(QMouseEvent *event) { mMoveing = false; }

绘制效果 不做太多介绍 现要求整体部分需要多次调用,如下：

这时候需要我们将这部分抽出来，作为一个公共函数,参见全局变量的声明(http://blog.csdn.net/me_badman/article/details/69524655) 在别的函数里调用。

2.函数声明

.exe路径 写一个publicsign 函数 ，声明如下

#ifndef PUBLICSIGNIN_H #define PUBLICSIGNIN_H #include <QPixmap> #include <QVBoxLayout> #include <QStyle> #include <QHBoxLayout> #include <QDebug> #include <QLabel> #include <QLineEdit> #include <QPushButton> #include <qcoreapplication.h> class PublicSignIn { public: PublicSignIn(); static void InitPage(QWidget *parent,QWidget *bottomWidget){ //获取到图片的路径 QString runPath = QCoreApplication::applicationDirPath(); QString iconPath = runPath + "/configure/icons/"; QVBoxLayout *mainLayout = new QVBoxLayout(parent); mainLayout->setContentsMargins(0,0,0,0); QWidget *topWidget = new QWidget(parent); topWidget->setStyleSheet("QWidget{border:1px solid #92C8E8; margin: 0px;background-color:white}" "QPushButton{border:0px;margin:0px;}" "QLabel{border:0px;margin:0px;}"); topWidget->setMaximumHeight(60); ////////////////////////////////////////////// /// \brief topHLayout ////////////////////////////////////////////// QHBoxLayout *topHLayout = new QHBoxLayout(parent); QLabel *labelIcon = new QLabel(parent); labelIcon->setPixmap(QPixmap(iconPath + "logo_xuanzhong.png")); labelIcon->setAlignment(Qt::AlignLeft|Qt::AlignVCenter); QPushButton *btnClose = new QPushButton(parent); btnClose->setMaximumSize(20,20); btnClose->setIcon(QIcon(iconPath + "guanbi.png")); QPushButton *btnMin = new QPushButton(parent); btnMin->setMaximumSize(20,20); btnMin->setIcon(QIcon(iconPath + "suoxiao.png")); topHLayout->addWidget(labelIcon); topHLayout->addWidget(btnMin); topHLayout->addWidget(btnClose); topWidget->setLayout(topHLayout); ////////////////////////////////////////////// /// \brief bottomWidget ////////////////////////////////////////////// bottomWidget->setContentsMargins(0,0,0,0); bottomWidget->setStyleSheet("border:1px solid #92C8E8; background-color:#D6EFFB;"); mainLayout->setSpacing(0); mainLayout->addWidget(topWidget); mainLayout->addWidget(bottomWidget); parent->connect(btnClose,SIGNAL(clicked(bool)),parent,SLOT(close())); parent->connect(btnMin,SIGNAL(clicked(bool)),parent,SLOT(lower())); } static void InitBottomPage(QWidget *parent, QWidget *bottomWidget); }; #endif // PUBLICSIGNIN_H

3.调用publicsignin.h

sign.cpp

#include "signin.h" #include "../bin/Debug/configure/head/publicsignin.h" SignIn::SignIn(QWidget *parent) : QDialog(parent) { mMoveing = false; setWindowFlags(Qt::FramelessWindowHint | Qt::WindowStaysOnTopHint);//无边框 隐藏Top栏 this->setFixedSize(660, 393); this->setStyleSheet("border:1px solid #92C8E8; margin: 0,0,0,0;"); QWidget *bottomWidget = new QWidget(this); PublicSignIn::InitBottomPage(this, bottomWidget); PublicSignIn::InitPage(this, bottomWidget); } SignIn::~SignIn() { } void PublicSignIn::InitBottomPage(QWidget *parent, QWidget *bottomWidget) { QVBoxLayout *bottomVLayout = new QVBoxLayout(bottomWidget); bottomVLayout->setAlignment(Qt::AlignCenter); QWidget *bottomCenterWidget = new QWidget(bottomWidget); bottomCenterWidget->setMaximumWidth(290); bottomCenterWidget->setMinimumHeight(250); bottomCenterWidget->setStyleSheet("QWidget{border:0px;}" "QLabel{color:#3F3A39;font-size:16px;font-family:楷体;}" "QLineEdit{border:1px solid #CBD2D5;height:32px;border-radius:6px;background:white;padding-left:5px;}" "QPushButton{border:0px;background:#F3A026;color:white;border-radius:6px;font-size:16px}"); QVBoxLayout *bottomCenterLayout = new QVBoxLayout(bottomCenterWidget); QHBoxLayout *userLayout = new QHBoxLayout(bottomCenterWidget); userLayout->setAlignment(Qt::AlignRight); QLabel *user = new QLabel(bottomCenterWidget); user->setText(QString::fromLocal8Bit("帐号")); user->setMaximumWidth(32); QLineEdit *userLine = new QLineEdit(bottomCenterWidget); userLine->setMaximumWidth(230); userLayout->addWidget(user); userLayout->addWidget(userLine); QHBoxLayout *pwdLayout = new QHBoxLayout(bottomCenterWidget); pwdLayout->setAlignment(Qt::AlignRight); QLabel *pwd = new QLabel(bottomCenterWidget); pwd->setText(QString::fromLocal8Bit("密码")); pwd->setMaximumWidth(32); QLineEdit *pwdLine = new QLineEdit(bottomCenterWidget); pwdLine->setMaximumWidth(230); pwdLayout->addWidget(pwd); pwdLayout->addWidget(pwdLine); QHBoxLayout *checkLayout = new QHBoxLayout(bottomCenterWidget); checkLayout->setAlignment(Qt::AlignJustify); QCheckBox *checkBox = new QCheckBox(bottomCenterWidget); QLabel *checkLabel = new QLabel(bottomCenterWidget); checkLabel->setText(QString::fromLocal8Bit("保存用户信息")); checkLabel->setMaximumHeight(20); checkLayout->addWidget(checkBox); checkLayout->addWidget(checkLabel); QHBoxLayout *signInLayout = new QHBoxLayout(bottomCenterWidget); signInLayout->setAlignment(Qt::AlignRight); QPushButton *btnSignIn = new QPushButton(bottomCenterWidget); btnSignIn->setChecked(false); btnSignIn->setMinimumSize(230, 38); btnSignIn->setText(QString::fromLocal8Bit("登陆")); signInLayout->addWidget(btnSignIn); QHBoxLayout *restoreLayout = new QHBoxLayout(bottomCenterWidget); restoreLayout->setAlignment(Qt::AlignRight); QPushButton *btnRegister = new QPushButton(bottomCenterWidget); btnRegister->setText(QString::fromLocal8Bit("用户注册")); btnRegister->setStyleSheet("QPushButton{border:0;background-color:transparent;color:#3F3A39;font-size:14px}" "QPushButton:hover{color:#CBD2D5}"); QLabel *labelV = new QLabel(bottomCenterWidget); labelV->setText("|"); QPushButton *btnForget = new QPushButton(bottomCenterWidget); btnForget->setText(QString::fromLocal8Bit("忘记密码?")); btnForget->setStyleSheet("QPushButton{border:0;background-color:transparent;color:#3F3A39;font-size:14px}" "QPushButton:hover{color:#CBD2D5;}"); restoreLayout->addWidget(btnRegister); restoreLayout->addWidget(labelV); restoreLayout->addWidget(btnForget); bottomCenterLayout->addLayout(userLayout); bottomCenterLayout->addLayout(pwdLayout); bottomCenterLayout->addLayout(checkLayout); bottomCenterLayout->addLayout(signInLayout); bottomCenterLayout->addLayout(restoreLayout); bottomVLayout->addWidget(bottomCenterWidget); bottomWidget->setLayout(bottomVLayout); ////////////////////////////////////////////// parent->connect(btnSignIn, SIGNAL(clicked(bool)), parent, SLOT(btnSignInClicked())); parent->connect(btnRegister, SIGNAL(clicked(bool)), parent, SLOT(btnRegisterClicked())); parent->connect(btnForget, SIGNAL(clicked(bool)), parent, SLOT(btnForgetClicked())); } void SignIn::btnSignInClicked() { qDebug() << "signIn btn clicked"; } void SignIn::btnRegisterClicked() { qDebug() << "register btn clicked"; } void SignIn::btnForgetClicked() { qDebug() << "forget btn clicked"; } //重写鼠标按下事件 void SignIn::mousePressEvent(QMouseEvent *event) { mMoveing = true; mMovePosition = event->globalPos() - pos(); } void SignIn::mouseMoveEvent(QMouseEvent *event) { if (mMoveing && (event->buttons() && Qt::LeftButton)) { move(event->globalPos() - mMovePosition); mMovePosition = event->globalPos() - pos(); } } void SignIn::mouseReleaseEvent(QMouseEvent *event) { mMoveing = false; }

4.封装

最后 将signin封装成dll 在主界面中调用即可