Qt|实现一个登录界面

在这里插入图片描述
运行环境:win10 VisualStudio2022 QT6.3.1同时下载了5.15.2兼容一些qt函数
项目整体代码组成:
在这里插入图片描述
QtLoginWindow.h

#pragma once

#include <QtWidgets/QWidget>
#include <QLabel>
#include <QComboBox>
#include <QLineEdit>
#include <QToolButton>
#include <QKeyEvent>
#include <QPushButton>

class QtLoginWindow : public QWidget
{
    Q_OBJECT

public:
    QtLoginWindow();

    // 初始化ui
    void InitalizeUI();

    // 设置标题
    void SetTitle(const QString& _text);

    // 设置图标根据图片
    void SetIcon(const QPixmap& _icon);

    // 设置背景图
    void SetBackgroundPicture(const QString& _background_picture);

    // 设置图标根据路径
    void SetIconPicture(const QString& _icon_picture);

    // 添加combox里角色
    void AddRole(const int _id, const QString& _role);

    // 获取当前的角色文字
    QString CurrentRoleText();

    // 获取当前角色id
    int CurrentRoleID();

    // 获取当前密码
    QString Password();

    // 获取当前用户名
    QString UserName();

    // 用于绑定外部创建的按钮 在此不实现
    //void SetDefaultLoginAction(QAction* _action);

    // 设置lineedit默认显示文字
    void SetEditPlaceholderText(QString _text);

    void Clear();

    // 点击登录后操作 一般去数据库检验账户名密码是否正确 
    void SlotLoginButtonClicked();

protected:
    virtual void paintEvent(QPaintEvent* event) override;
    virtual void keyPressEvent(QKeyEvent* event) override;
    // 为了实现拖动效果
    virtual void mousePressEvent(QMouseEvent* event) override;
    virtual void mouseMoveEvent(QMouseEvent* event) override;
    virtual void mouseReleaseEvent(QMouseEvent* event) override;

private:
    // 为了检查所有lineedit是否都填了内容
    void CheckAllLineEdit(const QString& text);

private:
    QLabel* label_title_;   // 标题
    QComboBox* combobox_role_;  // 角色combox
    QLineEdit* edit_user_name_; // 用户名
    QLineEdit* edit_password_;  // 密码
    QToolButton* button_change_password_;   // 更改密码button
    QToolButton* button_login_; // 登录button
    QPushButton* button_close_; // 关闭button

    QString title_; // 标题
    QPixmap logo_;  // logo样式
    //QAction* action_login_; // 可以从外部通过绑定action连接外部槽函数 在此不实现
    QString background_picture_;    // 背景图
    QString icon_picture_;  // 图标地址

    // 为了鼠标拖动登录界面
    QPoint relativepos_;
    bool mouse_flag_;
};

QtLoginWindow.cpp

#include "QtLoginWindow.h"
#include <QGraphicsDropShadowEffect>
#include <QtMath>
#include <QDebug>
#include <QAction>
#include <QPainter>
#include <QVBoxLayout>
#include <QSpacerItem>
#include <QListView>
#include <QFontDatabase>
#include <QFile>
#include <QPainterPath>

QtLoginWindow::QtLoginWindow()
     //:action_login_(nullptr)
    : background_picture_(":/QtLoginWindow/res/log_background.png")
    , icon_picture_("")
    , mouse_flag_(false)
{
    title_ = QStringLiteral("登录");
    int font = QFontDatabase::addApplicationFont(":/QtLoginWindow/res/Alibaba_PuHuiTi_2.0_75_SemiBold_75_SemiBold.ttf");
    InitalizeUI();
}

