Qt实现一个登录界面及工具集界面UI

程序功能

Qt实现一个登录界面与工具集界面，包含头像更改，界面换肤，登录密码的密文输入与显示输入切换，用户名记忆与密码记忆（仅界面功能未定义），边角小按钮功能预留；工具集界面仅实现UI包含，界面换肤，本地视频播放，截图等操作，具体见截图。

界面截图

登录界面

在这里插入图片描述

工具集界面

在这里插入图片描述

程序源码

登录界面

头文件：

#ifndef LOGINPAGE_H
#define LOGINPAGE_H#include <QWidget>
#include <QIcon>
#include "additionaltools.h"class QAction;
class QPalette;
class QPixmap;namespace Ui {
class LoginPage;
}class LoginPage : public QWidget
{Q_OBJECTpublic:explicit LoginPage(QWidget *parent = 0);~LoginPage();
public slots:void closePage();
private slots:void on_skinBtn_clicked();void on_headShotBtn_clicked();void on_loginButton_clicked();void showPasswdTriggerd(bool open);
signals:void userLogin();
private:Ui::LoginPage *ui;QString skinPicStr;QPixmap backgroundPix;QPalette backgroundPle;QAction *userImage;QAction *passwdImage;QAction *showPasswd;QString username;QString password;QIcon skinIcon;QIcon headShotIcon;QIcon toolsIcon;QIcon networkIcon;QString headShotPic;
public:AdditionalTools *ToosMain;
};#endif // LOGINPAGE_H

源文件：

#include "loginpage.h"
#include "ui_loginpage.h"
#include <QPixmap>
#include <QAction>
#include <QMessageBox>
#include <QPalette>
#include <QFileDialog>LoginPage::LoginPage(QWidget *parent) :QWidget(parent),ui(new Ui::LoginPage)
{ui->setupUi(this);this->setWindowTitle(tr("视频监控分析系统"));skinPicStr = ":/pic/images/LoginBg_one.jpg";backgroundPix.load(skinPicStr);backgroundPle.setBrush(QPalette::Window, QBrush(backgroundPix));setPalette(backgroundPle);headShotPic=":/pic/images/User.jpg";ui->label->setPixmap(QPixmap(headShotPic));ui->label->setScaledContents(true);userImage = new QAction(this);userImage->setIcon(QIcon(":/pic/images/userLoginPic.ico"));ui->userLineEdit->addAction(userImage, QLineEdit::LeadingPosition);passwdImage = new QAction(this);showPasswd = new QAction(this);showPasswd->setCheckable(true);passwdImage->setIcon(QIcon(":/pic/images/PasswordPic.ico"));showPasswd->setIcon(QIcon(":/pic/images/eye_open.png"));ui->passwdLineEdit->addAction(passwdImage, QLineEdit::LeadingPosition);ui->passwdLineEdit->addAction(showPasswd, QLineEdit::TrailingPosition);username = "login";password = "on666";connect(showPasswd, &QAction::triggered, this, &LoginPage::showPasswdTriggerd);
}LoginPage::~LoginPage()
{delete ui;
}void LoginPage::closePage()
{this->close();
}void LoginPage::on_skinBtn_clicked()
{if (skinPicStr == ":/pic/images/LoginBg_one.jpg") {skinPicStr = ":/pic/images/LoginBg_two.jpg";} else if (skinPicStr == ":/pic/images/LoginBg_two.jpg") {skinPicStr = ":/pic/images/LoginBg_one.jpg";}backgroundPix.load(skinPicStr);backgroundPle.setBrush(QPalette::Window, QBrush(backgroundPix));setPalette(backgroundPle);
}void LoginPage::on_headShotBtn_clicked()
{headShotPic = QFileDialog::getOpenFileName(this, "Open Picture", "/", "*");if (headShotPic.isEmpty()) {return;} else {ui->label->setPixmap(QPixmap(headShotPic));ui->label->setScaledContents(true);}
}void LoginPage::on_loginButton_clicked()
{if (ui->userLineEdit->text() == username && ui->passwdLineEdit->text() == password) {this->hide();emit userLogin();} else {QMessageBox::warning(this, tr("登录提示"), tr("用户名或密码有误，请重试。。。"));return;}
}void LoginPage::showPasswdTriggerd(bool open)
{if (open) {ui->passwdLineEdit->setEchoMode(QLineEdit::Normal);showPasswd->setIcon(QIcon(":/pic/images/eye_open.png"));} else {ui->passwdLineEdit->setEchoMode(QLineEdit::Password);showPasswd->setIcon(QIcon(":/pic/images/eye_close.png"));}
}

