Qt之显示部件的理解使用与样式优化

1.QTextBrowser (只读多行浏览文本框)

  QTextBrowser类提供了一个带有超文本导航的富文本浏览器只能浏览不能编辑，而QTextEdit是可编辑
常用方法：
  setText //初始设置文本
  toPlainText() //获取文本

2.GraphicsView （管理2D图形图元视图）

  Graphics View提供了一个平面，用于管理和交互大量自定义的2D图形图元，
以及一个用于可视化图元的视图窗口小部件，支持缩放和旋转。
  GraphicsView框架结构主要包含三个主要的类QGraphicsScene（场景）、
QGraphicsView（视图）、QGraphicsItem（图元）。
  QGraphicsScene本身不可见，是一个存储图元的容器，必须通过与之相连的QGraphicsView视图来显示及与外界进行交互，主要提供图元的操作接口、传递事件和管理各个图元状态，提供无变换的绘制功能（如打印）；
  QGraphicsView提供一个可视的窗口，用于显示场景中的图元，一个场景中可以有多个视图。QGraphicsItem是场景中各个图元的基础类，
  QT提供了常用图形图元的标准类，如矩形(QGraphicsRectItem)、椭（QGraphicsEllipseItem)、文本(QGraphicsTextItem)。

3.QCalendarWidget (日历控件)

  原本的太丑，也不太灵活，重写了日历控件

4.QLCDNumber (LCD控件)

  主要用来展示LCD样式的数字，他可以显示几乎任何大小的数字，可以显示十进制，十六进制，八进制或二进制数，也可以展示一些简单的字符
常用方法：
  setDigitCount//设置显示的位数
  setMode //设置显示的模式 QLCDNumber::Dec：十进制
  setSegmentStyle //设置显示的外观

5.QProgressBar （进度条）

常用方法：
  setRange(0,100); //设置进度条最小值和最大值(取值范围)
  setMinimum(0); //设置进度条最小值
  setMaximum(100); //设置进度条最大值
  setValue(50); //设置当前的运行值
  reset(); //让进度条重新回到开始
  setOrientation(Qt::Horizontal); //水平方向
  setOrientation(Qt::Vertical); //垂直方向
  setAlignment(Qt::AlignVCenter); // 对齐方式
  setTextVisible(false); //隐藏进度条文本
  setFixedSize(258,5); //进度条固定大小
  setInvertedAppearance(true); //true:反方向 false:正方向
  setVisible(false); //false:隐藏进度条 true:显示进度条

6.Line (分割线)

  给分割线设置颜色并让其生效，必须设置“frameShadow”属性为“Plain”，同时使用样式表设置该分割线的颜色为指定颜色

7.QOpenGLWidget （OpenGL窗体）

  QGLWidget(旧)与QOpenGLWidget（新的替代品）：
  QOpenGLWidget提供了三个方便的虚拟函数，可以在子类中重新实现这些函数来执行典型的OpenGL任务
  paintGL()：渲染OpenGL场景;resizeGL ()：设置OpenGL视区、投影等;initializeGL()：设置OpenGL呈现上下文，定义显示列表等

  一般通过重写进行图像绘制

8.QQuickWidget （嵌入qml窗体）

  是 QT 中专门用于将 qml 实现的窗口界面嵌入 QWidget 或 QMainWindow 的控件
常用方法：
  setSource //设置加载资源

代码：

widgetdisplay.h

#ifndef WIDGETDISPLAY_H
#define WIDGETDISPLAY_H

#include <QWidget>
#include <QOpenGLWidget>
#include <QUrl>
#include <QGraphicsScene>

namespace Ui {
class WidgetDisplay;
}

class WidgetDisplay : public QWidget
{
    Q_OBJECT

public:
    explicit WidgetDisplay(QWidget *parent = nullptr);
    ~WidgetDisplay();

    //QTextBrowser
    void initTextBrowser();

    //GraphicsView 
    void initGraphicsView();

    //QCalendarWidget
    void initCalendarWidget();

    //QLCDNumber
    void initLcdNumber();

    //QProgressBar
    void initProgressBar();

    //QQuickWidget
    void initQuickWidget();
    //在与qml通信的时候，需要把函数接口暴露给qml需要在函数前面加入Q_INVOKABLE关键字，且需要注意成员函数的公有或私有类型
    Q_INVOKABLE QString sendData();

    void getValue(QString value);


public slots:
    //QLCDNumber
    void on_timeout();
    //QProgressBar
    void on_timeout2();


private slots:
    //GraphicsView
    void on_pushButton_rect_clicked();
    void on_pushButton_ellipse_clicked();
    void on_pushButton_circular_clicked();
    void on_pushButton_triangle_clicked();
    void on_pushButton_trapezoid_clicked();
    void on_pushButton_line_clicked();
    void on_pushButton_characters_clicked();
    void on_pushButton_zoomin_clicked();
    void on_pushButton_zoomout_clicked();
    void on_pushButton_leftR_clicked();
    void on_pushButton_rightR_clicked();
    void on_pushButton_Front_clicked();
    void on_pushButton_Back_clicked();
    void on_pushButton_Delete_clicked();
    void on_pushButton_Restore_clicked();
    void on_pushButton_Group_clicked();
    void on_pushButton_GroupBreak_clicked();

protected:
    void changeEvent(QEvent* event);

private:
    void retranslateUi();


private:
    Ui::WidgetDisplay *ui;

private:
    QTimer *m_pTimer;