void QtLoginWindow::InitalizeUI()
{
    // 通过css文件设置样式
    QFile style_file;
    style_file.setFileName(":/QtLoginWindow/res/style.css");
    style_file.open(QIODevice::ReadOnly);
    QString style_str = style_file.readAll();
    this->setStyleSheet(style_str);

    setFixedSize(630, 430);
    setWindowFlag(Qt::FramelessWindowHint, true);
    setAttribute(Qt::WA_TranslucentBackground);
    setContentsMargins(0, 5, 25, 0);
    combobox_role_ = new QComboBox;
    combobox_role_->addItem("学生", 0);
    combobox_role_->addItem("管理员", 1);
    edit_user_name_ = new QLineEdit;
    edit_password_ = new QLineEdit;
    button_close_ = new QPushButton;
    button_close_->setFixedSize(20, 20);
    button_close_->setIconSize(QSize(20, 20));
    button_close_->setProperty("ButtonType", "login_close");

    button_change_password_ = new QToolButton;
    button_change_password_->setText("修改密码");
    button_change_password_->setFixedSize(150, 50);
    button_change_password_->setProperty("ButtonType", "login_login");
    button_change_password_->setEnabled(true);

    button_login_ = new QToolButton;
    button_login_->setText("登录");
    button_login_->setFixedSize(150, 50);
    button_login_->setProperty("ButtonType", "login_login");
    button_login_->setEnabled(false);

    combobox_role_->setFixedSize(400, 50);
    edit_user_name_->setFixedSize(400, 50);
    edit_password_->setFixedSize(400, 50);

    combobox_role_->setProperty("comboboxType", "combobox_role_");
    QListView* combobox_listview = new QListView;
    combobox_listview->setProperty("comboboxListview", "combobox_listview");
    combobox_role_->setView(combobox_listview);

    edit_user_name_->setPlaceholderText("请输入账号 ");
    edit_user_name_->setContextMenuPolicy(Qt::NoContextMenu);
    edit_user_name_->setAttribute(Qt::WA_InputMethodEnabled, false);
    edit_user_name_->setTextMargins(10, 0, 30, 0);
    edit_user_name_->setProperty("LineEditType", "user_name_lineedit");

    edit_password_->setPlaceholderText("请输入密码 ");
    edit_password_->setEchoMode(QLineEdit::Password);
    edit_password_->setContextMenuPolicy(Qt::NoContextMenu);
    edit_password_->setAttribute(Qt::WA_InputMethodEnabled, false);
    edit_password_->setTextMargins(10, 0, 30, 0);
    edit_password_->setProperty("LineEditType", "user_name_lineedit");
    
    QHBoxLayout* layout_lineedit = new QHBoxLayout;
    edit_password_->setLayout(layout_lineedit);
    layout_lineedit->addStretch();
    QPushButton* btn_down_ = new QPushButton;
    btn_down_->setCheckable(true);
    btn_down_->setParent(edit_password_);
    btn_down_->setProperty("ButtonType", "password_down_pushbutton");
    btn_down_->setFixedSize(30, 45);
    btn_down_->setCursor(Qt::PointingHandCursor);
    layout_lineedit->addWidget(btn_down_);
    layout_lineedit->setContentsMargins(0, 0, 0, 0);
    connect(btn_down_, &QPushButton::clicked, this, [=]() {
        if (btn_down_->isChecked())
            edit_password_->setEchoMode(QLineEdit::Normal);
        else
            edit_password_->setEchoMode(QLineEdit::Password);
        });

    // 整体布局
    QVBoxLayout* layout_main = new QVBoxLayout;
    layout_main->setContentsMargins(0, 0, 0, 0);
    setLayout(layout_main);

    layout_main->addWidget(button_close_, 0, Qt::AlignRight | Qt::AlignTop);
    layout_main->addItem(new QSpacerItem(0, 100, QSizePolicy::Expanding, QSizePolicy::Fixed));
    layout_main->addWidget(combobox_role_, 0, Qt::AlignHCenter);
    QSpacerItem* sparcer_item = new QSpacerItem(0, 10, QSizePolicy::Expanding, QSizePolicy::Fixed);
    layout_main->addItem(sparcer_item);
    layout_main->addWidget(edit_user_name_, 0, Qt::AlignHCenter);
    layout_main->addItem(sparcer_item);
    layout_main->addWidget(edit_password_, 0, Qt::AlignHCenter);
    layout_main->addItem(sparcer_item);
    QHBoxLayout* button_layout = new QHBoxLayout;
    button_layout->addWidget(button_change_password_);
    button_layout->addWidget(button_login_);
    layout_main->addLayout(button_layout);
    layout_main->addStretch(0);

    connect(button_login_, &QToolButton::clicked, this, &QtLoginWindow::SlotLoginButtonClicked);
    connect(button_close_, &QPushButton::clicked, this, &QtLoginWindow::close);
    connect(edit_user_name_, &QLineEdit::textChanged, this, &QtLoginWindow::CheckAllLineEdit);
    connect(edit_password_, &QLineEdit::textChanged, this, &QtLoginWindow::CheckAllLineEdit);
}

