Axure制作播放器原型图-OpenGL FFmpeg QT Rtmp H264 视频监控 mp4播放

要做一个集成了:

1.视频监控 视频播放+云台控制

2.图片浏览yuv jpg bmp 图片处理 锐化 模糊 二值化

3.音频播放 pcm  aac 音频分析 处理

4.视频文件播放 视频文件格式分析h264-annexb avi flv mp4

5.流媒体播放 hls webrtc rtsp rtmp 

6.视频分析 处理--人脸识别、目标检测、目标跟踪、美颜

7.流媒体服务rtmp webrtc rtsp服务

源代码

player: 混合播放器代码图片播放、视频播放、设备捕捉、网络播放、推流、变换、目标跟踪ffmpeg sdl opengl x264 aac rtmp webrtc opencv

参考资料

刚开始的时候参考了很多界面,例如

GitHub - ithewei/hplayer: A multi-screen player using Qt + FFmpeg.

 https://github.com/Greedysky/TTKMusicplayer

Search

https://github.com/wang-bin/QtAV

Alt text

​​​​​​https://github.com/yundiantech/VideoPlayerz

Image text

https://github.com/NJU-TJL/Qt5-MusicPlayer

GitHub - strawberrymusicplayer/strawberry: Strawberry Music Player

Browse

实现效果

 为此,我先设计了第一个版本,包括了所有输出的树

但是我后来想,这种操作稍微复杂,而且有如下问题:

1.无法重点展示某个界面

2.状态提示不明显

于是我修改了界面,变成了如下:

 --------------------------------------------------------最终效果 --------------------------------------------------------

所有界面视图

 单个画面视图:

 

这种对用户来说,只点击+号和播放按钮即可,状态一目了然,非常便捷

对于不同应用,按照输入类型不同,采用不同的窗口类来加载

窗口设计

1.图像文件

CImageView

如jpg yuv bmp png

支持图像文件格式解析显示

支持图像图形编辑、另存为、二值化、锐化、模糊、镜像等操作

2.音频文件

CAudioFileView

aac wmv pcm

支持文件格式解析显示

支持音频波形显示、声音播放、静音、除噪、降声、输出

3.视频文件

CVideoFileView

mp4 avi flv 

支持文件格式解析显示

支持解码过程显示

4.设备捕获

CDeviceCaptureView

USB视频设备:

屏幕捕捉

支持捕捉过程信息显示

5.网络媒体

CNetMediaView

HLS WebRtc rtmp rtsp

支持网络包信息解析

支持协议分析

6.视频监控

CHIKCameraView

如海康球机  支持预制位、缩放、变焦、转动

支持视频分析

支持网络分析

支持协议分析

混流设计

新建一个混流,包含一个音频和一个视频

音频:约定采样率、通道、编码格式

视频:约定分辨率、码率、编码格式

输出设计

将混流后的码流输出到某个目的地:

1.本地存储 设置存储格式、封包格式,文件存储规则,如设定格式为mp4 按照250MB/个进行存储。

2.网络推流  如果选择网络推流,则 在“服务”功能中选择一个,本机的rtmp或者本机的webrtc服务。

服务设计

用户在启动软件的时候 自动启动RTMP和WebRtc服务,本机作为服务提供方,供其它客户端或者第三方调用。其他输入也可以混流后输出到本服务。

基本设计思想:

输入---->处理----->输出------>服务

例如:

把一个mp4文件播放,分两路,第1路进行人脸识别  第2路进行输出到本地rtmp地址rtmp://127.0.0.1/test/chan1223

把USB摄像头捕获到的数据转成1280*720+麦克风捕获到的数据-----h264编码+aac编码---混流后输出到WebRtc--output1,同时再开一个客户端 创建一个输入output1

资源下载:axure混合播放器-多窗口和单窗口-交通文档类资源-CSDN下载

