此功能是一个客户定制的,主要是需要在地图上动态显示GPS的运动轨迹,有个应用场景就是一个带有监控的车子,实时在运动中,后台可以接收到经纬度信息,需要绘制对应的轨迹,相当于这些摄像机点位是动态移动的,这样就可以观测到摄像机的实时位置信息,双击摄像机还可以弹出画面实时预览,很直观。
一、功能特点 支持16画面切换,全屏切换等,包括1+4+6+8+9+13+16画面切换。 支持alt+enter全屏,esc退出全屏。 自定义信息框+错误框+询问框+右下角提示框。 17套皮肤样式随意更换,所有样式全部统一,包括菜单等。 云台仪表盘鼠标移上去高亮,八个方位精准识别。 底部画面工具栏(画面分割切换+截图声音等设置)移上去高亮。 可在配置文件更改左上角logo+中文软件名称+英文软件名称。 封装了百度地图,视图切换,设备点位,鼠标按下获取经纬度等。 堆栈窗体,每个窗体都是个单独的qwidget,
摄像机点位的功能主要是在图片地图和在线离线地图上设置对应摄像机的位置,然后双击可以实时预览对应摄像机的视频,在图片地图上拖动摄像机图标到对应位置,系统会自动保存位置信息,在网页地图上的摄像机位置,需要异步更新,比如先从右侧选择需要更新位置的摄像机,然后在地图上鼠标按下,会自动传回当前位置的经纬度信息,然后单击更新设备位置按钮即可,会自动js异步更新执行代码,更新完成以后会自动同步到另外的地图,比如在线地图更新了,离线地图也会自动更新。
一般会有两种处理方式来删除视频,一种是鼠标右键菜单,删除当前视频或者删除所有视频,一种是直接按住当前视频,移到视频通道界面以外就表示删除当前视频,这也是个比较人性化的设置,每个人的喜好不一样,和通道交换功能类似,按住视频拖动到窗体外面表示删除视频,这个功能也需要安装事件过滤器来处理,自动计算当前按下状态下的鼠标是否已经到了窗体外面,按下的时候记住当前视频通道,松开的时候处理删除视频动作即可。删除完成以后同样要立即更新配置文件或者数据库,以便下次应用新的配置,在删除视频的时候,为了保证界面UI的流畅,可以后台慢慢释放资源删除,而不是立即删除,有时候会卡住主界面,体验不好。
全屏切换这个功能点属于简单的,一般会做到右键菜单中,也提供了快捷键比如alt+enter来触发,恢复全屏则按esc即可,全屏处理基本上都是隐藏通道面板以外的窗体,保持最大化展示,由于采用了模块化的堆栈窗体qstackwidget来处理,这样还需要提供信号通知主界面来隐藏对应的不需要显示的控件。
视频播放功能是核心功能之一,为了统一管理接口,统一封装成一个控件,对外提供seturl open close方法即可,不用去管内部的具体处理,这样就可以提供多种接口来实现统一的管理,比如vlc内核+ffmpeg内核+海康sdk内核等,随意切换,在使用各种内核的过程中,对比下来,发现easyplayer的内核是最好的,在国内用ffmpeg做接口做到了极致,CPU占用极低。
在所有的视频监控系统中,双击摄像机的节点,对应摄像机加载到当前焦点通道显示,这个都是必须具备的功能,还有一些厂家会做双击NVR节点,自动加载该NVR下的所有摄像机全部显示,从通道1开始到通道16或者32,知道排满,或者双击对应的分组,分组下面的所有摄像机自动加载显示视频,这个基础效果在Qt中还是很好实现的,入门级别,唯独双击父节点加载节点下的所有视频,我们知道QTreeWidget默认双击父节点是折叠功能,那怎么取消这个功能呢?或者仅仅是限制单击父节点的+-号来实现折叠和展开,这个就需要用到事件过滤器,事件过滤器的优先级别很高,可以直接优先拿到对应的事件,然后进行处理,处理完成以后如果不需要继续传递下去可以直接return true即可,这样就不会再执行该事件了。
视频轮询在视频监控系统中是一个基础的核心功能,尤其是上了大屏以后,这个功能是必须的,根据预先设定的轮询间隔逐个加载视频到预先设定的通道画面数中,轮询间隔、轮询画面数、轮询采用的码流类型(主码流、子码流)都可以在系统设置中进行统一设置,轮询的视频源采用摄像机表中的所有摄像机,当画面数不够的时候,其余留空显示即可,轮询到最后一个视频,重新从第一个开始轮询。
最开始写通道交换的功能的时候,走了很多弯路,比如最开始用最初级的办法,触发交换的时候,先关闭视频,然后设置新的url重新打开视频,这样处理非常低级而且耗内存还卡还很慢,毕竟重新打开视频都需要时间的,快则几百毫秒慢则几秒钟都很有可能,尤其是网络情况不好的情况下,更加糟糕,后面发现自己真傻,完全没有必要去关闭原有视频,毕竟交换仅仅是位置的交换,而不是重新设置视频,可以直接重新布局,将视频控件对应的布局位置调换下即可,这种方法就做到了瞬间交换,视频还是原来的视频,正常播放,根本就没有中断过。
面板开关功能是整个系统最人性化的功能之一,可以对主界面中左侧右侧的各个小面板进行显示和隐藏,当隐藏的时候,另外的同级面板自动拉伸填充,这样就不会显得空洞,直接在每个面板的右上角提供了关闭按钮,也可以直接在顶部鼠标右键弹出菜单控制每个面板的显示和隐藏,面板的显示和隐藏以后,自动更新菜单的文字,保证永远都一致,有时候拖动位置乱了或者关闭了所有的,需要提供一个恢复所有面板的功能,做在右键菜单中,一次性恢复所有面板的显示。
掉线重连在很早很早以前就做了,基本上的方法都是搞个变量存储最后收到图片的时间,然后开个定时器判断,如果不在暂停模式下,当前时间和最后收到图片的时间差值超过了设定的超时时间,比如5s则认为掉线,然后调用close方法关闭,调用open重新打开视频流,依次重复。
采用了回调方式的视频通道,截图只需要对解析好的QImage对象直接保存即可,而对于句柄的形式,需要调用不同的处理策略,比如vlc需要用它自己提供的api接口函数libvlc_video_take_snapshot传入保存路径即可,mpv的内核执行screenshot-to-file命令传入路径参数即可,而ffmpeg就需要设置抓拍标志位,在实时采集解析那边,如果当前是截图标志位真,则需要改成QImage转换的机制发出图片,而不是yuv的数据opengl绘制,海康的sdk调用NET_DVR_CapturePicture函数即可。
以前不知道onvif也可以做抓拍功能,直到近期重新用Onvif Device Test Tool工具测试的时候,发现还有抓图的接口,于是抓跑分析出要收发的数据,然后加入到自己封装的onvif操作类中,这个抓图有个应用场景就是报警以后,直接通过onvif抓图,而不需要打开实时视频流,基本上不占用什么资源。
视频监控系统在整个安防领域,已经做到了烂大街的程序,全国起码几百家公司做过类似的系统,当然这一方面的需求量也是非常旺盛的,各种定制化的需求越来越多,尤其是这几年借着人脸识别的东风,发展更加迅猛,人脸识别相关的技术和应用这几年处于风口浪尖,衍生了特别多的应用产品,各种人脸识别的产品遍地开花,刷脸门禁,车站机场人脸识别,刷脸取票等,但是其实大部分内行人士可能都比较绝望,外行感觉像看科幻片一样,老板们各种打鸡血,今天几个亿明天几个亿。
文章目录 效果图 面向对象 实战代码 index.html tab.js一lis绑定点击事件和序号 效果图 代码:优化样式+(切换+清除样式) 效果图 增加 效果图 面向对象 实战代码 index.h
这个效果的灵感来自于大屏电子看板系统,在很多系统中尤其是上了大屏的时候,其实在用户不在操作的时候,是很不希望看到那个鼠标箭头指针的,只有当用户操作的时候才显示出来,这个就需要开个定时器定时计算最后一次用户操作的时间,和当前时间比较,如果超过了鼠标未操作隐藏时间,则隐藏鼠标,在Qt中提供了方法qApp->setOverrideCursor(Qt::BlankCursor);这样设置个空白的鼠标指针就表示隐藏鼠标,如果需要恢复调用qApp->restoreOverrideCursor();即可,怎么触发恢复鼠标指针呢?搞个bool存储当前鼠标是否隐藏,在鼠标隐藏的时候置为真,拦截鼠标移动事件,一旦发现之前鼠标处于隐藏状态,则立即恢复指针状态,同时将标志位改为假,不然频繁恢复指针没有意义,只有当指针隐藏的时候才需要恢复一次。
事件订阅是近期增加的功能,主要是因为遇到越来越多的一个应用场景,能够接收摄像机的报警事件,比如几乎所有的摄像机后面会增加报警输入输出接口,如果用户外接了报警输入,则当触发报警以后,对应的事件也会通过onvif传出去,这样就相当于兼容了所有onvif摄像机厂家的报警事件接收,在一些应用系统中,这个功能也是很常见的。
硬件解码是图形芯片厂家提出的用GPU资源解码视频流的方案,与之相对的是软解,也就是传统的用CPU承担解码工作的方案;优点是效率高,功耗低、热功耗低,缺点是缺乏有力的支持(包括滤镜、字幕等),局限性较大(例如打开硬件解码后PC的节能方面的功能失效cnq等),设置较为复杂;需要硬件有硬件解码模块、相关的驱动配合、合适的播放软件以及对播放软件正确的设置,缺一而不能开启硬件解码功能,主流的硬件解码方案由Intel、AMD-ATI以及Nvdia推出。
云台控制也是onvif功能中最常用的,最常用的功能排第一的是拿到视频流地址,排第二的就是云台控制了,云台控制的含义就是对带云台的摄像机进行上下左右的移动,一般云台摄像机都是带有一个小电机,一旦收到485或者网络来的正确的指令以后就触发单片机程序,然后单片机程序驱动电机进行转动,所以相对来说云台摄像机比普通的摄像机更耗电,当然价格也更贵。
Bootstrap是一个用于快速开发Web 应用程序和网站的前端框架,它提供了一个带有网格系统、链接样式、背景的基本结构。Bootstrap提供了许多的组件,其中就包括导航组件。这在很大程度上简化了操作。通常都是利用列表实现来导航的,常用的是无序列表()和有序列表()。自定义列表()一般不会用来实现导航。
上一篇:微信小程序电商实战-入门篇 嗨,大家好!经过近两周的精心准备终于开始微信小程序电商实战之路喽。那么最终会做成什么样呢?好了,不啰嗦了 我们先看首页长什么样吧! 📷 首页效果图.gif 为了能够更好的表达出来,首页准备分成两次写完。 第一部分先实现如下的功能 📷 Hi.World-home_top.gif 划分模块 大家都知道电商平台一般分为首页、商品分类、购物车和个人中心4个核心模块,那么我们先在app.json的page里添加如下代码 一、设置头部 背景颜色为白色,名称是Hi.World 二、首页
cocos2d中场景的切换采用的是包装的思想,通过创建一个专场效果类,将需要专场的场景进行包装。代码示例如下:
之前用ffmpeg解码的时候,已经做了硬解码的处理,比如支持qsv、dxva2、d3d11va等方式进行硬解码处理,但是当时解码出来以后,还是重新转成了QImage来绘制,这样就大打折扣了,尽管可以看到GPU使用率有了,但是依然耗时的操作还是在CPU绘制显示,这就显得很尴尬了,Qt封装了大部分的opengl的操作,直接做成了QOPenGLWidget,既支持ffmpeg解码出来的yuyv格式的数据显示,还支持硬解码出来的nv12格式的数据显示,很好很强大,这样的话就大大减轻了CPU的压力,专门交给GPU绘制,经过这么一番彻底的改造,效率提升至少5倍,不要太牛逼!如果开启了opengl绘制,则对应内存会增加不少,可能opengl绘制需要开辟很多的内存来交换数据吧。
一般视频回放都会采用GB28181国标来处理,这样可以保证兼容国内各大厂家的NVR,毕竟在同一的国家标准下,大家都会统一支持国标的,就不需要根据各个厂家的SDK来做兼容处理,烦得很,厂家越来越多,SDK也越来越多,每个厂家的接口未必一致,还要重新封装SDK来处理。
话不多说,源码地址:Vue,React,微信小程序,快应用,TS 和 Koa 地址,欢迎 star 项目目录:
当我们在一个小程序中想要查看某些信息,总是以页面顶部的一个导航栏展示出来,点击该导航栏上的各个标签则会出现对应页面内容。而如何实现顶部的标签导航,则需要我们引入dist中的tab组件。
https://github.com/lygttpod/AndroidCustomView/blob/master/app/src/main/java/com/allen/androidcustomview/widget/PayPsdInputView.java
layui是一款采用自身模块规范编写的前端UI框架,遵循原生HTML/CSS/JS 的书写与组织形式,门槛极低,拿来即用,非常适合界面的快速开发。layui区别于那些基于MVVM底层的UI框架,不需要各种前端工具的复杂配置,只需面对浏览器本身。
JavaEE擅长的就是企业级应用,作为一个Java程序员,如果想自己徒手撸一个ERP、WMS之类的系统还是有一点挑战的,不过今天松哥要给大家介绍几款牛逼的基于Vue.js的后台管理控制面板,掌握这几款管理面板,差不多就可以单枪匹马去接私活了!
通道切换在视频监控系统中是最基础的必备功能,一般都会提供1通道+4通道+6通道+8通道+9通道+16通道这几个通道切换,可能做得比较好的还会提供24通道+32通道的,这个可能对电脑的配置就有一定要求了,一般来说,超过9个通道实时显示视频流,基本上会采用子码流来显示,如果都采用主码流,电脑压力非常巨大,CPU占用很高,内存也高,不过现在的电脑配置越来越高,基本上四千多的台式机,配置已经非常好了,显示个16个通道的实时视频毫无压力。
在之前做的视频监控系统中,根据不同的用户需要,做了好多种视频监控内核,有ffmpeg内核的,有vlc内核的,有mpv内核的,还有海康sdk内核的,为了做成通用的功能,不同内核很方便的切换,比如pro直接改一个DEFINE的变量名,所以需要将各种内核的使用方法做成一样的接口,这样看起来就很整齐,所以后面特意提炼了一个通用的视频控件,该控件没有具体的视频播放控制功能,需要根据不同的内核去调用具体的方法实现,后面还需要增加大华sdk或者其他第三方厂家的协议的时候,直接套用这个通用视频控件即可,以后增加新的监控内核,可以省下很多工作量,基本上只需要做内核解析就行,其余通用接口和绘制图像直接交给通用视频控件就行。
Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。上篇文章我们讲述了基础,可以戳这里:Vue的学习笔记(上篇)。这篇文章我们继续捋一捋~
做视频监控系统,绕不过onvif这玩意,这玩意主要就是为了统一一个大概的标准,能够对各个厂家的监控设备进行常用的一些操作,比如搜索、获取信息、云台控制、事件订阅、抓拍图片等,如果没有这个规范,那么各个厂家都各自为政,需要用私有的sdk去处理,这样就很麻烦很惨了,几十个厂家就需要几十个sdk,对于程序员来说简直是灾难,想想就很恐怖的事情,哪个程序员不想多活几年!
参考官方文档:https://developers.weixin.qq.com/miniprogram/dev/component/
最近在负责一个微信小程序的前端以及前后端接口的对接的项目,整体上所有页面的布局我都已经搭建完成。
微信小程序「我」的页面效果图与需求: 用户有多张名片,需要左右切换查看,往下切换是菜单按钮。 这里需求两处滑动,用到了微信提供给我们的滑动组件 swiper,并且进行了嵌套使用,第一层是名片展
首先声明一点:即便你没有一点点编程基础,也可以跟着这套课程来入门小程序开发。因为本套课程主要就是面向零基础人员。所以讲解的都是一些通俗易懂的入门技能。所以完全不用担心自己不懂编程。
Invesalius是专门应用于医学图像3D重建,输入数据必须是一个序列的2D的DICOM图像,可以是CT或者是MRI序列,输出的是3D表面轮廓,该工具就是为生成解剖学的物理模型而做准备的。该软件在Windows,Linux和MAC中兼容,使其易于实施。下载地址:https://www.cti.gov.br/pt-br/invesalius#download。
(1) 以上代码看起来似乎很简单容易懂,而且效果也能实现,但不够灵活。我们可以发现如果标题和内容同时增多我们要不停的添加cur的索引值,因此我们有必要改进一下代码的写法。 (2)利用vue提供的v-for指令遍历得到索引和值 如下所示:
下载:https://files.cnblogs.com/files/xiaoxiao5016/font-awesome.min.css 或者官方下载:https://fontawesome.com/download
轮播图通俗的说就是在一个模块或者说窗口,通过电脑上鼠标点击、手机上手指滑动后,可以看到多张图片。轮播图的位置一般放置在页面首部,具有内容醒目、重点突出等特点。轮播图在一般的页面中常用于特色推荐,如淘宝网上轮播图中的都是特价商品以及其他一些好物推荐。轮播图在使用过程中,最重要的一个特点就是实时更新。小程序中的轮播图也大致具有以上特点。
采用GPU来绘制实时视频一直以来都是个难点,如果是安防行业的做视频监控开发这块的人员,这个坎必须迈过去,本人一直从事的是安防行业的电子围栏这个相当小众的细分市场的开发,视频监控这块仅仅是周边技术玩一玩探讨一下,关于GPU绘制这块着实走了不少的弯路。
上一篇文章写的是onvif设备搜索,搜到这些设备以后,第一件事情就是要对设备信息获取一下,比如获取视频流地址,配置套件信息、码流信息、分辨率大小等,这些信息的获取根据具体的需要去获取,也没有必要全部获取,毕竟很可能大部分的信息用不到,按需编码永远都是第一原则,第二原则才是考虑拓展性和稳定性,如果基本的需求都实现不了,那就不是一个真正的软件,考虑再多的拓展性和稳定性都是白搭,说的严重一点就是:所有编程语言都是垃圾,能解决实际需求并变现才是王道!
Qt中的动态换肤技术是非常一流的,直接调用qApp->setStyleSheet(qss);就可以对整个应用程序进行换肤,如果样式表内容不多,或者对应的贴图不对,效率还是蛮好的,不过据说有些人写了几千行的样式表,加载起来能够明显感觉卡顿,毕竟此时全部刷新加载重绘,是非常耗CPU的,这种情况就需要避免尽量统一样式表,能合并的就合并,当然,在性能比较好的电脑上,这个基本上遇不到的,也感觉不到的,好比现在的手机相比于十年前的手机,现在动不动都6GB内存了,比起以前256MB内存的时候,不知道爽了多少倍,软件上已经优化不了的事情,靠硬件升级到来的优化体验还是非常棒的。
[ 系列文章 ] 移动端也能兼容的 web 页面制作1:MDBootstrap 演示 Demo 运行演示
AI科技评论按:图像风格迁移一直都是一个十分有趣的研究方向,很多图像迁移工作都备受关注,比如颜色迁移,纹理迁移和风格转换。在图片分享类社交媒体的加持下,这些工作对群众的吸引力尤为明显。一些很流行的 APP 比如 Prisma 和 Facetune 就成功的利用了这种吸引力。浙江大学和香港科技大学的双料博士廖菁在 reddit 上分享过一篇关于风格迁移的论文,引起热烈讨论,原贴来自 reddit,论文 https://arxiv.org/abs/1705.01088,代码https://github.com/msracver/Deep-Image-Analogy 。 AI 科技评论对论文及原贴编译如下。
Todoadmin-pro Pro专业版(vue3.2+ 支持 PC、平板、手机)
前言 最近忙里偷闲,给自己加油充电的时候,发现自己脑海中布局这块非常的凌乱混杂,于是花了一些时间将一些常用的布局及其实现方法整理梳理了出来,在这里,分享给大家。 单列布局
省市区域图也可以叫省市轮廓图,就是将每个省份、市区的边界区域变成轮廓展示,只是个大概的轮廓,和真是的地图基本一致,毕竟都是一个个点堆起来的,可能会有很小很小的误差,之前做大屏系统中间那个中国地图的时候,客户千方百计交代清楚,千万要注意有九段线,不然在展会上被别人看到如果连九段线都没有的话会被人骂死,可能在部分早期的数据由于不是很完善所以未必有,后期的最新的地图数据都是有的,包括轮廓图数据。
本文实例为大家分享了vue实现tab切换的放大镜效果的具体代码,供大家参考,具体内容如下
领取专属 10元无门槛券
手把手带您无忧上云