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

HaaS技术社区

于 2021-07-16 15:21:57 发布

阅读量906

点赞数 1

分类专栏： HaaS解决方案文章标签： ui 门禁物联网嵌入式

本文链接：https://blog.csdn.net/haastech/article/details/118800147

版权

HaaS解决方案专栏收录该内容

47 篇文章 47 订阅

订阅专栏

前几天介绍新一代智能门禁解决方案，他不但有硬核的高级，还有漂亮的图形界面，这就是今天要介绍的主角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节点也会变为高亮状态，方便调试。