void QtLoginWindow::SetTitle(const QString& _text)
{
    if (_text.isEmpty())
        return;

    title_ = _text;
    update();
}

void QtLoginWindow::SetIcon(const QPixmap& _icon)
{
    if (_icon.isNull())
        return;

    logo_ = _icon;
    update();
}

void QtLoginWindow::SetBackgroundPicture(const QString& _background_picture)
{
    background_picture_ = _background_picture;
    update();
}

void QtLoginWindow::SetIconPicture(const QString& _icon_picture)
{
    icon_picture_ = _icon_picture;
    update();
}

void QtLoginWindow::AddRole(const int _id, const QString& _role)
{
    if (combobox_role_ == nullptr)
        return;
    combobox_role_->addItem(_role, _id);
}

QString QtLoginWindow::CurrentRoleText()
{
    if(combobox_role_==nullptr)
        return QString();
    return combobox_role_->currentText();
}

int QtLoginWindow::CurrentRoleID()
{
    if(combobox_role_ == nullptr)
        return -1;
    return combobox_role_->currentData().toInt();
}

QString QtLoginWindow::Password()
{
    if(edit_password_ == nullptr)
        return QString();
    return edit_password_->text();
}

QString QtLoginWindow::UserName()
{
    if(edit_user_name_ == nullptr)
        return QString();
    return edit_user_name_->text();
}

//void QtLoginWindow::SetDefaultLoginAction(QAction* _action)
//{
//    if (this->action_login_ == _action || _action == nullptr)
//        return;
//
//    if (this->action_login_)
//        delete this->action_login_;
//
//    this->action_login_ = _action;
//}

void QtLoginWindow::SetEditPlaceholderText(QString _text)
{
    edit_user_name_->setPlaceholderText(_text);
}

void QtLoginWindow::Clear()
{
    edit_user_name_->clear();
    edit_password_->clear();
    button_login_->setEnabled(false);
}

void QtLoginWindow::SlotLoginButtonClicked()
{
    // qt操作数据库详见博主其他博文
}