    QTimer *m_pTimer2;
    int m_nPercentage;

    int m_frontZ;
    int m_seqNum;
    int m_backZ;
    static const int s_ItemId = 1;   //绘图项自定义数据的key
    static const int s_ItemDesciption = 2;   //绘图项自定义数据的key
    QGraphicsScene  *m_scene;
};

#endif // WIDGETDISPLAY_H

widgetdisplay.cpp

#include "widgetdisplay.h"
#include "ui_widgetdisplay.h"
#include <QTimer>
#include "commondef.h"
#include <QQuickItem>
#include <QQmlApplicationEngine>
#include <QQuickView>
#include <QQmlContext>
#include <QGraphicsRectItem>
#include <QInputDialog>

#include <QPainter>

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

    initTextBrowser();

    initGraphicsView();

    initCalendarWidget();

    initLcdNumber();

    initProgressBar();

    initQuickWidget();
    getValue("99");

    retranslateUi();
}

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

/*************************
 * QTextBrowser
 * ***********************/
void WidgetDisplay::initTextBrowser()
{
    ui->textBrowser->setText("Hello World");

    QString file = ":/Resource/Image/WidgetInput/testinput.jpg";

    MY_DEBUG << "textBrowser text:" << ui->textBrowser->toPlainText().trimmed();
    MY_DEBUG << "textBrowser html:" << ui->textBrowser->toHtml();
}

/*************************
 * QGraphicsView
 * ***********************/
void WidgetDisplay::initGraphicsView()
{
    //创建QGraphicsScene
    m_scene = new QGraphicsScene(-300,-200,600,200);
    //与view关联
    ui->graphicsView->setScene(m_scene);

    ui->graphicsView->setCursor(Qt::CrossCursor); //设置鼠标
    ui->graphicsView->setMouseTracking(true); //
    ui->graphicsView->setDragMode(QGraphicsView::RubberBandDrag);
}

/*************************
 * QCalendarWidget
 * ***********************/
void WidgetDisplay::initCalendarWidget()
{
    ui->calendarWidget->testVectorData();
}

void WidgetDisplay::on_pushButton_rect_clicked()
{
    //添加一个矩形
    QGraphicsRectItem   *item = new QGraphicsRectItem(-50,-25,100,50);//x,y 为左上角的图元局部坐标，图元中心点为0,0
    item->setFlags(QGraphicsItem::ItemIsMovable
                   | QGraphicsItem::ItemIsSelectable
                   | QGraphicsItem::ItemIsFocusable);
    item->setBrush(QBrush(Qt::yellow));
    item->setZValue(++m_frontZ);
    item->setPos(-50+(qrand() % 100), -50+(qrand() % 100));

    item->setData(s_ItemId, ++m_seqNum);
    item->setData(s_ItemDesciption, "Rect");

    m_scene->addItem(item);
    m_scene->clearSelection();
    item->setSelected(true);

}

void WidgetDisplay::on_pushButton_ellipse_clicked()
{
    //添加一个椭圆
    QGraphicsEllipseItem   *item=new QGraphicsEllipseItem(-50,-30,100,60);
    item->setFlags(QGraphicsItem::ItemIsMovable
                   | QGraphicsItem::ItemIsSelectable
                   | QGraphicsItem::ItemIsFocusable);
    item->setBrush(QBrush(Qt::blue)); //填充颜色
    item->setZValue(++m_frontZ); //用于叠放顺序
    item->setPos(-50+(qrand() % 100),-50+(qrand() % 100)); //初始位置
    item->setData(s_ItemId,++m_seqNum);  //自定义数据，ItemId键
    item->setData(s_ItemDesciption,"Ellipse"); //自定义数据，ItemDesciption键

    m_scene->addItem(item);
    m_scene->clearSelection();
    item->setSelected(true);
}

void WidgetDisplay::on_pushButton_circular_clicked()
{
    //添加圆形
    QGraphicsEllipseItem   *item=new QGraphicsEllipseItem(-50,-50,100,100);
    item->setFlags(QGraphicsItem::ItemIsMovable
                   | QGraphicsItem::ItemIsSelectable
                   | QGraphicsItem::ItemIsFocusable);
    item->setBrush(QBrush(Qt::cyan));
    item->setZValue(++m_frontZ);
    item->setPos(-50+(qrand() % 100),-50+(qrand() % 100));

    item->setData(s_ItemId,++m_seqNum);
    item->setData(s_ItemDesciption,"Circular");

    m_scene->addItem(item);
    m_scene->clearSelection();
    item->setSelected(true);
}

