持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第7天，点击查看活动详情

📒博客首页：何名取的个人主页 - 文章 - 掘金 (juejin.cn)
🎉欢迎关注🔎点赞👍收藏⭐️留言📝
❤️期待一起交流！
🙏作者水平很有限，如果发现错误，求告知，多谢！
🌺有问题可私信交流！！！

不好用，自己造

众所周知Qt的标题栏是万年不变跟不上时代需求了，但凡对软件稍微有点审美要求的都会使用自己造的标题栏，这是因为在Qt5.15之前中没有直接针对标题栏自定义的API。既然不好用，咱就自己造。

前言

在创建工程时，我选择了QWidget基类，这是因为后期在进行界面美化时对标题栏的操作会更加方便。但是在前期就需要自己来绘制所有的标题栏上的控件了，这些控件主要就是logo、标题栏文字、窗口最小化、最大化/还原和关闭按钮，另外参考PyDracula风格，我添加了设置按钮。

去除原始标题栏

原始的程序标题栏默认是原生的Windows系统标题栏，如下图所示：既然已经决定要使用自定义的标题栏，原始的标题栏就不需要了，去除原始标题栏的方法很简单，只需要一句代码，在widget.cpp源文件的构造函数中添加：

    //设置无边框，使用自定义的边框
    setWindowFlags(Qt::FramelessWindowHint);

去除了原始标题栏后，就要开始创建自定义的标题栏了，这时需要用到一些图标。

图标资源

向Qt中添加资源时不能直接选择Add Existing Directory...，这样做Qt无法识别图片的Path和URL。而是应该选择先添加Qt的qrc资源文件，再向资源文件中添加图片文件。

右击工程文件夹，选择添加新文件

选择Files and Classes中的Qt，再选择Qt Resources file

右击qrc文件，这时就可以选择Add Existing Directory... 添加images文件夹了。

添加头文件

本节所需导入的头文件有两个：

#include <QPushButton>
#include <QLabel>

标题栏按钮

在widget.h头文件中添加private slots函数和private声明：

private slots:
    void on_btn_close_clicked();        //关闭按钮响应
    void on_btn_max_clicked();          //最大化按钮响应
    void on_btn_min_clicked();          //最小化按钮响应
    void on_btn_setting_clicked();      //设置按钮响应
private:
    QPushButton *btn_close;             //关闭按钮
    QPushButton *btn_min;               //最小换按钮
    QPushButton *btn_max;               //最大化按钮
    QPushButton *btn_setting;           //设置按钮
    
    bool winFlag;                       //窗口最大化标志位

在widget.cpp源文件中实例化按钮：

    //关闭按钮
    btn_close = new QPushButton;
    btn_close->setFixedSize(40,40);
    btn_close->setIcon(QIcon(":/images/images/black-guanbi.svg"));
    //最小化按钮
    btn_min = new QPushButton;
    btn_min->setFixedSize(40,40);
    btn_min->setIcon(QIcon(":/images/images/black-suoxiao.svg"));
    //最大化按钮
    btn_max = new QPushButton;
    btn_max->setFixedSize(40,40);
    btn_max->setIcon(QIcon(":/images/images/black-zuidahua.svg"));
    //设置按钮
    btn_setting = new QPushButton;
    btn_setting->setFixedSize(40,40);
    btn_setting->setIcon(QIcon(":/images/images/black-shezhi.svg"));

添加槽函数：

    //槽函数
    connect(btn_close,SIGNAL(clicked()),this,SLOT(on_btn_close_clicked()));
    connect(btn_min,SIGNAL(clicked()),this,SLOT(on_btn_min_clicked()));
    connect(btn_max,SIGNAL(clicked()),this,SLOT(on_btn_max_clicked()));
    connect(btn_setting,SIGNAL(clicked()),this,SLOT(on_btn_setting_clicked()));

按钮功能实现：

void Widget::on_btn_close_clicked()
{
    this->close();
}

void Widget::on_btn_max_clicked()
{
    if(winFlag)
    {
        setWindowState(Qt::WindowNoState);
        btn_max->setIcon(QIcon(":/images/images/black-zuidahua.svg"));
        winFlag = false;
    }else{
        setWindowState(Qt::WindowMaximized);
        btn_max->setIcon(QIcon(":/images/images/black-huanyuan.svg"));
        winFlag = true;
    }
}

void Widget::on_btn_min_clicked()
{
    setWindowState(Qt::WindowMinimized);
}

void Widget::on_btn_setting_clicked()
{
    //暂时放置，后期可以作为换肤或者其他功能设置按钮
}

标题栏标签

标题栏标签使用QLabel，扩展性高，方便后期美化时添加图标或图片，甚至可以做成不规则的形状。

在widget.h头文件中添加private slots函数和private声明：

QLabel *lab_title;                  //标题栏文字

在widget.cpp源文件中实例化标签：

    //title文字
    lab_title = new QLabel;
    lab_title->setText("Learning assistant");

这里不设置label的大小是因为后面会使用布局，布局会自动调整label的大小。

【自制软件】PDF学习宝-开发日记2--自定义标题栏