一、前言
採集到的圖片,用painter繪製是最基礎的方式,初學者可能第一次嘗試顯示圖片用的qlabel的setpixmap,用下來會發現卡成屎,第二次嘗試用樣式表設置背景圖,依然卡成屎,最終選用painter的方式,直接drawImage函數繪製解析好的圖片,可以通過定義一個信號receiveImage,關聯該函數繪製即可,通過調用update方法主動觸發paintevent事件,在裏面按照需要繪製圖片,如果是大量頻繁的觸發update,Qt內部會合並一些繪製,這樣可以大大節約CPU資源。無論是setpixmap還是樣式表或者是調色板來設置圖片,中間經歷過很多的運算,絕大部分都是無關的,而且最終都是調用painter來觸發繪製到上面,所以通過painter的方式在這幾種選項的情況下是最優的。
繪製圖片基本上有三種策略,0-自動調整(超過顯示區域尺寸則等比例縮放,不超過則原尺寸) 1-等比縮放(永遠等比例縮放,小圖會拉伸變模糊) 2-拉伸填充(永遠拉伸填充,把這個顯示區域填滿),爲此用戶可以自行設定圖片拉伸策略,在繪製的時候還要考慮到邊框大小的問題,最終繪製的區域要減去邊框的大小。
二、效果圖
三、體驗地址
- 國內站點:https://gitee.com/feiyangqingyun
- 國際站點:https://github.com/feiyangqingyun
- 個人作品:https://blog.csdn.net/feiyangqingyun/article/details/97565652
- 體驗地址:https://pan.baidu.com/s/1d7TH_GEYl5nOecuNlWJJ7g 提取碼:01jf 文件名:bin_video_demo/bin_linux_video。
四、相關代碼
bool AbstractVideoWidget::eventFilter(QObject *watched, QEvent *event)
{
if (watched == coverWidget && event->type() == QEvent::Paint) {
//矯正顏色
if (widgetPara.borderColor == Qt::transparent) {
widgetPara.borderColor = palette().shadow().color();
}
if (widgetPara.textColor == Qt::transparent) {
widgetPara.textColor = palette().windowText().color();
}
QPainter painter;
//開始繪製
painter.begin(coverWidget);
//開啓抗鋸齒
painter.setRenderHints(QPainter::Antialiasing);
//繪製邊框
drawBorder(&painter);
//如果圖片不爲空則繪製圖片否則繪製背景
if (!image.isNull()) {
drawImage(&painter);
} else {
drawBg(&painter);
}
//繪製標籤和圖形信息
drawInfo(&painter);
//結束繪製
painter.end();
}
return QWidget::eventFilter(watched, event);
}
void AbstractVideoWidget::drawBorder(QPainter *painter)
{
painter->save();
QPen pen;
pen.setWidth(widgetPara.borderWidth);
pen.setColor(hasFocus() ? widgetPara.focusColor : widgetPara.borderColor);
//沒有邊框則不繪製邊框
painter->setPen(widgetPara.borderWidth == 0 ? Qt::NoPen : pen);
//順帶把背景顏色這裏也一併處理(有些場景需要某個控件特殊背景顏色顯示)
if (widgetPara.bgColor != Qt::transparent) {
painter->setBrush(widgetPara.bgColor);
}
painter->drawRect(rect());
painter->restore();
}
void AbstractVideoWidget::drawBg(QPainter *painter)
{
//已經獲取到了寬高不用繪製背景
if (videoWidth != 0) {
return;
}
#ifdef openglx
//GPU控件可見不用繪製背景
if (rgbWidget->isVisible() || yuvWidget->isVisible() || nv12Widget->isVisible()) {
return;
}
#endif
painter->save();
//背景圖片爲空則繪製文字否則繪製背景圖片
if (widgetPara.bgImage.isNull()) {
painter->setPen(widgetPara.textColor);
QFont font;
font.setPixelSize(widgetPara.bgTextSize);
painter->setFont(font);
painter->drawText(rect(), Qt::AlignCenter, widgetPara.bgText);
} else {
QRect rect = WidgetHelper::getCenterRect(widgetPara.bgImage.size(), this->rect());
painter->drawImage(rect, widgetPara.bgImage);
}
painter->restore();
}
void AbstractVideoWidget::drawInfo(QPainter *painter)
{
//只有音頻和句柄模式不用繪製OSD
if (videoWidth == 0 || onlyAudio || widgetPara.videoMode == VideoMode_Hwnd) {
return;
}
//標籤位置儘量偏移多一點避免遮擋
QRect rect = image.isNull() ? coverWidget->rect() : image.rect();
int borderWidth = widgetPara.borderWidth + 5;
rect = QRect(rect.x() + borderWidth, rect.y() + borderWidth, rect.width() - (borderWidth * 2), rect.height() - (borderWidth * 2));
//將標籤信息繪製到遮罩層
if (widgetPara.osdDrawMode == DrawMode_Cover) {
foreach (OsdInfo osd, listOsd) {
if (osd.visible) {
painter->save();
WidgetHelper::drawOsd(painter, osd, rect);
painter->restore();
}
}
}
//將圖形信息繪製到遮罩層
if (widgetPara.graphDrawMode == DrawMode_Cover) {
foreach (GraphInfo graph, listGraph) {
painter->save();
if (!graph.rect.isEmpty()) {
WidgetHelper::drawRect(painter, graph.rect, graph.borderWidth, graph.borderColor);
}
if (!graph.path.isEmpty()) {
WidgetHelper::drawPath(painter, graph.path, graph.borderWidth, graph.borderColor);
}
if (graph.points.size() > 0) {
WidgetHelper::drawPoints(painter, graph.points, graph.borderWidth, graph.borderColor);
}
painter->restore();
}
}
}
void AbstractVideoWidget::drawImage(QPainter *painter)
{
if (image.isNull()) {
return;
}
//標籤位置儘量偏移多一點避免遮擋
QRect rect = image.isNull() ? coverWidget->rect() : image.rect();
int borderWidth = widgetPara.borderWidth + 5;
rect = QRect(rect.x() + borderWidth, rect.y() + borderWidth, rect.width() - (borderWidth * 2), rect.height() - (borderWidth * 2));
//將標籤信息繪製到圖片上
if (widgetPara.osdDrawMode == DrawMode_Image) {
foreach (OsdInfo osd, listOsd) {
if (osd.visible) {
QPainter painter;
painter.begin(&image);
//painter.setRenderHints(QPainter::Antialiasing);
WidgetHelper::drawOsd(&painter, osd, rect);
painter.end();
}
}
}
//將圖形信息繪製到圖片上
if (widgetPara.graphDrawMode == DrawMode_Image) {
foreach (GraphInfo graph, listGraph) {
QPainter painter;
painter.begin(&image);
//painter.setRenderHints(QPainter::Antialiasing);
if (!graph.rect.isEmpty()) {
WidgetHelper::drawRect(&painter, graph.rect, graph.borderWidth, graph.borderColor);
}
if (!graph.path.isEmpty()) {
WidgetHelper::drawPath(&painter, graph.path, graph.borderWidth, graph.borderColor);
}
if (graph.points.size() > 0) {
WidgetHelper::drawPoints(&painter, graph.points, graph.borderWidth, graph.borderColor);
}
painter.end();
}
}
//繪製圖片
painter->save();
painter->drawImage(imageRect, image);
painter->restore();
}
五、功能特點
5.1 基礎功能
- 支持各種音頻視頻文件格式,比如mp3、wav、mp4、asf、rm、rmvb、mkv等。
- 支持本地攝像頭設備,可指定分辨率、幀率。
- 支持各種視頻流格式,比如rtp、rtsp、rtmp、http等。
- 本地音視頻文件和網絡音視頻文件,自動識別文件長度、播放進度、音量大小、靜音狀態等。
- 文件可以指定播放位置、調節音量大小、設置靜音狀態等。
- 支持倍速播放文件,可選0.5倍、1.0倍、2.5倍、5.0倍等速度,相當於慢放和快放。
- 支持開始播放、停止播放、暫停播放、繼續播放。
- 支持抓拍截圖,可指定文件路徑,可選抓拍完成是否自動顯示預覽。
- 支持錄像存儲,手動開始錄像、停止錄像,部分內核支持暫停錄像後繼續錄像,跳過不需要錄像的部分。
- 支持無感知切換循環播放、自動重連等機制。
- 提供播放成功、播放完成、收到解碼圖片、收到抓拍圖片、視頻尺寸變化、錄像狀態變化等信號。
- 多線程處理,一個解碼一個線程,不卡主界面。
5.2 特色功能
- 同時支持多種解碼內核,包括qmedia內核(Qt4/Qt5/Qt6)、ffmpeg內核(ffmpeg2/ffmpeg3/ffmpeg4/ffmpeg5)、vlc內核(vlc2/vlc3)、mpv內核(mpv1/mp2)、海康sdk、easyplayer內核等。
- 非常完善的多重基類設計,新增一種解碼內核只需要實現極少的代碼量,就可以應用整套機制。
- 同時支持多種畫面顯示策略,自動調整(原始分辨率小於顯示控件尺寸則按照原始分辨率大小顯示,否則等比例縮放)、等比例縮放(永遠等比例縮放)、拉伸填充(永遠拉伸填充)。所有內核和所有視頻顯示模式下都支持三種畫面顯示策略。
- 同時支持多種視頻顯示模式,句柄模式(傳入控件句柄交給對方繪製控制)、繪製模式(回調拿到數據後轉成QImage用QPainter繪製)、GPU模式(回調拿到數據後轉成yuv用QOpenglWidget繪製)。
- 支持多種硬件加速類型,ffmpeg可選dxva2、d3d11va等,mpv可選auto、dxva2、d3d11va,vlc可選any、dxva2、d3d11va。不同的系統環境有不同的類型選擇,比如linux系統有vaapi、vdpau,macos系統有videotoolbox。
- 解碼線程和顯示窗體分離,可指定任意解碼內核掛載到任意顯示窗體,動態切換。
- 支持共享解碼線程,默認開啓並且自動處理,當識別到相同的視頻地址,共享一個解碼線程,在網絡視頻環境中可以大大節約網絡流量以及對方設備的推流壓力。國內頂尖視頻廠商均採用此策略。這樣只要拉一路視頻流就可以共享到幾十個幾百個通道展示。
- 自動識別視頻旋轉角度並繪製,比如手機上拍攝的視頻一般是旋轉了90度的,播放的時候要自動旋轉處理,不然默認是倒着的。
- 自動識別視頻流播放過程中分辨率的變化,在視頻控件上自動調整尺寸。比如攝像機可以在使用過程中動態配置分辨率,當分辨率改動後對應視頻控件也要做出同步反應。
- 音視頻文件無感知自動切換循環播放,不會出現切換期間黑屏等肉眼可見的切換痕跡。
- 視頻控件同時支持任意解碼內核、任意畫面顯示策略、任意視頻顯示模式。
- 視頻控件懸浮條同時支持句柄、繪製、GPU三種模式,非絕對座標移來移去。
- 本地攝像頭設備支持指定設備名稱、分辨率、幀率進行播放。
- 錄像文件同時支持打開的視頻文件、本地攝像頭、網絡視頻流等。
- 瞬間響應打開和關閉,無論是打開不存在的視頻或者網絡流,探測設備是否存在,讀取中的超時等待,收到關閉指令立即中斷之前的操作並響應。
- 支持打開各種圖片文件,支持本地音視頻文件拖曳播放。
- 視頻控件懸浮條自帶開始和停止錄像切換、聲音靜音切換、抓拍截圖、關閉視頻等功能。
- 音頻組件支持聲音波形值數據解析,可以根據該值繪製波形曲線和柱狀聲音條,默認提供了聲音振幅信號。
- 各組件中極其詳細的打印信息提示,尤其是報錯信息提示,封裝的統一打印格式。針對現場複雜的設備環境測試極其方便有用,相當於精確定位到具體哪個通道哪個步驟出錯。
- 代碼框架和結構優化到最優,性能強悍,持續迭代更新升級。
- 源碼支持Qt4、Qt5、Qt6,兼容所有版本。
5.3 視頻控件
- 可動態添加任意多個osd標籤信息,標籤信息包括名字、是否可見、字號大小、文本文字、文本顏色、標籤圖片、標籤座標、標籤格式(文本、日期、時間、日期時間、圖片)、標籤位置(左上角、左下角、右上角、右下角、居中、自定義座標)。
- 可動態添加任意多個圖形信息,這個非常有用,比如人工智能算法解析後的圖形區域信息直接發給視頻控件即可。圖形信息支持任意形狀,直接繪製在原始圖片上,採用絕對座標。
- 圖形信息包括名字、邊框大小、邊框顏色、背景顏色、矩形區域、路徑集合、點座標集合等。
- 每個圖形信息都可指定三種區域中的一種或者多種,指定了的都會繪製。
- 內置懸浮條控件,懸浮條位置支持頂部、底部、左側、右側。
- 懸浮條控件參數包括邊距、間距、背景透明度、背景顏色、文本顏色、按下顏色、位置、按鈕圖標代碼集合、按鈕名稱標識集合、按鈕提示信息集合。
- 懸浮條控件一排工具按鈕可自定義,通過結構體參數設置,圖標可選圖形字體還是自定義圖片。
- 懸浮條按鈕內部實現了錄像切換、抓拍截圖、靜音切換、關閉視頻等功能,也可以自行在源碼中增加自己對應的功能。
- 懸浮條按鈕對應實現了功能的按鈕,有對應圖標切換處理,比如錄像按鈕按下後會切換到正在錄像中的圖標,聲音按鈕切換後變成靜音圖標,再次切換還原。
- 懸浮條按鈕單擊後都用名稱唯一標識作爲信號發出,可以自行關聯響應處理。
- 懸浮條空白區域可以顯示提示信息,默認顯示當前視頻分辨率大小,可以增加幀率、碼流大小等信息。
- 視頻控件參數包括邊框大小、邊框顏色、焦點顏色、背景顏色(默認透明)、文字顏色(默認全局文字顏色)、填充顏色(視頻外的空白處填充黑色)、背景文字、背景圖片(如果設置了圖片優先取圖片)、是否拷貝圖片、縮放顯示模式(自動調整、等比例縮放、拉伸填充)、視頻顯示模式(句柄、繪製、GPU)、啓用懸浮條、懸浮條尺寸(橫向爲高度、縱向爲寬度)、懸浮條位置(頂部、底部、左側、右側)。