void WidgetDisplay::on_pushButton_triangle_clicked()
{
    //添加三角形
    QGraphicsPolygonItem   *item=new QGraphicsPolygonItem;
    QPolygonF   points;
    points.append(QPointF(0,-40));
    points.append(QPointF(60,40));
    points.append(QPointF(-60,40));
    item->setPolygon(points);
    item->setPos(-50+(qrand() % 100),-50+(qrand() % 100));

    item->setFlags(QGraphicsItem::ItemIsMovable
                   | QGraphicsItem::ItemIsSelectable
                   | QGraphicsItem::ItemIsFocusable);
    item->setBrush(QBrush(Qt::magenta));
    item->setZValue(++m_frontZ);

    item->setData(s_ItemId, ++m_seqNum);
    item->setData(s_ItemDesciption, "Triangle");

    m_scene->addItem(item);
    m_scene->clearSelection();
    item->setSelected(true);

}

void WidgetDisplay::on_pushButton_trapezoid_clicked()
{
    //添加一个梯形
    QGraphicsPolygonItem   *item=new QGraphicsPolygonItem;

    QPolygonF   points;
    points.append(QPointF(-40,-40));
    points.append(QPointF(40,-40));
    points.append(QPointF(100,40));
    points.append(QPointF(-100,40));
    item->setPolygon(points);
    item->setPos(-50+(qrand() % 100),-50+(qrand() % 100));

    item->setFlags(QGraphicsItem::ItemIsMovable
                   | QGraphicsItem::ItemIsSelectable
                   | QGraphicsItem::ItemIsFocusable);
    item->setBrush(QBrush(Qt::green));
    item->setZValue(++m_frontZ);

    item->setData(s_ItemId,++m_seqNum);
    item->setData(s_ItemDesciption,"Trapezoid");

    m_scene->addItem(item);
    m_scene->clearSelection();
    item->setSelected(true);
}

void WidgetDisplay::on_pushButton_line_clicked()
{
    //添加直线
    QGraphicsLineItem   *item=new QGraphicsLineItem(-100,0,100,0);//x,y 为左上角的图元局部坐标，图元中心点为0,0
    item->setFlags(QGraphicsItem::ItemIsMovable
                   | QGraphicsItem::ItemIsSelectable
                   | QGraphicsItem::ItemIsFocusable);

    QPen    pen(Qt::red);
    pen.setWidth(3);
    item->setPen(pen);

    item->setZValue(++m_frontZ);
    item->setPos(-50+(qrand() % 100),-50+(qrand() % 100));

    item->setData(s_ItemId,++m_seqNum);
    item->setData(s_ItemDesciption,"Line");

    m_scene->addItem(item);
    m_scene->clearSelection();
    item->setSelected(true);

}

void WidgetDisplay::on_pushButton_characters_clicked()
{
    //添加文字
    QString str= QInputDialog::getText(this,"Input Characters","Please Input Characters");
    if (str.isEmpty())
        return;

    QGraphicsTextItem   *item=new QGraphicsTextItem(str);

    QFont   font=this->font();
    font.setPointSize(20);
    font.setBold(true);
    item->setFont(font);

    item->setFlags(QGraphicsItem::ItemIsMovable
                   | QGraphicsItem::ItemIsSelectable
                   | QGraphicsItem::ItemIsFocusable);
    item->setPos(-50+(qrand() % 100),-50+(qrand() % 100));
    item->setZValue(++m_frontZ);

    item->setData(s_ItemId,++m_seqNum);
    item->setData(s_ItemDesciption,"Characters");

    m_scene->addItem(item);
    m_scene->clearSelection();
    item->setSelected(true);

}

void WidgetDisplay::on_pushButton_zoomin_clicked()
{
    //放大
    int cnt = m_scene->selectedItems().count();
    if (cnt==1)
    {
        QGraphicsItem   *item;
        item = m_scene->selectedItems().at(0);
        item->setScale(0.1+item->scale());
    }
    else
        ui->graphicsView->scale(1.1,1.1);
}

void WidgetDisplay::on_pushButton_zoomout_clicked()
{
    //缩小
    int cnt = m_scene->selectedItems().count();
    if (cnt==1)
    {
        QGraphicsItem   *item;
        item = m_scene->selectedItems().at(0);
        item->setScale(item->scale()-0.1);
    }
    else
        ui->graphicsView->scale(0.9,0.9);
}

void WidgetDisplay::on_pushButton_leftR_clicked()
{
    //逆时针旋转
    int cnt = m_scene->selectedItems().count();
    if (cnt==1)
    {
        QGraphicsItem* item = m_scene->selectedItems().at(0);
        item->setRotation(-30+item->rotation());
    }
    else
        ui->graphicsView->rotate(-30);
}

void WidgetDisplay::on_pushButton_rightR_clicked()
{
    //顺时针旋转
    int cnt = m_scene->selectedItems().count();
    if (cnt == 1)
    {
        QGraphicsItem* item = m_scene->selectedItems().at(0);
        item->setRotation(+30+item->rotation());
    }
    else
        ui->graphicsView->rotate(+30);

}

void WidgetDisplay::on_pushButton_Front_clicked()
{
    //bring to front,前置
    int cnt = m_scene->selectedItems().count();
    if (cnt>0)
    { //只处理选中的第1个绘图项
        QGraphicsItem* item = m_scene->selectedItems().at(0);
        item->setZValue(++m_frontZ);
    }
}

