智能门禁上也能有如此漂亮的图形界面

前几天介绍 新一代智能门禁解决方案,他不但有硬核的高级,还有漂亮的图形界面,这就是今天要介绍的主角HaaS UI。
智能门禁产品简介
HaaS UI 又落地在一个新的产品上,这就是人脸识别的智能门禁一体机。该人脸识别一体机是一款5寸红外双目室外人脸识别设备。该设备具备5寸显示屏,支持5万人脸底库的端上存储和离线精准识别,支持刷卡功能,搭载业界顶级人脸识别算法,可实现快速人脸识别与通行。

产品特性
该产品支持人脸识别、逆光识别、刷卡IC卡、自动解锁、访客管理、活体防伪等功能。

应用场景
该产品支持人脸识别管控门禁、办公人脸考勤、语音播报等场景,主要应用于平安社区、企事业单位、政府大楼、商业写字楼、工业园区、学校、金融网点、监狱等室内外场所。

HaaS UI简介
产生背景
在IoT低端带屏场景,需要开发偏复杂的UI界面是比较困难的,业界常用的UI方案如LittleVGL,适合开发一些偏简单偏静态的控制面板类界面,较难满足偏复杂的运营需求,并且应用开发都以C&C++为主,后续的升级迭代或者UI改版会有很大的成本和困难。为解决这一问题,阿里云智能IoT着手打造了IoT低端带屏场景的HaaS UI解决方案,让IoT设备能够运行JS编写的小程序(同时也支持Native C++开发),并支持部署在AliOS Things、RTOS、Linux等操作系统上。

框架介绍
HaaS UI框架是一套用在HaaS平台上的轻量级应用开发框架,是AliOS Things系统上推荐的应用&显示框架,目前是以JS开发为主、C/C++开发为辅。HaaS UI的整体框架由图形渲染引擎、小程序内核和Vue应用框架三部分组成。
组件支持
HaaS UI支持五类组件,分别为:内置组件、基础组件、表单组件、反馈组件和展示组件,开发者可以直接方便地使用这些组件。
| 内置组件 | 基础组件 | 表单组件 | 反馈组件 | 展示组件 |
| div | layout | checkbox | popup | progress |
| scroller | icon | radio | dialog | qrcode |
| text | button | seekbar | - | - |
| image | toast | switch | - | - |
| slider | - | - | - | - |
| canvas | - | - | - | - |
样式支持
HaaS UI的页面布局的盒模型基于 CSS 盒模型,每个组件元素都可视作一个盒子,并支持Flexbox布局模型。HaaS UI支持CSS的一些通用样式,涵盖了文本样式、CSS单位、CSS动画和Less扩展。

| 通用样式 | 文本样式 | CSS单位 | CSS动画 |
| width | color | RGB,RGBA,red | animation-name |
| height | font-size | #f00,#ff0000 | animation-duration |
| padding | font-style | px | animation-timing-function |
| border | font-weight | % | animation-delay |
| margin | text-decoration | rpx | animation-iteration-count |
| flexbox | text-align | vw | animation-direction |
| transition | font-family | vh | animation-fill-mode |
| - | text-overflow | opacity | - |
| - | lines | lines | - |
| - | line-height | flex | - |
远程调试
HaaS UI支持在远程设备上通过WebSocket进行真机调试,可以像浏览器一样查修改页面上的元素,包括DOM标签以及css样式的查看,还有相关盒模型的图形信息。也可以在页面选择一个元素来审查和查看它的相关信息,当我们在浏览器页面下点击某个DOM元素时,设备上相应的DOM节点也会变为高亮状态,方便调试。

方案特性
- HaaS UI推荐JS/CSS开发应用,JS的前端框架为Vue(v2.6.12),实现了W3C标准的标签和样式子集.

- 支持纯C/C++应用开发,方便传统嵌入式开发者进行开发.
- 支持应用在线热更新,可以通过HaaS云服务对开发的应用进行升级.

后续,阿里云IoT HaaS团队将继续在更多场景进行探索,在更多场景中将HaaS UI方案落地。
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