void QtLoginWindow::paintEvent(QPaintEvent* event)
{
    QPainter painter(this);
    painter.setRenderHints(QPainter::TextAntialiasing | QPainter::Antialiasing);
    painter.drawPixmap(5, 5, 600, 400, QPixmap(background_picture_));
    painter.drawPixmap(25, 28, 44, 48, QPixmap(icon_picture_));

    // 标题绘制
    QRect title_rect(75, 33, 480, 48);
    QFont title_font = painter.font();
    title_font.setPixelSize(30);
    title_font.setFamily("Alibaba PuHuiTi H");
    title_font.setLetterSpacing(QFont::AbsoluteSpacing, 3);
    QFontMetrics title_fm(title_font);
    QPainterPath title_path;
    title_path.addText(title_rect.x()+100, title_rect.y() + title_fm.ascent(), title_font, title_);
    painter.setOpacity(0.5);
    painter.fillPath(title_path, QColor(78, 118, 168));
    painter.strokePath(title_path, QPen(QColor(78, 118, 168), 1));

    painter.save();
    painter.setOpacity(1);
    painter.translate(-1, -3);
    painter.fillPath(title_path, QColor(11, 66, 167));
    painter.strokePath(title_path, QPen(QColor(255, 255, 255), 1));
    painter.restore();

    int offset = 0;
    QRect rect = this->rect(), adjusted(offset, offset, -(2 * offset), -(2 * offset));
    QRect rect_font = QRect(offset, offset, rect.width() - (2 * offset), 160);

    painter.save();
    QPainterPath path;
    path.setFillRule(Qt::WindingFill);
    path.addRect(QRect(offset, offset, rect.width() - (2 * offset), rect.height() - (2 * offset)));

    painter.setRenderHint(QPainter::Antialiasing);

    QColor color(0, 0, 0, 50);

    for (int i = 0; i < offset; i++) {
        QPainterPath path;
        path.setFillRule(Qt::WindingFill);
        path.addRect(offset - i, offset - i, rect.width() - (offset - i) * 2, rect.height() - (offset - i) * 2);
        color.setAlpha(100 - qSqrt(i) * 45);
        painter.setPen(color);
        painter.drawPath(path);
    }
    painter.restore();
}


void QtLoginWindow::keyPressEvent(QKeyEvent* event)
{
    switch (event->key()) {
    case Qt::Key_Return:
        button_login_->clicked();
        break;
    case Qt::Key_Enter:
        button_login_->clicked();
        break;
    default:
        break;
    }
}

void QtLoginWindow::mousePressEvent(QMouseEvent* event)
{
    QPoint window_point = this->pos();
    QPoint this_point = event->globalPos();

    if (event->button() == Qt::LeftButton) {
        if (this_point.ry() >= window_point.ry() && this_point.ry() <= window_point.ry() + 100) {
            mouse_flag_ = true;
            relativepos_ = this->pos() - event->globalPos();
        }
    }
}

void QtLoginWindow::mouseMoveEvent(QMouseEvent* event)
{
    if (mouse_flag_) {
        this->move(event->globalPos() + relativepos_);
    }
}

void QtLoginWindow::mouseReleaseEvent(QMouseEvent* event)
{
    mouse_flag_ = false;
}

void QtLoginWindow::CheckAllLineEdit(const QString& text)
{
    if (!edit_user_name_->text().isEmpty()) {
        if (!edit_password_->text().isEmpty()) {
            button_login_->setEnabled(true);
            return;
        }
    }
    button_login_->setEnabled(false);
}

QtLoginWindow.qrc
所有资源文件均从阿里巴巴矢量图标库下载
在这里插入图片描述
资源文件:
在这里插入图片描述
style.css

* {
    font-family: 'Microsoft YaHei';
    font-size: 13px;
}

/*登录界面关闭按钮风格*/
QPushButton[ButtonType = "login_close"]{
    border-image:url(":/QtLoginWindow/res/close_normal.png");
}

QPushButton:hover[ButtonType = "login_close"]{
    border-image:url(":/QtLoginWindow/res/close_hover.png");
}

QPushButton:pressed[ButtonType = "login_close"]{
    border-image:url(":/QtLoginWindow/res/close_pressed.png");
}

/* 登录界面登录按钮风格*/
QToolButton[ButtonType = "login-login"]{
    border:none;
    border-radius:4px;
    color: rgb(255, 255, 255);
    font-size: 16px;
    font-family: Microsoft YaHei;
    background-color: rgb(86, 146, 245);
}

QToolButton:pressed[ButtonType = "login-login"]{
    color:rgb(255, 255, 255);
    background-color:rgb(119,157,209);
}

QToolButton:disabled[ButtonType = "login-login"]{
    color:rgb(255, 255, 255);
    background-color:rgb(119,157,209);
}