void WidgetDisplay::on_pushButton_Back_clicked()
{
    //bring to back，后置
    int cnt = m_scene->selectedItems().count();
    if (cnt>0)
    {//只处理选中的第1个绘图项
        QGraphicsItem* item = m_scene->selectedItems().at(0);
        item->setZValue(--m_backZ);
    }
}

void WidgetDisplay::on_pushButton_Delete_clicked()
{
    int cnt = m_scene->selectedItems().count();
    if (cnt>0)
    for (int i=0;i<cnt;i++)
    {
        QGraphicsItem* item = m_scene->selectedItems().at(0);
        m_scene->removeItem(item); //删除绘图项
    }
}

void WidgetDisplay::on_pushButton_Restore_clicked()
{
    //取消所有变换
    int cnt = m_scene->selectedItems().count();
    if (cnt==1)
    {
        QGraphicsItem* item = m_scene->selectedItems().at(0);
//      item->resetTransform();   //不起作用
        item->setRotation(0);
        item->setScale(1.0);
    }
    else
        ui->graphicsView->resetTransform();
}

void WidgetDisplay::on_pushButton_Group_clicked()
{
    //组合
    int cnt = m_scene->selectedItems().count();
    if (cnt>1)
    {
       QGraphicsItemGroup* group =new QGraphicsItemGroup; //创建组合
       m_scene->addItem(group); //组合添加到场景中

        for (int i=0;i<cnt;i++)
        {
            QGraphicsItem* item = m_scene->selectedItems().at(0);
            item->setSelected(false); //清除选择虚线框
            item->clearFocus();
            group->addToGroup(item); //添加到组合
        }
        group->setFlags(QGraphicsItem::ItemIsMovable
                       | QGraphicsItem::ItemIsSelectable
                       | QGraphicsItem::ItemIsFocusable);

        group->setZValue(++m_frontZ);
//        group->clearFocus();
        m_scene->clearSelection();
        group->setSelected(true);
     }
}

void WidgetDisplay::on_pushButton_GroupBreak_clicked()
{
    //break group,打散组合
    int cnt = m_scene->selectedItems().count();
    if (cnt==1)
    {
        QGraphicsItemGroup  *group;
        group=(QGraphicsItemGroup*)m_scene->selectedItems().at(0);
        m_scene->destroyItemGroup(group);
    }
}

/*************************
 * QLCDNumber
 * ***********************/
void WidgetDisplay::initLcdNumber()
{
    //设置显示的位数
    ui->lcdNumber->setDigitCount(8);
    //设置显示的模式为十进制
    ui->lcdNumber->setMode(QLCDNumber::Dec);
    //设置显示外观
    ui->lcdNumber->setSegmentStyle(QLCDNumber::Flat);

    m_pTimer = new QTimer();
    connect(m_pTimer, SIGNAL(timeout()), this, SLOT(on_timeout()));
    m_pTimer->start(1000);
}

void WidgetDisplay::on_timeout()
{
    QDateTime dateTime = QDateTime::currentDateTime();
    ui->lcdNumber->display(dateTime.toString("yyyy-MM-dd hh:mm:ss"));
}

/*************************
 * QProgressBar
 * ***********************/
void WidgetDisplay::initProgressBar()
{
    ui->progressBar->hide();
    //取值范围
    ui->progressBar->setRange(0, 100);
    //设置当前的运行值
    ui->progressBar->setValue(0);
    m_nPercentage = 0;

    m_pTimer2 = new QTimer();
    connect(m_pTimer2, SIGNAL(timeout()), this, SLOT(on_timeout2()));
    m_pTimer2->start(500);
}

void WidgetDisplay::on_timeout2()
{
    ui->progressBar->show();
    m_nPercentage++;
    //MY_DEBUG << "m_nPercentage:" << m_nPercentage << ", maximum():" << ui->progressBar->maximum();
    if(m_nPercentage <= ui->progressBar->maximum())
    {
        ui->progressBar->setValue(m_nPercentage);
    }
    else
    {
        m_pTimer2->stop();
    }
}

/*************************
 * QQuickWidget
 * ***********************/
void WidgetDisplay::initQuickWidget()
{
    //设置加载资源
    QUrl soucre("qrc:/Resource/Qml/test.qml");
    //ui->quickWidget->rootContext()->setContextProperty("testData", this);//将变量设置到Qml环境中
    ui->quickWidget->setSource(soucre);
    //大小自动跟随QWidget
    ui->quickWidget->setResizeMode(QQuickWidget::SizeRootObjectToView);
    //背景透明
    ui->quickWidget->setAttribute(Qt::WA_AlwaysStackOnTop);
    ui->quickWidget->setClearColor(QColor(Qt::transparent));
}

QString WidgetDisplay::sendData()
{
    QString str = "blue";
    return str;
}

void WidgetDisplay::getValue(QString value)
{
    ui->quickWidget->rootContext()->setContextProperty("str_value", value);// 向qml传递数据
}

