Qt音视频开发23-通用视频控件

一、前言

在之前做的视频监控系统中，根据不同的用户需要，做了好多种视频监控内核，有ffmpeg内核的，有vlc内核的，有mpv内核的，还有海康sdk内核的，为了做成通用的功能，不同内核很方便的切换，比如pro直接改一个DEFINE的变量名，所以需要将各种内核的使用方法做成一样的接口，这样看起来就很整齐，所以后面特意提炼了一个通用的视频控件，该控件没有具体的视频播放控制功能，需要根据不同的内核去调用具体的方法实现，后面还需要增加大华sdk或者其他第三方厂家的协议的时候，直接套用这个通用视频控件即可，以后增加新的监控内核，可以省下很多工作量，基本上只需要做内核解析就行，其余通用接口和绘制图像直接交给通用视频控件就行。

通用视频控件功能：

1. 可设置边框大小
2. 可设置边框颜色
3. 可设置两路OSD标签
4. 可设置是否绘制OSD标签
5. 可设置标签文本或图片
6. 可设置OSD位置 左上角+左下角+右上角+右下角
7. 可设置OSD风格 文本+日期+时间+日期时间+图片
8. 自定义半透明悬浮窗体,一排按钮
9. 悬浮按钮可自定义设置,包括背景颜色+按下颜色
10. 发送信号通知单击了哪个悬浮按钮
11. 能够识别拖进来的文件,通知url
12. 提供open close pause等接口

二、功能特点

1. 支持多画面切换，全屏切换等，包括1+4+6+8+9+13+16+25+36+64画面切换。
2. 支持alt+enter全屏，esc退出全屏。
3. 自定义信息框+错误框+询问框+右下角提示框（包含多种格式）。
4. 17套皮肤样式随意更换，所有样式全部统一，包括菜单等。
5. 云台仪表盘鼠标移上去高亮，八个方位精准识别。
6. 底部画面工具栏（画面分割切换+截图声音等设置）移上去高亮。
7. 可在配置文件更改左上角logo+中文软件名称+英文软件名称。
8. 封装了百度地图，视图切换，运动轨迹，设备点位，鼠标按下获取经纬度等。
9. 支持图片地图，设备按钮可以在图片地图上自由拖动自动保存位置信息。
10. 在百度地图和图片地图上，双击视频可以预览摄像头实时视频。
11. 堆栈窗体，每个窗体都是个单独的qwidget，方便编写自己的代码。
12. 顶部鼠标右键菜单，可动态控制时间CPU+左上角面板+左下角面板+右上角面板+右下角面板的显示和隐藏，支持恢复默认布局。
13. 工具栏可以放置多个小图标和关闭图标。
14. 左侧右侧可拖动拉伸，并自动记忆宽高位置，重启后恢复。
15. 双击摄像机节点自动播放视频，双击节点自动依次添加视频，会自动跳到下一个，双击父节点自动添加该节点下的所有视频。
16. 摄像机节点拖曳到对应窗体播放视频，同时支持拖曳本地文件直接播放。
17. 视频画面窗体支持拖曳交换，瞬间响应。
18. 双击节点+拖曳节点+拖曳窗体交换位置，均自动更新url.txt。
19. 支持从url.txt中加载通道视频播放，自动记忆最后通道对应的视频，软件启动后自动打开播放。
20. 右下角音量条控件，失去焦点自动隐藏，音量条带静音图标。
21. 集成百度在线地图和离线地图，可以添加设备对应位置，自动生成地图，支持缩放和添加覆盖物等。
22. 视频拖动到通道窗体外自动删除视频。
23. 鼠标右键可删除当前+所有视频，截图当前+所有视频。
24. 录像机管理、摄像机管理，可添加删除修改导入导出打印信息，立即应用新的设备信息生成树状列表，不需重启。
25. 在pro文件中可以自由开启是否加载地图。
26. 视频播放可选2种内核自由切换，vlc+ffmpeg，均可在pro中设置。
27. 可设置1+4+9+16画面轮询，可设置轮询间隔以及轮询码流类型等，直接在主界面底部工具栏右侧单击启动轮询按钮即可，再次单击停止轮询。
28. 默认超过10秒钟未操作自动隐藏鼠标指针。
29. 支持onvif搜素设备，支持任意onvif摄像机，包括但不限于海康大华宇视天地伟业华为等。
30. 支持onvif云台控制，可上下左右移动云台摄像机，包括复位和焦距调整等。
31. 同时支持sqlite、mysql、postsql等数据库。
32. 可保存视频，可选定时存储或者单文件存储，可选存储间隔时间。
33. 可设置视频流通信方式tcp+udp，可设置视频解码是速度优先、质量优先、均衡等。
34. 可设置硬解码类型，支持qsv、dxva2、d3d11va等。
35. 默认采用opengl绘制视频，超低的CPU资源占用，支持yuyv和nv12两种格式绘制，很牛逼。
36. 高度可定制化，用户可以很方便的在此基础上衍生自己的功能，支持linux和mac系统。

三、效果图

四、相关站点

