本文基于Qt实现一个简单的登录界面,主要使用到Widget、button、edit等控件,基于自定义的信号槽实现界面的跳转,使用绘图设备添加背景图等。
1. 创建主界面
设计主界面的样式,并添加相关的控件。如下显示:
代码如下:
2. 创建欢迎界面(登录成功之后的界面)
欢迎界面比较简单,就添加了一个返回按钮。代码如下:
3. 添加登录界面的逻辑
MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)
{ui->setupUi(this);// 退出connect(ui->btnExit, &QPushButton::clicked, this, &QWidget::close);userWindow = new UserWindow();// 主界面接收欢迎界面的退出信号以返回到登录界面connect(userWindow, &UserWindow::backHome, this, [=]{userWindow->hide();this->show();});// 登录QString realPwd = "123456";QString realUser = "user";connect(ui->btnLogin, &QPushButton::clicked, this, [=]{QString pwd = ui->pwdEdit->text();QString user = ui->userNameEdit->text();if (pwd == realPwd && realUser == user) {this->hide();userWindow->show();} else {QMessageBox::warning(this, "提示", "账号或密码错误!");}});
}
4. 添加欢迎界面的逻辑
UserWindow::UserWindow(QWidget *parent): QWidget(parent), ui(new Ui::UserWindow)
{ui->setupUi(this);// 退出按钮发送退出信号,以回退到登陆界面connect(ui->btnBack, &QPushButton::clicked, [=]{emit backHome();});
}// 重写绘图事件函数,以添加背景图
void UserWindow::paintEvent(QPaintEvent* event)
{QPainter painter(this);QPixmap pix;pix.load(":/image/OIP-C.jfif");painter.drawPixmap(0, 0, this->width(), this->height(), pix);
}
在头文件中添加退出信号和绘图事件函数:
class UserWindow : public QWidget
{Q_OBJECTpublic:explicit UserWindow(QWidget *parent = nullptr);~UserWindow();// 绘图事件函数void paintEvent(QPaintEvent* event);
// 在此处添加退出信号
signals:void backHome();private:Ui::UserWindow *ui;
};
5. 实现效果
登录界面:
欢迎界面:
点击退出后即回到登陆界面。