1.新建初始项目
2.修改UI格式
运行效果
3.创建登录界面
设计登录界面UI
设计布局
调整布局间距
往水平布局中拖入标签和文本输入框
更换控件名称并固定高度
添加窗口部件
往现有的资源文件中导入图片
添加水平布局
4.设置登陆界面为主窗口的核心组件
#pragma once#include <QtWidgets/QMainWindow>
#include "ui_MainWindow.h"class LoginWidget;class MainWindow : public QMainWindow
{Q_OBJECTpublic:MainWindow(QWidget *parent = nullptr);~MainWindow();private:Ui::MainWindowClass ui;private:LoginWidget* _LoginWidget;
};#include "MainWindow.h"#include "LoginWidget.h"MainWindow::MainWindow(QWidget *parent): QMainWindow(parent)
{ui.setupUi(this);_LoginWidget = new LoginWidget;setCentralWidget(_LoginWidget);
}MainWindow::~MainWindow()
{}
5.创建注册界面
设计注册界面UI
设置整体布局为水平
添加StackWidget
设置stackedWidget整体垂直布局,子项也是垂直布局
重复创建登录界面的操作
6.切换界面
MainWindow
public:void BindSlots();public slots:void ShowRegisterWidget();MainWindow::MainWindow(QWidget *parent): QMainWindow(parent)
{ui.setupUi(this);_LoginWidget = new LoginWidget;_RegisterWidget = new RegisterWidget;setCentralWidget(_LoginWidget);// 绑定槽函数BindSlots();
}void MainWindow::BindSlots()
{connect(_LoginWidget, &LoginWidget::Register, this, &MainWindow::ShowRegisterWidget);
}// 槽函数
// 显示注册界面
void MainWindow::ShowRegisterWidget()
{setCentralWidget(_RegisterWidget);_LoginWidget->hide();_RegisterWidget->show();
}
LoginWidget
signals:void Register(); // 注册按钮被点击private:Ui::LoginWidgetClass ui;private:void BindSlots();LoginWidget::LoginWidget(QWidget *parent): QWidget(parent)
{ui.setupUi(this);BindSlots();
}LoginWidget::~LoginWidget()
{}void LoginWidget::BindSlots()
{connect(ui.Register_Btn, &QPushButton::clicked, this, &LoginWidget::Register);
}
7.创建样式表,并设置
导入资源文件中
QDialog#LoginWidget, #RegisterWidget
{
background-color:rgb(255,255,255)
}#User_Label, #PassWord_Label
{color:balck;
}
#include "MainWindow.h"
#include <QtWidgets/QApplication>
#include <QFile>
#include <QDebug>void LoadStyle(QApplication* app)
{QFile file(":/StyleSheet/StyleSheet/stylesheet.qss");if (file.open(QFile::ReadOnly)){QString style = QLatin1String(file.readAll());app->setStyleSheet(style);file.close();qDebug() << "Load Style Success";}else{qDebug() << "Load Style Failed";}
}int main(int argc, char *argv[])
{QApplication a(argc, argv);// 加载样式表LoadStyle(&a);MainWindow w;w.show();return a.exec();
}