实现代码:player: 混合播放器代码图片播放、视频播放、设备捕捉、网络播放、推流、变换、目标跟踪ffmpeg sdl opengl x264 aac rtmp webrtc opencv

 

V1.0.0 2021-12-04

实现了:

1.调色板 绘制背景

2.支持多窗口模式中---仿照浏览器类似的的播放窗口数量根据窗口宽度自适应调整

3.支持scrollbar

4.选中后绘制选中框

5.支持单视频窗口模式和多视频窗口模式切换

6.支持单窗口模式中--拉伸窗口图像缩放。

 多窗口模式:

 

单窗口模式:

 

V1.0.0 2021-12-07

1.实现了 左侧输入树、底部状态窗口

2.实现了全屏、最大化

3.实现了快捷键F2显示单个/多个播放器 F3显示/隐藏 左侧F4显示/隐藏底部

进行视图切换

多视图+全屏模式

 单视图+全屏模式

V1.0.0 2021-12-09

1.实现了 多屏模式下窗口Zoomout和zoomin

2.增加了OpenGL窗口显示(右侧窗口)测试代码(下个版本去掉右侧窗口)

3.增加了多屏模式上下左右键窗口选择

4.增加了多屏模式垂直滚动条自动滚动到选择的窗口功能

5.增加了每个窗口内部的播放 暂停 最大化 关闭 按钮 以及label

6.修改在ubuntu16.04 qt-5.9.0下编译语法错误问题

                                                (下图为ubuntu上预览图)

V1.0.0 2021-12-13

1.实现了 保存当前UI配置到xml文件和从xml文件读取配置

2.增加新建窗口选项.

<Config>
<Main MainwindowMax="true" ViewFullScreen="false" ShowLeft="false" ShowBottom="false" OneMax="false" mainw="774" mainh="429" mulvieww="1918" mulviewh="1054" itemw="352" itemh="198" SelectItem="10"/>
<ViewWindows>
<View0 viewtype="12" img="/home/zhouyong/Pictures/18.jpg"/>
<View1 viewtype="12" img="/home/zhouyong/Pictures/18.jpg"/>
<View2 viewtype="12" img="/home/zhouyong/Pictures/31.jpg"/>
<View3 viewtype="12" img="/home/zhouyong/Pictures/32.jpg"/>
<View4 viewtype="12" img="/home/zhouyong/Pictures/32.jpg"/>
<View5 viewtype="12" img="/home/zhouyong/Pictures/a.jpg"/>
<View6 viewtype="12" img="/home/zhouyong/Pictures/33.jpg"/>
<View7 viewtype="12" img="/home/zhouyong/Pictures/15.jpg"/>
<View8 viewtype="12" img="/home/zhouyong/Pictures/14.jpg"/>
<View9 viewtype="12" img="/home/zhouyong/Pictures/14.jpg"/>
<View10 viewtype="12" img="/home/zhouyong/Pictures/a.jpg"/>
<View11 viewtype="12" img="/home/zhouyong/Pictures/a.jpg"/>
<View12 viewtype="12" img="/home/zhouyong/Pictures/33.jpg"/>
</ViewWindows>
</Config>

V1.0.0 2021-12-15

1.增加了图片输入类--CJpgInputView

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/27903.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【QT项目:视频播放器——Qt opengl编程】通过shader完成显示yuv

通过Qt opengl不是为了3D绘制&#xff0c;而是为了将视频绘制起来 使用opengl 可以极大降低yuv转rgb的转换开销 使用Opengl需要考虑三大问题&#xff1a; 1、QOpenGLWidget&#xff08;与界面如何交互&#xff09; 1、为什么用QT的opengl 简单&#xff0c;界面可以自动叠加 v…

【OpenGL】读取视频并渲染