/* 登录界面QLineEdit风格*/
QLineEdit[LineEditType = "user_name_lineedit"]{
    font-size: 16px;
    font-family: Microsoft YaHei;
    border-color: rgb(233,233,233);
    background-color: rgb(255,255,255);
    border-radius: 4px;
}

QLineEdit:hover[LineEditType = "user_name_lineedit"]{
    border: 1px solid rgb(81,167,255);
}

QLineEdit:pressed[LineEditType = "user_name_lineedit"]{
    border: 1px solid rgb(81,167,255);
}

/* 密码右侧按钮*/
QPushButton[ButtonType = "password_down_pushbutton"]{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border:none;
    background-color: transparent;
    image:url(":/QtLoginWindow/res/hide_normal.png");
}

QPushButton:pressed[ButtonType = "password_down_pushbutton"]{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border:none;
    background-color: transparent;
    image:url(":/QtLoginWindow/res/hide_pressed.png");
}

QPushButton:hover[ButtonType = "password_down_pushbutton"]{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border:none;
    background-color: transparent;
    image:url(":/QtLoginWindow/res/hide_hover.png");
}

QPushButton:checked[ButtonType = "password_down_pushbutton"]{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border:none;
    background-color: transparent;
    image:url(":/QtLoginWindow/res/display_normal.png");
}

QPushButton:checked:pressed[ButtonType = "password_down_pushbutton"]{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border:none;
    background-color: transparent;
    image:url(":/QtLoginWindow/res/display_pressed.png");
}

QPushButton:checked:hover[ButtonType = "password_down_pushbutton"]{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border:none;
    background-color: transparent;
    image:url(":/QtLoginWindow/res/display_hover.png");
}

/* 登录界面角色combobox风格*/
QComboBox[comboboxType = "combobox_role_"]{
    background-color: rgb(240,240,240);
    border-style:solid;
    border-radius: 4px;
    font-size: 16px;
    font-family: Microsoft YaHei;
    border:none;
    padding-left: 10px;
    outline: none;
    color:rgb(32,32,32);
}

QAbstractItemView[comboboxListview = "combobox_listview"]{
    outline: none;
    margin:0px;
    padding:3px;
    border:1px solid rgb(211,211,211);
    color:rgb(32,32,32);
    background-color: rgb(244,244,244);
    selection-background-color:rgb(240,240,240);
}

QAbstractItemView::item[comboboxListview = "combobox_listview"]{
    outline: none;
    height:45px;
    color:rgb(82,82,82);
    background-color: rgb(244,244,244);
    selection-background-color:rgb(240,240,240);
}

QAbstractItemView::item:hover[comboboxListview = "combobox_listview"]{
    outline: none;
    color:rgb(0,0,0);
    background-color: rgb(215,225,240);
}

/* 下拉箭头样式*/
QComboBox:drop-down[comboboxType = "combobox_role_"]{
    border-color: rgb(211,211,211);
    width: 30px;
    outline: none;
}

QComboBox:drop-down:hover[comboboxType = "combobox_role_"]{
    width:30px;
    outline: none;
}

QComboBox:down-arrow[comboboxType = "combobox_role_"]{
    image:url(":/QtLoginWindow/res/arrow_down_normal.png");
    width:30px;
}

QComboBox:down-arrow:hover[comboboxType = "combobox_role_"]{
    image:url(":/QtLoginWindow/res/arrow_down_pressed.png");
    width:30px;
}

QComboBox:down-arrow:on[comboboxType = "combobox_role_"]{
    image:url(":/QtLoginWindow/res/arrow_up_normal.png");
    width:30px;
}

QComboBox:down-arrow:on:hover[comboboxType = "combobox_role_"]{
    image:url(":/QtLoginWindow/res/arrow_up_pressed.png");
    width:30px;
}
  • 1
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

奇树谦

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值