/
void WidgetDisplay::changeEvent(QEvent *event)
{
    switch(event->type())
    {
        case QEvent::LanguageChange:
            retranslateUi();
            break;
        default:
            QWidget::changeEvent(event);
    }
}

void WidgetDisplay::retranslateUi()
{
    ui->pushButton_Back->setText(tr("Back"));
    ui->pushButton_line->setText(tr("Line"));
    ui->pushButton_rect->setText(tr("Rect"));
    ui->pushButton_Front->setText(tr("Front"));
    ui->pushButton_Group->setText(tr("Group"));
    ui->pushButton_leftR->setText(tr("Left Rotate"));
    ui->pushButton_Delete->setText(tr("Delete"));
    ui->pushButton_rightR->setText(tr("Right Rotate"));
    ui->pushButton_zoomin->setText(tr("Zoom In"));
    ui->pushButton_Restore->setText(tr("Restore"));
    ui->pushButton_ellipse->setText(tr("Ellipse"));
    ui->pushButton_zoomout->setText(tr("Zoom Out"));
    ui->pushButton_circular->setText(tr("Circle"));
    ui->pushButton_triangle->setText(tr("Triangle"));
    ui->pushButton_trapezoid->setText(tr("trapezoid"));
    ui->pushButton_GroupBreak->setText(tr("GroupBreak"));
    ui->pushButton_characters->setText(tr("Characters"));
}

customcalendar.h

#ifndef CUSTOMCALENDAR_H
#define CUSTOMCALENDAR_H

#include <QCalendarWidget>
#include <QVector>
#include <QMutex>

class QPushButton;
class QLabel;
class CustomCalendar : public QCalendarWidget
{
    Q_OBJECT

public:
    CustomCalendar(QWidget *parent);
    ~CustomCalendar();

    void clearVectorData();

    //test
    void testVectorData();
private:
    void initControl();
    void initTopWidget();

    void setDataLabelTimeText(int year, int month);

signals:
   void signalSetCalendarTime(const QDate& data);
   void signalClickCalendarDate(QDate data);

private slots:
   void onbtnClicked();
   void onCalendarClicked(QDate date);

protected:
    void paintCell(QPainter *painter, const QRect &rect, const QDate &date) const;

private:
    QPushButton* m_leftYearBtn;
    QPushButton* m_leftMonthBtn;

    QPushButton* m_rightYearBtn;
    QPushButton* m_rightMonthBtn;

    QPushButton* m_ensureBtn;
    QPushButton* m_toDayBtn;

    QLabel* m_dataLabel;

public:
    QVector<QDate> m_vCommVideo;

    mutable QMutex m_lDataLock;
};

#endif

customcalendar.cpp

#include "customcalendar.h"
#include <QLocale>
#include <QPainter>
#include <QTextCharFormat>
#include <QProxyStyle>
#include <QTableView>
#include <QLayout>
#include <QPushButton>
#include <QLabel>
#include <QDebug>
#include "commondef.h"

class QCustomStyle : public QProxyStyle
{
public:
    QCustomStyle(QWidget *parent){
        setParent(parent);
    }

private:
    void drawPrimitive(PrimitiveElement element, const QStyleOption *option,
        QPainter *painter, const QWidget *widget) const
    {
        if (element == PE_FrameFocusRect)
        {
            return;
        }
        QProxyStyle::drawPrimitive(element, option, painter, widget);
    }
};

CustomCalendar::CustomCalendar(QWidget *parent)
    : QCalendarWidget(parent)
{
    m_vCommVideo.clear();

    connect(this ,SIGNAL(clicked(QDate)), this, SLOT(onCalendarClicked(QDate)));
    initControl();
}

CustomCalendar::~CustomCalendar()
{
}

void CustomCalendar::initControl()
{
    layout()->setSizeConstraint(QLayout::SetMinAndMaxSize);

    setLocale(QLocale(QLocale::Chinese));//设置语言
    setNavigationBarVisible(true);//该属性保持是否显示导航栏
    setVerticalHeaderFormat(QCalendarWidget::NoVerticalHeader);//设置垂直标题的格式
    setHorizontalHeaderFormat(QCalendarWidget::SingleLetterDayNames);//设置水平标题的格式
    setSelectionMode(QCalendarWidget::SingleSelection);//设置单选

    this->setStyleSheet("\
        QCalendarWidget QWidget{\
                        background-color:#0f6b9b;\
                        }\
        QCalendarWidget QTableView{\
                        background-color:rgb(0,104,139);\
                        }\
        QCalendarWidget QAbstractItemView:enabled\
                        {color:rgb(255,255,255);\
                        selection-background-color:rgb(0,104,139);\
                        selection-color:rgb(0,104,139);\
                        }\
        QCalendarWidget QAbstractItemView:disabled\
                        { color:#606266;\
                        }\
      ");
}