&#x1f60f;★,:.☆(&#xffe3;▽&#xffe3;)/$:.★ &#x1f60f; 这篇文章主要介绍读取视频并渲染。 学其所用&#xff0c;用其所学。——梁启超 欢迎来到我的博客&#xff0c;一起学习&#xff0c;共同进步。 喜欢的朋友可以关注一下&#xff0c;下次更新不迷路&#…

unity rtsp 视频渲染(一)

unity unity 可以说是一个不错的工具&#xff0c;建立三维的场景非常方便&#xff0c;下面我们建立一个三维的场景&#xff0c;并且在三维的场景中和场景外分别建立系统去播放视频。所谓场景内就是在三维中播放视频&#xff0c;场景外就是在三维场景前表面的二维平面中播放视频…

Unity 视频渲染插件AVPro Movie Capture 简易教程

随着Unity 的 功能日益强大&#xff0c;Unity5的发布使的Unity的图形渲染能力达到了一个新的层次&#xff0c;全局光照的加入&#xff0c;各种新特性的加入&#xff0c;使视频的实时渲染不再是天方夜谈&#xff0c;Unity5发布时的演示视频《Adam》&#xff0c;画质惊人。Unity在…

最新 |《未来简史》作者赫拉利 演讲:AI不需要意识就可以毁灭人类文明 (全文+视频)...

作者&#xff1a;城主 | 编辑&#xff1a;腾讯新闻 郝博阳 编者导语&#xff1a; 最近两个月&#xff0c;自从《暂停AI声明书》发布后&#xff0c;我们看到了诸多AI行业内的专家大佬隔空辩论AI的潜在威胁和治理方法&#xff0c;场面一时无两&#xff0c;基本上把技术路径上AI可…

大模型基础知识 - 语言模型及其演进 公开版

本文为作者内部分享文档&#xff0c;由于不涉敏可以公开&#xff0c;分享本身是课程形式&#xff0c;有什么疑问欢迎在评论区留言。 开场白 人工智能发展到现在&#xff0c;在2个重要领域取得了重大突破&#xff0c;有望达到人类水平&#xff1a; 计算机视觉 &#xff08;Com…

使用ChatGPT帮助快速读书:《Rise of the Robots: Technology and the Threat of a Jobless Future》

有了ChatGPT的帮助&#xff0c;读书也快了&#xff0c;英文版的书也可以快速了解其主要内容&#xff0c;不知道这样囫囵吞枣的阅读有没有其它副作用&#xff0c;先读了几本再说。 《Rise of the Robots: Technology and the Threat of a Jobless Future》这本书我没找到中文版翻…

揭秘ChatGPT爆火的背后真相:学编程已经成为必选项!

这一阵最热门的话题&#xff0c;莫过于人工智能新选手—— ChatGPT&#xff0c;在推出后只用了两个月就积累了1亿用户&#xff01;它的出现在科技圈掀起了一阵“惊涛骇浪”&#xff0c;有人称ChatGPT的意义&#xff0c;堪比当年蒸汽机的出现&#xff0c;它足以爆发新一轮的“工…

【ChatGPT】AI 2.0 时代:拥抱先进的生产力

AI 2.0 时代:拥抱先进的生产力 目录 AI 2.0 时代:拥抱先进的生产力 康波周期是什么? 人类工业革命以来的近现代史 先进生产力的变成了信息与数据 AI科技改变世界

GraphPad Prism 科研绘图(一)

打开GraphPad软件&#xff0c;可以在左侧选择要绘制的图表类型&#xff0c;也可以在左下方直接打开现有的文件 graphpad的工作流程是&#xff0c;首先你需要输入你的数据&#xff0c;也就是你的实验原始数据&#xff0c;叫做Data Table 然后你可以对你的原始数据进行分析&…

科研绘图软件大全

作为材料&#xff0c;化学&#xff0c;环境&#xff0c;物理领域的科研工作者&#xff0c;你是否常为如何表达自己的思想而苦恼? 作为学术论文创造者&#xff0c;你是否为论文中图文单一而叹气? 在这里&#xff0c;推荐给你几款常用科研绘图软件&#xff0c;让你论文从此成为…

