武汉优联网站建设b2b商务平台

在C++开发中，使用Qt框架可以快速构建美观且功能强大的GUI应用程序。本文将介绍如何设计一个漂亮的登录界面，包括账号和密码输入框，并确保只有验证成功后才能进入主窗口。

项目结构

文件列表

• LoginDialog.h：登录对话框的头文件
• LoginDialog.cpp：登录对话框的实现文件
• main.cpp：主函数文件

实现步骤

1. 创建项目

使用Qt Creator创建一个新的Qt Widgets Application项目。

2. 设计登录对话框

LoginDialog.h

#ifndef LOGINDIALOG_H
#define LOGINDIALOG_H#include <QDialog>
#include <QLabel>
#include <QLineEdit>
#include <QPushButton>
#include <QVBoxLayout>
#include <QHBoxLayout>
#include <QMessageBox>
#include <QCheckBox>
#include <QSettings>class LoginDialog : public QDialog {Q_OBJECTpublic:LoginDialog(QWidget* parent = nullptr);private slots:void onLoginClicked();private:QLineEdit* usernameEdit;QLineEdit* passwordEdit;QPushButton* loginButton;QCheckBox* rememberCheckBox;
};#endif // LOGINDIALOG_H

LoginDialog.cpp

#include "LoginDialog.h"
#include <QApplication>
#include <QStyleFactory>
#include <QFont>LoginDialog::LoginDialog(QWidget* parent): QDialog(parent)
{setWindowTitle("Login");setFixedSize(400, 300);setWindowFlags(Qt::Dialog | Qt::WindowCloseButtonHint);// 设置样式setStyleSheet("QDialog { background-color: #f5f5f5; }""QLabel { color: #333333; }""QLineEdit { padding: 8px; border: 1px solid #cccccc; border-radius: 4px; }""QPushButton { background-color: #4285f4; color: white; padding: 10px; border-radius: 4px; }""QPushButton:hover { background-color: #2a75f3; }""QCheckBox { color: #333333; }");// 标题QLabel* titleLabel = new QLabel("Welcome to the System", this);titleLabel->setStyleSheet("font-size: 24px; color: #1a73e8; font-weight: bold;");titleLabel->setAlignment(Qt::AlignCenter);// 账号输入框QLabel* usernameLabel = new QLabel("Username:", this);usernameEdit = new QLineEdit(this);usernameEdit->setPlaceholderText("Enter your username");usernameEdit->setFocus();// 密码输入框QLabel* passwordLabel = new QLabel("Password:", this);passwordEdit = new QLineEdit(this);passwordEdit->setPlaceholderText("Enter your password");passwordEdit->setEchoMode(QLineEdit::Password);// 记住密码复选框rememberCheckBox = new QCheckBox("Remember Password", this);// 登录按钮loginButton = new QPushButton("Login", this);loginButton->setFixedSize(120, 40);connect(loginButton, &QPushButton::clicked, this, &LoginDialog::onLoginClicked);// 布局QVBoxLayout* mainLayout = new QVBoxLayout(this);mainLayout->addWidget(titleLabel);mainLayout->addSpacing(20);QHBoxLayout* usernameLayout = new QHBoxLayout();usernameLayout->addWidget(usernameLabel);usernameLayout->addWidget(usernameEdit);mainLayout->addLayout(usernameLayout);QHBoxLayout* passwordLayout = new QHBoxLayout();passwordLayout->addWidget(passwordLabel);passwordLayout->addWidget(passwordEdit);mainLayout->addLayout(passwordLayout);QHBoxLayout* rememberLayout = new QHBoxLayout();rememberLayout->addStretch();rememberLayout->addWidget(rememberCheckBox);mainLayout->addLayout(rememberLayout);mainLayout->addSpacing(20);QHBoxLayout* buttonLayout = new QHBoxLayout();buttonLayout->addStretch();buttonLayout->addWidget(loginButton);mainLayout->addLayout(buttonLayout);mainLayout->addStretch();// 读取记住的用户名和密码QSettings settings("MyCompany", "MyApp");if (settings.contains("user")) {usernameEdit->setText(settings.value("user").toString());passwordEdit->setText(settings.value("pass").toString());rememberCheckBox->setChecked(true);}
}void LoginDialog::onLoginClicked()
{QString username = usernameEdit->text().trimmed();QString password = passwordEdit->text();if (username.isEmpty() || password.isEmpty()) {QMessageBox::warning(this, "Warning", "Username and password cannot be empty");return;}// 这里可以添加你的验证逻辑// 例如连接数据库或验证用户名密码if (username == "admin" && password == "123456") {// 验证成功// 保存记住密码的设置QSettings settings("MyCompany", "MyApp");if (rememberCheckBox->isChecked()) {settings.setValue("user", username);settings.setValue("pass", password);} else {settings.remove("user");settings.remove("pass");}accept(); // 关闭对话框并返回接受状态} else {// 验证失败QMessageBox::warning(this, "Error", "Incorrect username or password");passwordEdit->clear();passwordEdit->setFocus();}
}

3. 修改主函数

main.cpp

#include "MainWindow.h"
#include "LoginDialog.h"
#include <QApplication>
#include <QStyleFactory>int main(int argc, char* argv[])
{QApplication app(argc, argv);// 设置应用样式app.setStyle("Fusion");// 显示登录对话框LoginDialog loginDialog;if (loginDialog.exec() == QDialog::Accepted) {// 登录成功，显示主窗口MainWindow mainWindow;mainWindow.show();return app.exec();} else {// 登录取消或失败，退出应用return 0;}
}

常见问题及解决方法

1. QStyleFactory 和 create 未定义

• 包含正确的头文件：

  #include <QStyleFactory>
  

• 检查Qt版本：
  确保你的Qt版本支持 QStyleFactory::create。如果版本较低，可以使用以下代码设置样式：

  app.setStyle("Fusion");
  

2. 编码问题 (C4819 警告)

• 将文件保存为UTF-8编码：
  在Visual Studio中，打开文件，点击“文件”->“高级保存选项”，选择“UTF-8”编码，然后保存文件。

3. 类型转换问题 (C4267 警告)

• 显式类型转换：
  在相关代码中使用 static_cast 进行显式类型转换：

  Standard_Integer value = static_cast<Standard_Integer>(someSizeTVariable);
  

总结

通过上述步骤，你可以设计一个美观且功能完善的登录界面。该界面支持记住密码功能，并且只有验证成功后才能进入主窗口。根据需要，你可以进一步定制界面样式和验证逻辑，以满足具体的应用需求。