//通过重写virtual void paintCell, 实现自定义控件样式
void CustomCalendar::paintCell(QPainter *painter, const QRect &rect, const QDate &date) const
{
    bool bBrushAllRect = false;

    if (date == selectedDate())
    {
        bBrushAllRect = true;

        painter->save();
        painter->setRenderHint(QPainter::Antialiasing);
        painter->setPen(Qt::NoPen);
        painter->setBrush(QColor(0, 104, 139));
        painter->drawRoundedRect(rect.x(), rect.y(), rect.width(), rect.height(), 0, 0);
        painter->setBrush(QColor(127,255,212));
        painter->drawRoundedRect(rect.x() + 1, rect.y() + 2, rect.width() - 2, rect.height() - 4, 5, 5);
        painter->setPen(QColor(0,104,139));
        painter->drawText(rect, Qt::AlignCenter, QString::number(date.day()));
        painter->restore();
    }
    else if (date == QDate::currentDate())
    {
        bBrushAllRect = true;

        painter->save();
        painter->setRenderHint(QPainter::Antialiasing);
        painter->setPen(Qt::NoPen);
        painter->setBrush(QColor(0, 104, 139));
        painter->drawRoundedRect(rect.x(), rect.y(), rect.width(), rect.height(), 0, 0);
        painter->setBrush(QColor(30,144,255));
        painter->drawRoundedRect(rect.x() + 1, rect.y() + 2, rect.width() - 2, rect.height() - 4, 5, 5);
        painter->setPen(QColor(0, 104, 139));
        painter->drawText(rect, Qt::AlignCenter, QString::number(date.day()));
        painter->restore();
    }
    else if (date < minimumDate() || date > maximumDate())
    {
        painter->save();
        painter->setRenderHint(QPainter::Antialiasing);
        painter->setPen(Qt::NoPen);
        painter->setBrush(QColor(218, 218, 218));
        painter->drawRoundedRect(rect.x(), rect.y(), rect.width(), rect.height(), 0, 0);
        painter->setPen(QColor(0, 104, 139));
        painter->drawText(rect, Qt::AlignCenter, QString::number(date.day()));
        painter->restore();
    }
    else
    {
        //_super::指代的是父类
        __super::paintCell(painter, rect, date);
    }

    //当前日期有包含，则绘制蓝点
    m_lDataLock.lock();
    if(m_vCommVideo.contains(date))
    {
        painter->save();
        painter->setRenderHint(QPainter::Antialiasing);

        if(!bBrushAllRect)
        {
            painter->setPen(Qt::NoPen);
            painter->setBrush(QColor(0, 104, 139));
            painter->drawRoundedRect(rect.x(), rect.y(), rect.width(), rect.height(), 0, 0);
        }

        painter->setPen(QColor(Qt::blue));
        painter->setBrush(QBrush(Qt::blue));
        painter->drawEllipse(rect.x() + rect.width() / 2 - 2.5, rect.y() + rect.height() - 5, 4,4);
        painter->setPen(QColor(249, 249, 249));
        painter->drawText(rect, Qt::AlignCenter, QString::number(date.day()));
        painter->restore();
    }
    else
    {
    }
    m_lDataLock.unlock();
}

//导航栏重写
void CustomCalendar::initTopWidget()
{
    QWidget* topWidget = new QWidget(this);
    topWidget->setObjectName("CalendarTopWidget");
    topWidget->setFixedHeight(40);
    topWidget->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Fixed);

    QHBoxLayout* hboxLayout = new QHBoxLayout;
    hboxLayout->setContentsMargins(12, 0, 12, 0);
    hboxLayout->setSpacing(4);

    m_leftYearBtn   = new QPushButton(this);
    m_leftMonthBtn  = new QPushButton(this);
    m_rightYearBtn  = new QPushButton(this);
    m_rightMonthBtn = new QPushButton(this);
    m_dataLabel     = new QLabel(this);

    m_leftYearBtn->setObjectName("CalendarLeftYearBtn");
    m_leftMonthBtn->setObjectName("CalendarLeftMonthBtn");
    m_rightYearBtn->setObjectName("CalendarRightYearBtn");
    m_rightMonthBtn->setObjectName("CalendarRightMonthBtn");
    m_dataLabel->setObjectName("CalendarDataLabel");

    m_leftYearBtn->setFixedSize(16, 16);
    m_leftMonthBtn->setFixedSize(16, 16);
    m_rightYearBtn->setFixedSize(16, 16);
    m_rightMonthBtn->setFixedSize(16, 16);

    hboxLayout->addWidget(m_leftYearBtn);
    hboxLayout->addWidget(m_leftMonthBtn);
    hboxLayout->addStretch();
    hboxLayout->addWidget(m_dataLabel);
    hboxLayout->addStretch();
    hboxLayout->addWidget(m_rightMonthBtn);
    hboxLayout->addWidget(m_rightYearBtn);
    topWidget->setLayout(hboxLayout);

    //这里见下图1
    QVBoxLayout *vBodyLayout = qobject_cast<QVBoxLayout *>(layout());
    vBodyLayout->insertWidget(0, topWidget);

    connect(m_leftYearBtn,   SIGNAL(clicked()),  this, SLOT(onbtnClicked()));
    connect(m_leftMonthBtn,  SIGNAL(clicked()),  this, SLOT(onbtnClicked()));
    connect(m_rightYearBtn,  SIGNAL(clicked()),  this, SLOT(onbtnClicked()));
    connect(m_rightMonthBtn, SIGNAL(clicked()),  this, SLOT(onbtnClicked()));

    setDataLabelTimeText(selectedDate().year(), selectedDate().month());
}