【知识图谱】知识图谱的本质是什么?

持续总结更新中 一句话总结知识图谱人工智能从感知到认知什么是知识&#xff1f;什么是先验知识&#xff1f;什么是知识表示&#xff1f;知识图谱的基本组成要素&#xff1f;什么是概念&#xff1f;什么是实体&#xff1f;什么是本体&#xff1f;谈谈本体构建什么是知识图谱的s…

【毕业季】毕业设计避坑指南

文章目录 前言&#x1f34a;缘由毕业季&#xff0c;毕业设计分手季 &#x1f3af;主要目标实现4大重点 &#x1f348;猜你想问如何与狗哥联系进行探讨1.关注公众号【JavaDog程序狗】2.踩踩狗哥博客 &#x1f36f;猜你喜欢文章推荐 正文1.毕业设计如何选题2.毕业设计如何去写3.网…

文心一言“插刀”百度?

在ChatGPT出世半年&#xff0c;爆火将近2月后&#xff0c;中国版AI大模型终于崭露头角。 3月16日&#xff0c;百度于北京总部召开新闻发布会&#xff0c;主题围绕基于文心大模型技术生成式对话产品——文心一言&#xff0c;这也预示着中国首个类ChatGPT产品面世。在其正式推出前…

MSRA王晋东:大模型时代,普通人的科研何去何从

王晋东 投稿量子位 | 公众号 QbitAI 最近&#xff0c;电子工业出版社送了我一本《一本书读懂AIGC&#xff1a;ChatGPT、AI绘画、智能文明与生产力变革》&#xff0c;不禁感叹&#xff1a;现在连写书都这么卷了&#xff01; 要知道&#xff0c;ChatGPT 于去年11月30日刚刚发布、…

ZadigX 发布:价值驱动一切 链接最酷玩家

Zadig 徜徉开源大漠&#xff0c;用爱发电两年之际&#xff0c;低调发布企业版 ZadigX&#xff0c;广泛链接一切价值创造者。发布会将在 2023 年 4 月 27 日 以全线上形式举办&#xff0c;特邀一位神秘总裁&#xff0c;两大车企总监&#xff0c;十大云原生盟主联创/CEO&#xff…

我是普通人,我居然可以这样借力ChatGPT?(此文不卖课)

昨天写了一篇《程序员&#xff0c;如何借力ChatGPT&#xff1f;》&#xff0c;分享了借助AI&#xff1a; &#xff08;1&#xff09;撰写通用代码&#xff1b; &#xff08;2&#xff09;协助寻找BUG&#xff1b; &#xff08;3&#xff09;协助优化算法性能&#xff1b; &…

没有ChatGPT和new bing ?加入文心一言!

前言: 话虽说ChatGPT和newbing已经席卷网络AI语言&#xff0c;当了现在ai的头号老大&#xff0c;但是那两个都是需要梯子才能使用&#xff0c;ChatGPT还需要付费&#xff0c;所以还是有很多童鞋是没有加入使用ai大军的&#xff0c;那我们不妨看一下这个:文心一言。 步入正题…

android自定义涂鸦,Android Studio:小Demo-“涂鸦”

一、在手机模拟器上显示一个图片 1、MainActivity.java里的代码 public class MainActivity extends AppCompatActivity { SuppressLint("ClickableViewAccessibility") Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanc…

android:在照片上绘制涂鸦

这个应该是简易版的美图秀秀(小伙伴们吐槽&#xff1a;你这也叫简易版的&#xff1f;&#xff1f;我们看着怎么不像啊……)。好吧&#xff0c;只是在图片上绘制涂鸦&#xff0c;然后保存。 一、选择图片 这个道长有必要说一下&#xff0c;在绘制涂鸦时&#xff0c;笔画会根据…