DAY2-布局管理器和对话框

239 阅读5分钟

Qt的布局

Qt窗口的窗口部件可能互相覆盖,如果被覆盖,将造成控件无法操作,而且也不美观,所有的窗口都需要设计布局,达到用户界面 美观简洁易用 的目的。

之前通过窗口部件的move函数调整窗口部件的位置,但是这种方法非常麻烦,效率很低。Qt提供了布局管理器来管理窗口的布局。

image-20220731144252290

分类

一个窗口只能有一个布局管理器,但是布局管理器可以嵌套,布局管理器分为以下三种:

水平布局管理器 ---------- QHBoxLayout
垂直布局管理器 ---------- QVBoxLayout
网格布局管理器 ---------- QGridLayout

image-20220731144301130

布局管理器的使用

布局管理器的成员函数


addWidget(...) ------ 添加窗口部件到布局管理器
addLayout(...) ------ 添加布局管理器窗口部件到布局管理器

设置窗口的布局管理器

//布局管理器的父对象自动变为其所在窗口,
//窗口的成员函数
setLayout(....);

不要用this去传父对象

网格布局管理器添加窗口部件

addWidget(窗口部件,第几行,第几列); 

//网格布局管理器不会显示空行格和空列              

利用布局管理器嵌套实现以下界面

image-20220731144308464

练习:

使用布局管理器管理昨天作业的窗口,实现如下布局效果

image-20220731144315930

三大窗口类

介绍

QWidget ------ 标准窗口
QMainWindow ------ 主窗口  //布局管理器可能起不了作用	
QDialog ------ 对话框
//QMainWindow和QDialog都是QWidget的子类

窗口部件

QLabel ----- 标签
QPushButton ----- 按钮
QLineEdit ----- 行编辑器
单选按钮
单选框/复选框
滑动条
进度条
部件框
组合框
自选框
下拉列表框
.....

使用QDialog实现登录界面

由于登录界面要得到界面操作的结果,优先选择使用对话框来实现。

标准对话框(QDialog)可以设置返回值和退出状态

成员函数exec() -------- 显示对话框,阻塞等待用户操作的结果
QDialog::accept() ----- 隐藏对话框,同时让exec返回QDialog::Accepted   //接收
QDialog::reject() ----- 隐藏对话框,同时让exec返回QDialog::Rejected  //拒绝两者返回值不同
QDialog::done(int r) ----- 关闭对话框,同时exec返回r  //传100也能登录成功,要在前面函数设置this->done(1000)

消息对话框 ----------- QMessageBox

成员函数:

setText ---------- 设置显示的文字
setIcon ---------- 设置显示的图标
setStandardButtons ------- 设置按钮
exec ----------- 显示消息对话框,等待用户操作得到结果
//exec的返回值取决于点击的按钮

//静态函数 --------- 直接生成消息对话框
QMessageBox::warning(父对象,标题,显示文字,显示按钮);
QMessageBox::information(...);

练习:

为登录界面设计登录成功和用户名或密码错误的消息对话框。

往项目中添加新的窗口,其实就是添加新的类

右键项目名 ===> Add New... ===> C++ Class ===>
设置类名和集成关系 ===> 选择要添加的项目 ===>完成

常见的对话框

消息对话框 -------- QMessageBox

文件对话框 -------- QFileDialog

另存为的那个对话框

静态函数:
    getOpenFileName(父对象,标题,默认目录,过滤器); ------ 获取打开文件的路径
    getSaveFileName(/*同上*/); ------ 获取保存文件的路径
    getExistDirectory(父对象,标题,默认目录); ------- 获取已存在的目录的路径

输入对话框

静态函数:
    getText(父对象,标题,提示信息); ----- 获取输入的字符串
    getInt(父对象,标题,提示信息); ----- 获取输入的整数
    getDouble(父对象,标题,提示信息); ----- 获取输入的浮点数

颜色对话框

静态函数:
    getColor(默认颜色,父对象,标题); ------- 获取QColor对象

字体对话框


         静态函数:
             getFont(bool变量的地址,父对象); ------- 获取QFont对象

练习:

修改昨天的作业,设计为3个按钮,分别设置标签的内容,颜色,字体。

//otherdialog.h
    
    
#ifndef OTHERDIALOG_H
#define OTHERDIALOG_H

#include <QWidget>
#include <QLabel>
#include <QPushButton>

class OtherDialog : public QWidget
{
    Q_OBJECT

public:
    OtherDialog(QWidget *parent = nullptr);
    ~OtherDialog();

private:
    QLabel *lab;

     QPushButton *btn;
      QPushButton *btn1;
       QPushButton *btn2;
};
#endif // OTHERDIALOG_H
//main.cpp
#include "otherdialog.h"

#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    OtherDialog w;

    w.resize(800,480);

    w.show();
    return a.exec();
}
//otherdialog.cpp
#include "otherdialog.h"
#include <QFileDialog>//文件对话框
#include <QDebug>
#include <QInputDialog>//输入对话框
#include <QColorDialog>//颜色对话框
#include <QFontDialog>//字体对话框

OtherDialog::OtherDialog(QWidget *parent)
    : QWidget(parent)
{
    lab = new QLabel("Hello,世界",this);
    btn = new QPushButton("改字体",this);
     btn1 = new QPushButton("改颜色",this);
      btn2 = new QPushButton("改内容",this);

    lab->move(380,200);
    btn->move(380,300);
    btn1->move(380,350);
    btn2->move(380,400);

    lab->resize(200,50);

    QObject::connect(btn,&QPushButton::clicked,this,[&](){


        //QString str = QInputDialog::getText(this,"说明信息","请输入你的简介");
        //int num = QInputDialog::getInt(this,"说明信息","请输入你的身高",170);
        //double num = QInputDialog::getDouble(this,"说明信息","请输入你的身高");
        //qDebug()<<str;
        //lab->setText(str);
        //lab->setNum(num);

        bool flag = true;
        QFont f = QFontDialog::getFont(&flag,this);
        lab->setFont(f);
    });
    QObject::connect(btn1,&QPushButton::clicked,this,[&](){


        QColor c = QColorDialog::getColor(Qt::black,this,"选择字体颜色");
        QPalette p;
        p.setColor(QPalette::WindowText,c);
        lab->setPalette(p);


    });
    QObject::connect(btn2,&QPushButton::clicked,this,[&](){


        QString str = QInputDialog::getText(this,"内容修改","请输入你的内容");
        qDebug()<<str;
        lab->setText(str);


    });
}

OtherDialog::~OtherDialog()
{
}

窗口部件

QLabel ------ 标签

setBuddy(窗口部件); ----------- 设置伙伴

QPushButton ------ 按

信号:
    clicked() --------- 点击
    pressed() --------- 按下
    released() -------- 松开

QLineEdit ------ 行编辑器

text() ---------- 获取行编辑器中的内容
信号:
    textChanged(const QString &text); ------- 文本改变
    textEdited(const QString &text); -------- 文本编辑(通过代码修改不会触发)
    returnPressed(); ----------- 选中按回车键

作业:

将登录框的布局管理器改为嵌套

将登录成功的界面改为ChangeLab

当输入的用户名和密码错误时,弹出消息对话框,提示是否重新输入,点Yes清楚Edit内容,点No就不清楚