void CustomCalendar::setDataLabelTimeText(int year, int month)
{
    m_dataLabel->setText(QString("%1-%2").arg(year).arg(month));
}

void CustomCalendar::onbtnClicked()
{
    QPushButton *senderBtn = qobject_cast<QPushButton *>(sender());
    if (senderBtn == m_leftYearBtn)
    {
        showPreviousYear();
    }
    else if (senderBtn == m_leftMonthBtn)
    {
        showPreviousMonth();
    }
    else if (senderBtn == m_rightYearBtn)
    {
        showNextYear();
    }
    else if (senderBtn == m_rightMonthBtn)
    {
        showNextMonth();
    }
}

void CustomCalendar::onCalendarClicked(QDate date)
{
    //FF_DEBUG<<"CustomCalendar::onCalendarClicked date"<<date << " selectedDate():"<<selectedDate();
    //选择日期 发送信号 绘制对应日期的滑动条

    MY_DEBUG << "date.year(): " << date.year() << "date.day():" << date.day();
    //emit signalClickCalendarDate(date);
}

void CustomCalendar::clearVectorData()
{
    m_vCommVideo.clear();
}

void CustomCalendar::testVectorData()
{
    QDate dCommVideo;
    dCommVideo.setDate(2022, 9, 1);
    m_vCommVideo.push_back(dCommVideo);
    dCommVideo.setDate(2022, 9, 2);
    m_vCommVideo.push_back(dCommVideo);
}

qwgraphicsview.h

#ifndef QWGRAPHICSVIEW_H
#define QWGRAPHICSVIEW_H

#include <QObject>
#include <QGraphicsView>
#include "qwgraphicsview.h"

class QWGraphicsView : public QGraphicsView
{
    Q_OBJECT

    protected:
    void mouseMoveEvent(QMouseEvent *event);
    void mousePressEvent(QMouseEvent *event);
    void mouseDoubleClickEvent(QMouseEvent *event);
    void keyPressEvent(QKeyEvent *event);
    public:
    QWGraphicsView(QWidget *parent = 0);

    signals:
    void mouseMovePoint(QPoint point); //鼠标移动
    void mouseClicked(QPoint point); //鼠标单击
    void mouseDoubleClick(QPoint point); //双击事件
    void keyPress(QKeyEvent *event); //按键事件

};

#endif // QWGRAPHICSVIEW_H

qwgraphicsview.cpp

#include "qwgraphicsview.h"
#include <QMouseEvent>
#include <QPoint>

//鼠标移动事件
void QWGraphicsView::mouseMoveEvent(QMouseEvent *event)
{
    QPoint point=event->pos(); //QGraphicsView的坐标
    emit mouseMovePoint(point); //释放信号
    QGraphicsView::mouseMoveEvent(event);
}

//鼠标左键按下事件
void QWGraphicsView::mousePressEvent(QMouseEvent *event)
{
    if (event->button()==Qt::LeftButton)
    {
        QPoint point=event->pos(); //QGraphicsView的坐标
        emit mouseClicked(point);//释放信号
    }
    QGraphicsView::mousePressEvent(event);
}

//鼠标双击事件
void QWGraphicsView::mouseDoubleClickEvent(QMouseEvent *event)
{
    if (event->button()==Qt::LeftButton)
    {
        QPoint point=event->pos(); //QGraphicsView的坐标
        emit mouseDoubleClick(point);//释放信号
    }
    QGraphicsView::mouseDoubleClickEvent(event);
}

//按键事件
void QWGraphicsView::keyPressEvent(QKeyEvent *event)
{
    emit keyPress(event);
    QGraphicsView::keyPressEvent(event);
}

QWGraphicsView::QWGraphicsView(QWidget *parent):QGraphicsView(parent)
{
}

myglwidget.h

#ifndef MYGLWIDGET_H
#define MYGLWIDGET_H

#include <QMainWindow>
#include <QObject>
#include <QWidget>
#include <QOpenGLWidget>
#include <QOpenGLFunctions>
#include <QOpenGLShaderProgram>
#include <QOpenGLBuffer>
#include <QOpenGLVertexArrayObject>

class myGlWidget : public QOpenGLWidget , protected QOpenGLFunctions
{
    Q_OBJECT
    public:

    myGlWidget(QWidget *parent = nullptr);
    protected:

    void paintGL() ;
    void initializeGL() ;
    void resizeEvent(QResizeEvent *e) ;


    private:
    QOpenGLShaderProgram *program;

    QOpenGLVertexArrayObject vao;
    QOpenGLBuffer vbo;

};

#endif // MYGLWIDGET_H

myglwidget.cpp

#include "myglwidget.h"
#define GL_VERSION  "#version 330 core\n"

#define GLCHA(x)  #@x           //加单引号,将x变为字符
#define GLSTR(x)  #x            //加双引号，将x变为字符串
#define GET_GLSTR(x) GL_VERSION#x


