Qt中的QGraphicView和QGraphicScene简单使用

概述：我们利用QGraphicView和QGraphicScene来实现一个简单的视频播放器，然后上面悬浮一些操作的控件，看看怎么来实现。

1、CcTestVideoPlayer类

模拟播放器类，继承QGraphicScene

1.1 CcTestVideoPlayer.h

#pragma once#include <QGraphicsView>
#include <QGraphicsScene>
#include <QVariant>
#include <QSharedPointer>class CcTestVideoPlayer : public QGraphicsView
{Q_OBJECTpublic:CcTestVideoPlayer(QWidget *parent = nullptr, QGraphicsScene* scene = nullptr);~CcTestVideoPlayer(void);protected:void drawBackground(QPainter *painter, const QRectF &rect)override;};

1.2 CcTestVideoPlayer.cpp

#include "CcTestVideoPlayer.h"#include <QLabel>
#include <QStyle>
#include <QPainter>
#include <QPaintEngine>
#include <QGraphicsProxyWidget>
#include <QMenu>
#include <QApplication>
#include <QTimer>CcTestVideoPlayer::CcTestVideoPlayer(QWidget *parent, QGraphicsScene* scene): QGraphicsView(parent)
{if (scene){scene->setParent(this);}setScene(scene ? scene : new QGraphicsScene(this));auto widget = new QWidget;widget->setStyleSheet("background:white;");widget->setFixedSize(QSize(300,420));scene->addWidget(widget)->setZValue(101);
}CcTestVideoPlayer::~CcTestVideoPlayer()
{}void CcTestVideoPlayer::drawBackground(QPainter *painter, const QRectF &rect)
{QGraphicsView::drawBackground(painter, this->rect());painter->fillRect(geometry(), QBrush("#0c0b0f"));
}

2、CcTestVideoSurface

继承QGraphicsScene

2.1 CcTestVideoSurface.h

#pragma once#include <QGraphicsScene>
#include <QObject>
#include <QLabel>class CcTestVideoSurface : public QGraphicsScene
{Q_OBJECTpublic:CcTestVideoSurface(QObject *parent = Q_NULLPTR);virtual ~CcTestVideoSurface(void);void showTips();private:QLabel* m_tipsInfoLabel = nullptr;QWidget* m_containter = nullptr;
};

2.2 CcTestVideoSurface.cpp

#include "CcTestVideoSurface.h"#include <QGraphicsProxyWidget>
#include <QHBoxLayout>
#include <QVBoxLayout>CcTestVideoSurface::CcTestVideoSurface(QObject *parent): QGraphicsScene(parent)
{m_containter = new QWidget();m_containter->setObjectName(QStringLiteral("tip_container"));m_containter->setStyleSheet("#tip_container { background-color: transparent;}");m_tipsInfoLabel = new QLabel(nullptr);m_tipsInfoLabel->setFixedSize(120, 38);m_tipsInfoLabel->setObjectName(QStringLiteral("tip"));m_tipsInfoLabel->setStyleSheet("#tip { background-color: rgba(10,132,254,0.6); border: none; border-radius: 15px; font-size:12px; color:#edf1fa;}");m_tipsInfoLabel->setAlignment(Qt::AlignCenter);m_tipsInfoLabel->setText("测试悬浮在view");auto tipLayout = new QHBoxLayout;tipLayout->setSpacing(0);tipLayout->setMargin(0);tipLayout->addStretch();tipLayout->addWidget(m_tipsInfoLabel);tipLayout->addStretch();auto layout = new QVBoxLayout(m_containter);layout->setSpacing(0);layout->setMargin(0);layout->addStretch();layout->addLayout(tipLayout);layout->addSpacing(4);addWidget(m_containter)->setZValue(102);
}CcTestVideoSurface::~CcTestVideoSurface(void)
{}void CcTestVideoSurface::showTips()
{if (m_containter){m_containter->setVisible(true);}
}

3、main.cpp

#include <QApplication>
#include <QWidget>
#include <QDebug>//cc-engine里面生成的动态库
#include "CcDataManage.h"
#include "CcJsonTool.h"#include "cc-test/CcTestVideoPlayer.h"
#include "cc-test/CcTestVideoSurface.h"//测试graphic viewvoid test_qJson()
{//TODO: qt json 简单使用测试auto cmd = 1001;auto type = 1;auto content = "05:00";QVariantMap contentMap;contentMap["cmd"] = QString::number(cmd);QVariantMap dataMap;dataMap["type"] = type;dataMap["content"] = content;contentMap["data"] = dataMap;CcJsonTool jsonTool;auto str = jsonTool.toJsonFromVariantMap(contentMap);qDebug() << "jsonStr:" << str;//jsonStrauto JsonStr = "{\"cmd\":\"1001\",\"data\":{\"content\":\"05:00\",\"type\":1}}";if (jsonTool.parseJsonFromString(JsonStr)){qDebug() << "parse json str success";}else{qDebug() << "parse json str failed";}
}void test_dll_manage()
{CcDataManage data_manage;qDebug() << "Get Data From cc-engine dynamic library: " << data_manage.GetCurrentJsonData();
}int main(int argc, char *argv[])
{QApplication app(argc, argv);//Qt json 简单测试test_qJson();//一个项目多个子项目，并且子项目是动态库调用测试test_dll_manage();//QGraphicView和QGraphicScene简单测试auto videoSurface = new CcTestVideoSurface();videoSurface->showTips();auto graphicView = new CcTestVideoPlayer(nullptr, new CcTestVideoSurface());graphicView->setFixedSize(QSize(520, 420));graphicView->show();// QWidget window;// window.resize(650, 350);// window.setWindowTitle("简单的cmake构建的Qt窗口程序");// window.show();return app.exec();
}

4、最终的结果