1. 国内站点：https://gitee.com/feiyangqingyun/QWidgetDemo
2. 国际站点：https://github.com/feiyangqingyun/QWidgetDemo
3. 个人主页：https://blog.csdn.net/feiyangqingyun
4. 知乎主页：https://www.zhihu.com/people/feiyangqingyun/
5. 体验地址：https://blog.csdn.net/feiyangqingyun/article/details/97565652

五、核心代码

void VideoWidget::paintEvent(QPaintEvent *)
{
    //如果不需要绘制
    if (!drawImage) {
        return;
    }

    //qDebug() << TIMEMS << "paintEvent" << objectName();
    QPainter painter(this);
    painter.setRenderHints(QPainter::Antialiasing);

    //绘制边框
    drawBorder(&painter);
    if (!image.isNull()) {
        //绘制背景图片
        drawImg(&painter, image);
        //绘制标签
        drawOSD(&painter, osd1Visible, osd1FontSize, osd1Text, osd1Color, osd1Image, osd1Format, osd1Position);
        drawOSD(&painter, osd2Visible, osd2FontSize, osd2Text, osd2Color, osd2Image, osd2Format, osd2Position);
    } else {
        //绘制背景
        drawBg(&painter);
    }
}

void VideoWidget::drawBorder(QPainter *painter)
{
    if (borderWidth == 0) {
        return;
    }

    painter->save();
    QPen pen;
    pen.setWidth(borderWidth);
    pen.setColor(hasFocus() ? focusColor : borderColor);
    painter->setPen(pen);
    painter->drawRect(rect());
    painter->restore();
}

void VideoWidget::drawBg(QPainter *painter)
{
    painter->save();

    //背景图片为空则绘制文字,否则绘制背景图片
    if (bgImage.isNull()) {
        painter->setFont(this->font());
        painter->setPen(palette().foreground().color());
        painter->drawText(rect(), Qt::AlignCenter, bgText);
    } else {
        //居中绘制
        int pixX = rect().center().x() - bgImage.width() / 2;
        int pixY = rect().center().y() - bgImage.height() / 2;
        QPoint point(pixX, pixY);
        painter->drawImage(point, bgImage);
    }

    painter->restore();
}

void VideoWidget::drawImg(QPainter *painter, QImage img)
{
    painter->save();

    int offset = borderWidth * 1 + 0;
    if (fillImage) {
        QRect rect(offset / 2, offset / 2, width() - offset, height() - offset);
        painter->drawImage(rect, img);
    } else {
        //按照比例自动居中绘制
        img = img.scaled(width() - offset, height() - offset, Qt::KeepAspectRatio);
        int pixX = rect().center().x() - img.width() / 2;
        int pixY = rect().center().y() - img.height() / 2;
        QPoint point(pixX, pixY);
        painter->drawImage(point, img);
    }

    painter->restore();
}

void VideoWidget::drawOSD(QPainter *painter,
                          bool osdVisible,
                          int osdFontSize,
                          const QString &osdText,
                          const QColor &osdColor,
                          const QImage &osdImage,
                          const VideoWidget::OSDFormat &osdFormat,
                          const VideoWidget::OSDPosition &osdPosition)
{
    if (!osdVisible) {
        return;
    }

    painter->save();

    //标签位置尽量偏移多一点避免遮挡
    QRect osdRect(rect().x() + (borderWidth * 2), rect().y() + (borderWidth * 2), width() - (borderWidth * 5), height() - (borderWidth * 5));
    int flag = Qt::AlignLeft | Qt::AlignTop;
    QPoint point = QPoint(osdRect.x(), osdRect.y());

    if (osdPosition == OSDPosition_Left_Top) {
        flag = Qt::AlignLeft | Qt::AlignTop;
        point = QPoint(osdRect.x(), osdRect.y());
    } else if (osdPosition == OSDPosition_Left_Bottom) {
        flag = Qt::AlignLeft | Qt::AlignBottom;
        point = QPoint(osdRect.x(), osdRect.height() - osdImage.height());
    } else if (osdPosition == OSDPosition_Right_Top) {
        flag = Qt::AlignRight | Qt::AlignTop;
        point = QPoint(osdRect.width() - osdImage.width(), osdRect.y());
    } else if (osdPosition == OSDPosition_Right_Bottom) {
        flag = Qt::AlignRight | Qt::AlignBottom;
        point = QPoint(osdRect.width() - osdImage.width(), osdRect.height() - osdImage.height());
    }

    if (osdFormat == OSDFormat_Image) {
        painter->drawImage(point, osdImage);
    } else {
        QDateTime now = QDateTime::currentDateTime();
        QString text = osdText;
        if (osdFormat == OSDFormat_Date) {
            text = now.toString("yyyy-MM-dd");
        } else if (osdFormat == OSDFormat_Time) {
            text = now.toString("HH:mm:ss");
        } else if (osdFormat == OSDFormat_DateTime) {
            text = now.toString("yyyy-MM-dd HH:mm:ss");
        }

        //设置颜色及字号
        QFont font;
        font.setPixelSize(osdFontSize);
        painter->setPen(osdColor);
        painter->setFont(font);

        painter->drawText(osdRect, flag, text);
    }

    painter->restore();
}