const char *vsrc = GET_GLSTR(
    layout (location = 0) in vec3 aPos;
    void main(void)
    {
      gl_Position = vec4(aPos.x, aPos.y, aPos.z, 1.0);
    }
);

const char *fsrc =GET_GLSTR(
            out vec4 FragColor;
            void main(void)
            {
              FragColor = vec4(1.0f, 1.0f, 0.0f, 1.0f);
            }
);

myGlWidget::myGlWidget(QWidget *parent):QOpenGLWidget(parent)
{
}

void myGlWidget::paintGL()
{
   // 绘制
  // glViewport(0, 0, width(), height());

   glClear(GL_COLOR_BUFFER_BIT);

   // 渲染Shader
   program->bind(); //绑定激活Program对象
   vao.bind();      //绑定激活vao
   glDrawArrays(GL_TRIANGLES, 0, 3);    //绘制3个定点,样式为三角形
   vao.release();       //解绑
   program->release();  //解绑

}
void myGlWidget::initializeGL()
{
   // 为当前环境初始化OpenGL函数
   initializeOpenGLFunctions();

   glClearColor(1.0f, 1.0f, 1.0f, 1.0f);    //设置背景色为白色

   //1.创建顶点着色器
   QOpenGLShader *vshader = new QOpenGLShader(QOpenGLShader::Vertex, this);
   vshader->compileSourceCode(vsrc);

   //2.创建片元着色器 rgba(1.0f, 1.0f, 0.0f, 1.0f)表示黄色,而alpha值为1.0,表示完全不透明
   QOpenGLShader *fshader = new QOpenGLShader(QOpenGLShader::Fragment, this);
   fshader->compileSourceCode(fsrc);

   //3.创建着色器程序
   program = new QOpenGLShaderProgram;
   program->addShader(vshader);
   program->addShader(fshader);
   program->link();
   program->bind();//激活Program对象

   //4.初始化VBO,将顶点数据存储到buffer中,等待VAO激活后才能释放
   float vertices[] = {
   -0.5f, -0.5f, 0.0f,
   0.5f, -0.5f, 0.0f,
   0.0f, 0.5f, 0.0f
   };

   vbo.create();
   vbo.bind();              //绑定到当前的OpenGL上下文,
   vbo.allocate(vertices, 9*sizeof(GLfloat));
   vbo.setUsagePattern(QOpenGLBuffer::StreamDraw);  //设置为一次修改，多次使用

   //5.初始化VAO,设置顶点数据状态(顶点，法线，纹理坐标等)
   vao.create();
   vao.bind();

   GLint aPos = program->attributeLocation("aPos");        //获取aPos位置
   if(aPos==-1)  //未找到
   {
       return;
   }
   program->setAttributeBuffer(aPos, GL_FLOAT, 0,  3, 0);   //设置顶点属性
   program->enableAttributeArray(aPos); //使能顶点属性

   //6.解绑所有对象
   vao.release();
   vbo.release();
   program->release();

}
void myGlWidget::resizeEvent(QResizeEvent *e)
{
}

样式优化

/*Display*/
/*QTextBrowser*/
QTextBrowser#textBrowser
{
    border:1px solid transparent;
    border-radius:2px;
    color: white;
    background-color: rgba(22,99,138,50%);
    border-color: rgba(0,156,255,50%);
    font-size: 12px;
    font-weight: 400;
    selection-background-color: #8c8c8c;
    selection-color:#e6e6e6;
    padding-left:6px;
    padding-right:6px;
}

QTextBrowser QScrollBar:vertical
{
    border: none;
    background: transparent;
    width: 6px;
}

QTextBrowser QScrollBar::handle:vertical
{
    background-color: rgb(13,74,107);
    min-height: 30px;
    border-radius:3px;
    width: 6px;
}

QTextBrowser QScrollBar::add-line:vertical
{
   border: none;
   height: 0px;
 }

QTextBrowser QScrollBar::sub-line:vertical
{
   border: none;
   height: 0px;
}

QTextBrowser QScrollBar::add-page:vertical,QScrollBar::sub-page:vertical
{
    background:transparent;
    border-radius:3px;
}


QGraphicsView
{
    border:1px solid transparent;
    border-radius:2px;
    color: white;
    background-color: rgba(22,99,138,50%);
    border-color: rgba(0,156,255,50%);
}

/*QCalendarWidget*/
QCalendarWidget QToolButton
{
    padding-right: 20px;
}

/*QLcdNumber*/
QLCDNumber
{
    border:1px solid transparent;
    border-color: rgba(0,156,255,50%);
    border-radius:2px;
    color: white;
    background-color: rgba(22,99,138,50%);
    font-size:16px;
    font-weight: 400;
}

/*QProgressBar*/
QProgressBar
{
    height:21px;
    border-color: rgba(0,156,255,50%);
    border-radius:2px;
    text-align: center;
    color:red;
}
QProgressBar::chunk
{
    background-color:rgb(0,177,255);
    width:20px;
}

/*line*/
QFrame#line
{
    color:red;
}

QFrame#line_2
{
    color:blue;
}

实现效果：

工程下载路径：

https://download.csdn.net/download/linyibin_123/86512679