ui文件：
在这里插入图片描述

工具集界面

头文件：

#ifndef ADDITIONALTOOLS_H
#define ADDITIONALTOOLS_H#include <QWidget>class QPoint;namespace Ui {
class AdditionalTools;
}class AdditionalTools : public QWidget
{Q_OBJECTpublic:explicit AdditionalTools(QWidget *parent = 0);~AdditionalTools();protected:void mouseMoveEvent(QMouseEvent *event);void mousePressEvent(QMouseEvent *event);void mouseReleaseEvent(QMouseEvent *event);
signals:void closeWindow();
private slots:void on_SkinToolBtn_clicked();void on_closeBtn_clicked();public slots:void receiveLogin();
private:Ui::AdditionalTools *ui;QPoint mouseCoordinate;    // 鼠标当前坐标bool mousePressed;QString backgroundPic;
};

源文件：

#include "additionaltools.h"
#include "ui_additionaltools.h"
#include <QPoint>
#include <QMouseEvent>AdditionalTools::AdditionalTools(QWidget *parent) :QWidget(parent),ui(new Ui::AdditionalTools),mousePressed(false)
{ui->setupUi(this);this->setWindowFlags(Qt::FramelessWindowHint | Qt::WindowSystemMenuHint);backgroundPic = "ToolsBg2.jpg";
}AdditionalTools::~AdditionalTools()
{delete ui;
}void AdditionalTools::mouseMoveEvent(QMouseEvent *event)
{if(mousePressed && (event->buttons() && Qt::LeftButton)) {   // &&表示仅当左键按下时，结果为真，==表示无论哪个键按下，结果均为真this->move(event->globalPos() - mouseCoordinate);event->accept();}
}void AdditionalTools::mousePressEvent(QMouseEvent *event)
{if (event->button() == Qt::LeftButton) {mousePressed = true;mouseCoordinate = event->globalPos() - this->pos();event->accept();}
}void AdditionalTools::mouseReleaseEvent(QMouseEvent *event)
{Q_UNUSED(event)mousePressed=false;
}void AdditionalTools::on_SkinToolBtn_clicked()
{if (backgroundPic == "ToolsBg1.jpg") {backgroundPic = "ToolsBg2.jpg";} else if (backgroundPic == "ToolsBg2.jpg") {backgroundPic = "ToolsBg3.jpg";} else if (backgroundPic == "ToolsBg3.jpg") {backgroundPic = "ToolsBg4.jpg";} else if (backgroundPic == "ToolsBg4.jpg") {backgroundPic = "ToolsBg5.jpg";} else if (backgroundPic == "ToolsBg5.jpg") {backgroundPic = "ToolsBg6.jpg";} else if (backgroundPic == "ToolsBg6.jpg") {backgroundPic = "ToolsBg7.jpg";} else if (backgroundPic == "ToolsBg7.jpg") {backgroundPic = "ToolsBg8.jpg";} else if (backgroundPic == "ToolsBg8.jpg") {backgroundPic = "ToolsBg1.jpg";}QString qssStyle = QString("QWidget#subWidget{background-image: url(:/pic/images/%1);}").arg(backgroundPic);qssStyle += "QToolButton{color:#E7ECF0;background-color:rgba(0,0,0,0);}";this->setStyleSheet(qssStyle);
}void AdditionalTools::receiveLogin()
{this->show();emit closeWindow();
}void AdditionalTools::on_closeBtn_clicked()
{this->close();exit(0);
}

ui文件：
在这里插入图片描述
mian函数：

#include "loginpage.h"
#include <QApplication>
#include <QObject>int main(int argc, char *argv[])
{QApplication a(argc, argv);AdditionalTools mainTools;LoginPage login;login.show();QObject::connect(&login, &LoginPage::userLogin, &mainTools, &AdditionalTools::receiveLogin);QObject::connect(&mainTools, &AdditionalTools::closeWindow, &login, &LoginPage::closePage);return a.exec();
}