Qt自定义标题栏

Qt自带的标题栏确实不美观,直接开门见山自定义标题栏

markdown 的语法排版都不熟悉，凑合看吧.

自定义标题栏说白了就是摒弃原来的那套标题栏。 继承QWidget 实现一下基本的 最大化 最小化和关闭,当然也可以加上一写属于自己的东西

效果图：

为啥颜色是黑色的？因为我加载了 qss（qss网上有好多例子，我这个写的也不好看）， 下面上自定义标题栏的代码

这是 customTitleBar 的Ui 上面放了几个button和icon（icon资源的话去阿里巴巴矢量图我感觉挺不错的）

customtitlebar.h

#ifndef CUSTOMTITLEBAR_H
#define CUSTOMTITLEBAR_H

#include <QWidget>

namespace Ui {
class CustomTitleBar;
}

class CustomTitleBar : public QWidget
{
    Q_OBJECT

public:
    explicit CustomTitleBar(QWidget *parent = 0);
    ~CustomTitleBar();
signals:

    void homePageSignal();
    void searchSignal(QString musicName);

    void loginSignal();
    void skinSignal();
    void settingSignal();

    void closeButtonSignal();


private slots:
    void on_HomePageButton_clicked();

    void on_SearchButton_clicked();

    void on_LoginButton_clicked();

    void on_SkinButton_clicked();

    void on_ButtonClicked();

    void on_SettingButton_clicked();

protected:
    virtual void mouseDoubleClickEvent(QMouseEvent *event);

    virtual void mousePressEvent(QMouseEvent *event);

    virtual void resizeEvent(QResizeEvent *event);

private:
    Ui::CustomTitleBar *ui;
};

#endif // CUSTOMTITLEBAR_H

customtitlebar.cpp

#include "customtitlebar.h"
#include "ui_customtitlebar.h"
#include <QMouseEvent>
#include <qt_windows.h>

#ifdef Q_OS_WIN
#pragma comment(lib,"user32.lib")
#include <qt_windows.h>
#endif

CustomTitleBar::CustomTitleBar(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::CustomTitleBar)
{
    ui->setupUi(this);
    setAttribute(Qt::WA_StyledBackground, true);
    this->setWindowFlag(Qt::FramelessWindowHint);

    connect(ui->CloseButton,&QPushButton::clicked,this,&CustomTitleBar::on_ButtonClicked);
    connect(ui->MaxSizeButton,&QPushButton::clicked,this,&CustomTitleBar::on_ButtonClicked);
    connect(ui->MinSizeButton,&QPushButton::clicked,this,&CustomTitleBar::on_ButtonClicked);
}

CustomTitleBar::~CustomTitleBar()
{
    delete ui;
}

void CustomTitleBar::on_HomePageButton_clicked()
{
    emit homePageSignal();
}

void CustomTitleBar::on_SearchButton_clicked()
{
    emit searchSignal(QString("Music Name"));
}

void CustomTitleBar::on_LoginButton_clicked()
{
    emit loginSignal();
}

void CustomTitleBar::on_SkinButton_clicked()
{
    emit skinSignal();
}


void CustomTitleBar::on_ButtonClicked()
{
    QPushButton* pButton = qobject_cast<QPushButton*>(sender());
    QWidget* pWindow = this->parentWidget();

    //pWindow 是顶级窗口
    if(pWindow->isTopLevel())
    {
        if(pButton == ui->MinSizeButton)
            pWindow->showMinimized();
        else if(pButton == ui->MaxSizeButton)
            pWindow->isMaximized()?pWindow->showNormal():pWindow->showMaximized();
        else if(pButton == ui->CloseButton)
        {
            emit closeButtonSignal();
            pWindow->close();
        }
    }
}

void CustomTitleBar::mouseDoubleClickEvent(QMouseEvent *event)
{
    if(event->button() == Qt::LeftButton)
        emit ui->MaxSizeButton->clicked();
}

void CustomTitleBar::mousePressEvent(QMouseEvent *event)
{
#ifdef Q_OS_WIN
    if(ReleaseCapture())
    {
       QWidget *pWindow = this->parentWidget();
       if(pWindow->isTopLevel())
           SendMessage(HWND(pWindow->winId()),WM_SYSCOMMAND,SC_MOVE + HTCAPTION,0);

    }
#endif

}

void CustomTitleBar::resizeEvent(QResizeEvent *event)
{
    QWidget* pWindow = this->parentWidget();
    if(pWindow->isTopLevel())
    {
        bool bMaximize = pWindow->isMaximized();
        if(bMaximize)
        {
            ui->MaxSizeButton->setToolTip(QStringLiteral("恢复"));
            ui->MaxSizeButton->setIcon(QPixmap(":/ResourcesImage/normal.png"));
        }
        else
        {
            ui->MaxSizeButton->setToolTip(QStringLiteral("最大化"));
            ui->MaxSizeButton->setIcon(QPixmap(":/ResourcesImage/max.png"));
        }
        ui->MaxSizeButton->setStyle(QApplication::style());
    }
}





void CustomTitleBar::on_SettingButton_clicked()
{
    emit settingSignal();
}

这里面 加了一些其他按钮的信号 如果只实现最基本的标题栏,那些都可以去掉 （我这里写的为下一步其他的功能用的）

下一步就是在主窗口中显示自定义的标题栏（拖一个QWiget 提升一下部件就好）

下面来看一下主窗口的代码（很简单了取消原有的标题栏，给自定义标题栏安装事件过滤器）

mainwidget.h

#ifndef MAINWIDGET_H
#define MAINWIDGET_H

#include <QWidget>

namespace Ui {
class MainWidget;
}

class MainWidget : public QWidget
{
    Q_OBJECT

public:
    explicit MainWidget(QWidget *parent = 0);
    ~MainWidget();
    void initUi();

private:
    Ui::MainWidget *ui;
};

#endif // MAINWIDGET_H

mainwidget.cpp

扫描二维码关注公众号，回复： 2516042 查看本文章

“`
include “mainwidget.h”（前面还有个# 但是markdown语法搞的 加上#就变成一级标题栏了 影响美观）
include “ui_mainwidget.h”（前面还有个# 但是markdown语法搞的 加上#就变成一级标题栏了 影响美观）

MainWidget::MainWidget(QWidget *parent) :
QWidget(parent),
ui(new Ui::MainWidget)
{
ui->setupUi(this);
initUi();
}

MainWidget::~MainWidget()
{
delete ui;
}

void MainWidget::initUi()
{
setWindowFlags(Qt::FramelessWindowHint);
installEventFilter(ui->customTitleBar);

}

这样的话功能就实现了 美化的话就要写qss 和 加一些图片资源了这里我就不多说了

                                —— 1998年的菜鸡码农一枚，请大佬们多多照顾，多谢多谢。