练习做一个登录界面
效果
UI图
UI代码
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>Dialog</class>
<widget class="QDialog" name="Dialog">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>440</width>
<height>765</height>
</rect>
</property>
<property name="windowTitle">
<string>Dialog</string>
</property>
<layout class="QVBoxLayout" name="verticalLayout_2">
<property name="leftMargin">
<number>10</number>
</property>
<property name="topMargin">
<number>10</number>
</property>
<property name="rightMargin">
<number>10</number>
</property>
<property name="bottomMargin">
<number>10</number>
</property>
<item>
<widget class="QWidget" name="widget" native="true">
<layout class="QHBoxLayout" name="horizontalLayout">
<property name="leftMargin">
<number>10</number>
</property>
<property name="topMargin">
<number>10</number>
</property>
<property name="rightMargin">
<number>10</number>
</property>
<property name="bottomMargin">
<number>10</number>
</property>
<item>
<widget class="QPushButton" name="btnSet">
<property name="minimumSize">
<size>
<width>32</width>
<height>32</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>32</width>
<height>32</height>
</size>
</property>
<property name="text">
<string>PushButton</string>
</property>
</widget>
</item>
<item>
<widget class="QLabel" name="label_Title">
<property name="text">
<string>视频会议</string>
</property>
<property name="alignment">
<set>Qt::AlignmentFlag::AlignCenter</set>
</property>
</widget>
</item>
<item>
<widget class="QPushButton" name="btnMin">
<property name="minimumSize">
<size>
<width>32</width>
<height>32</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>32</width>
<height>32</height>
</size>
</property>
<property name="text">
<string>PushButton</string>
</property>
</widget>
</item>
<item>
<widget class="QPushButton" name="btnClose">
<property name="minimumSize">
<size>
<width>32</width>
<height>32</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>32</width>
<height>32</height>
</size>
</property>
<property name="text">
<string>PushButton</string>
</property>
</widget>
</item>
</layout>
</widget>
</item>
<item>
<spacer name="verticalSpacer">
<property name="orientation">
<enum>Qt::Orientation::Vertical</enum>
</property>
<property name="sizeType">
<enum>QSizePolicy::Policy::Fixed</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>20</width>
<height>40</height>
</size>
</property>
</spacer>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_4">
<item>
<spacer name="horizontalSpacer">
<property name="orientation">
<enum>Qt::Orientation::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
<item>
<widget class="QLabel" name="label_logo">
<property name="minimumSize">
<size>
<width>400</width>
<height>336</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>400</width>
<height>336</height>
</size>
</property>
<property name="text">
<string/>
</property>
<property name="alignment">
<set>Qt::AlignmentFlag::AlignCenter</set>
</property>
</widget>
</item>
<item>
<spacer name="horizontalSpacer_2">
<property name="orientation">
<enum>Qt::Orientation::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
</layout>
</item>
<item>
<spacer name="verticalSpacer_2">
<property name="orientation">
<enum>Qt::Orientation::Vertical</enum>
</property>
<property name="sizeType">
<enum>QSizePolicy::Policy::Fixed</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>20</width>
<height>35</height>
</size>
</property>
</spacer>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_5">
<item>
<spacer name="horizontalSpacer_3">
<property name="orientation">
<enum>Qt::Orientation::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
<item>
<layout class="QVBoxLayout" name="verticalLayout">
<item>
<widget class="QPushButton" name="btnWeichatLogin">
<property name="minimumSize">
<size>
<width>400</width>
<height>50</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>400</width>
<height>50</height>
</size>
</property>
<property name="styleSheet">
<string notr="true">QPushButton:hover
{
/*边框色*/
border-color:blue;
}</string>
</property>
<property name="text">
<string>微信登录</string>
</property>
</widget>
</item>
<item>
<spacer name="verticalSpacer_3">
<property name="orientation">
<enum>Qt::Orientation::Vertical</enum>
</property>
<property name="sizeType">
<enum>QSizePolicy::Policy::Fixed</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>20</width>
<height>15</height>
</size>
</property>
</spacer>
</item>
<item>
<widget class="QPushButton" name="btnJoin">
<property name="minimumSize">
<size>
<width>400</width>
<height>50</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>400</width>
<height>50</height>
</size>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<property name="text">
<string>加入会议</string>
</property>
</widget>
</item>
</layout>
</item>
<item>
<spacer name="horizontalSpacer_4">
<property name="orientation">
<enum>Qt::Orientation::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
</layout>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_2">
<item>
<widget class="Line" name="line">
<property name="orientation">
<enum>Qt::Orientation::Horizontal</enum>
</property>
</widget>
</item>
<item>
<widget class="QLabel" name="label_3">
<property name="text">
<string>其他登录方式</string>
</property>
<property name="alignment">
<set>Qt::AlignmentFlag::AlignCenter</set>
</property>
</widget>
</item>
<item>
<widget class="Line" name="line_2">
<property name="orientation">
<enum>Qt::Orientation::Horizontal</enum>
</property>
</widget>
</item>
</layout>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_3">
<item>
<widget class="QToolButton" name="toolBtnPhone">
<property name="minimumSize">
<size>
<width>60</width>
<height>80</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>60</width>
<height>80</height>
</size>
</property>
<property name="text">
<string>...</string>
</property>
</widget>
</item>
<item>
<widget class="QToolButton" name="toolBtnEnpriseWeichat">
<property name="minimumSize">
<size>
<width>60</width>
<height>80</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>60</width>
<height>80</height>
</size>
</property>
<property name="text">
<string>...</string>
</property>
</widget>
</item>
<item>
<widget class="QToolButton" name="toolBtnSSO">
<property name="minimumSize">
<size>
<width>60</width>
<height>80</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>60</width>
<height>80</height>
</size>
</property>
<property name="text">
<string>...</string>
</property>
</widget>
</item>
</layout>
</item>
</layout>
</widget>
<resources/>
<connections/>
</ui>
项目结构
样式代码
dialog.cpp
#include "dialog.h"
#include "ui_dialog.h"
Dialog::Dialog(QWidget *parent)
: QDialog(parent)
, ui(new Ui::Dialog)
{
ui->setupUi(this);
this->setStyleSheet("background-color:white");
//去除边框 : Qt::FramelessWindowHint
//点任务拦图标时 显示和隐藏 窗口 Qt::WindowMinMaxButtonsHint
this->setWindowFlags(Qt::FramelessWindowHint | Qt::WindowMinMaxButtonsHint);
ui->btnSet->setText("");
//写样式表
ui->btnSet->setStyleSheet("QPushButton{background-image:url(://resources/set.png);border:none} QPushButton::hover{background-color:rgb(99,99,99)}");
ui->btnMin->setText("");
//写样式表
ui->btnMin->setStyleSheet("QPushButton{background-image:url(://resources/min.png);border:none} QPushButton::hover{background-color:rgb(99,99,99)}");
ui->btnClose->setText("");
//写样式表
ui->btnClose->setStyleSheet("QPushButton{background-image:url(://resources/close.png);border:none} QPushButton::hover{background-color:rgb(99,99,99)}");
ui->label_logo->setText("");
//显示图片
QPixmap *pic = new QPixmap("://resources/logo.jpg");
//设置图片缩放
pic->scaled(ui->label_logo->size(),Qt::KeepAspectRatio);
ui->label_logo->setScaledContents(true);
ui->label_logo->setPixmap(*pic);
ui->btnWeichatLogin->setText("");
//写样式表
ui->btnWeichatLogin->setStyleSheet("QPushButton{background-image:url(://resources/weichatlogin.png);border:none} QPushButton::hover{border-color:blue}");
ui->toolBtnPhone->setText("手机号");
ui->toolBtnPhone->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);
ui->toolBtnPhone->setIconSize(QSize(60,60));
ui->toolBtnPhone->setIcon(QIcon(":/resources/phonelogin.png"));
ui->toolBtnPhone->setStyleSheet("border:none");
ui->toolBtnEnpriseWeichat->setText("企业微信");
ui->toolBtnEnpriseWeichat->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);
ui->toolBtnEnpriseWeichat->setIconSize(QSize(60,60));
ui->toolBtnEnpriseWeichat->setIcon(QIcon(":/resources/enpriseweichat.png"));
ui->toolBtnEnpriseWeichat->setStyleSheet("border:none");
ui->toolBtnSSO->setText("SSO");
ui->toolBtnSSO->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);
ui->toolBtnSSO->setIconSize(QSize(60,60));
ui->toolBtnSSO->setIcon(QIcon(":/resources/sso.png"));
ui->toolBtnSSO->setStyleSheet("border:none");
//事件
//关闭事件
connect(ui->btnClose,&QPushButton::clicked,[=]{
close();
});
connect(ui->btnMin,&QPushButton::clicked,[=]{
showMinimized();//最小化
//showMaximized();//最大化
//if(this->isMaximized())
});
//判断是否最大化
if(isMaximized())
{
}
//判断是否最小化
if(isMinimized())
{
showMaximized();//最大化
}
}
Dialog::~Dialog()
{
delete ui;
}
今天时间有限，先写到这里，后面在细化怎么一步步做出来的
![[大模型]视频生成-Sora简析](https://i-blog.csdnimg.cn/direct/38a676c7c17a4171b5737c82091afb1b.png)
