鸿蒙开发-想给用户戴面具？AR Engine人脸识别和贴纸

做一个 AR 贴纸相机人脸关键点检测和微表情识别你有没有用过抖音或 Snapchat 的 AR 贴纸功能比如给脸上加一个猫耳朵、墨镜、腮红或者做一个实时美颜效果这些功能背后靠的就是AR Engine 的人脸识别能力。它不只能识别出这是一张脸还能精确地检测出脸上各个关键点的位置眼睛、鼻子、嘴巴等甚至能识别你的微表情眨眼、张嘴、微笑等。人脸识别能做什么先来看看人脸识别的一些典型应用场景AR 贴纸在脸上叠加猫耳朵、皇冠、墨镜等虚拟道具实时美颜根据人脸位置自动调整磨皮、美白、瘦脸等效果表情驱动用你的表情来控制一个虚拟角色比如你张嘴虚拟角色也张嘴人脸特效变老滤镜、性别转换滤镜、卡通化滤镜等身份验证结合人脸特征做身份识别怎么开启人脸识别下面的流程图展示了 AR 人脸识别的整体工作流程不支持支持是否否是检查设备是否支持人脸识别支持?提示用户设备不支持配置AR会话: FACE类型前置摄像头初始化AR会话获取每帧人脸数据读取6个关键点位置是否需要微表情?读取BlendShape权重在关键点上放置3D模型模型自动跟随人脸移动用户是否退出?销毁会话释放资源跟其他 AR 能力一样你需要在配置里指定 AR 类型。人脸识别的类型是FACEimport{arEngine,arViewController}fromkit.AREngine;letcontext:arViewController.ARViewContextnewarViewController.ARViewContext();context.config{type:arEngine.ARType.FACE,cameraLensFacing:arEngine.ARCameraLensFacing.FRONT,multiFaceMode:arEngine.ARMultiFaceMode.MULTIFACE_ENABLE};这里有几个关键配置type: arEngine.ARType.FACE告诉 AR Engine “我要做人脸追踪”。cameraLensFacing: arEngine.ARCameraLensFacing.FRONT使用前置摄像头。做 AR 贴纸肯定要用前置摄像头对着自己的脸嘛。如果你要做扫描别人的脸这种功能可以用REAR。multiFaceMode: arEngine.ARMultiFaceMode.MULTIFACE_ENABLE开启多人脸模式。默认是关闭的只能检测一张脸。开启后可以同时检测多张脸适合多人合照的场景。配置好之后调用context.init()初始化 AR 会话。人脸关键点在哪里AR Engine 会检测人脸上的关键点。这些关键点的定义在LandmarkType枚举里LEFT_EYE左眼RIGHT_EYE右眼TIP_OF_NOSE鼻尖LEFT_SIDE_OF_MOUTH嘴巴左侧RIGHT_SIDE_OF_MOUTH嘴巴右侧CENTER_OF_FACE人脸中心一共 6 个关键点。这些关键点覆盖了脸上最重要的位置足以支撑大多数 AR 贴纸场景。你可能会问才 6 个关键点够用吗对于简单的 AR 贴纸来说足够了。比如放一个墨镜你只需要知道两个眼睛的位置放一个口罩你只需要知道嘴巴的位置。但对于需要精确贴合脸型的场景比如全脸美颜6 个关键点可能不够这时候需要结合人脸 Mesh 数据来做更精细的处理。在关键点上放模型AR Engine 提供了loadAsset方法可以让你直接在人脸关键点上放置 3D 模型import{arEngine,arViewController}fromkit.AREngine;letcontext:arViewController.ARViewContextnewarViewController.ARViewContext();// 此处为用户本地存放模型路径letresourcePath:ResourceStr$rawfile(xxxx/xxxx);context.loadAsset(resourcePath,arViewController.LandmarkType.LEFT_EYE);这段代码把一个 3D 模型放在了左眼的位置。resourcePath是模型文件的路径LandmarkType.LEFT_EYE指定放在左眼关键点上。loadAsset返回一个 Promise你可以用await等待它加载完成。加载完成后模型会自动跟随人脸移动——你转头、点头、摇头模型都会跟着动。如果你想移除已经放置的模型可以用removeAsset方法import{arEngine,arViewController}fromkit.AREngine;letcontext:arViewController.ARViewContextnewarViewController.ARViewContext();context.removeAsset(arViewController.LandmarkType.LEFT_EYE);如果你想一次性清除所有放置的模型可以用clearResourceimport{arViewController}fromkit.AREngine;letcontext:arViewController.ARViewContextnewarViewController.ARViewContext();context.clearResource();这在用户切换贴纸的时候很有用。比如用户从猫耳朵切换到墨镜你先调用clearResource()清除所有旧模型再调用loadAsset加载新模型。微表情识别让贴纸更活AR Engine 不仅能告诉你脸在哪里还能告诉你脸上的表情是什么。这就是微表情识别。微表情用ARBlendShapeType枚举来表示。这个枚举有 64 种微表情类型覆盖了脸上的各种动作眼睛相关EYE_BLINK_LEFT/EYE_BLINK_RIGHT闭左眼 / 闭右眼EYE_WIDE_LEFT/EYE_WIDE_RIGHT瞪大左眼 / 瞪大右眼EYE_SQUINT_LEFT/EYE_SQUINT_RIGHT眯左眼 / 眯右眼LEFT_EYEBALL_UP/LEFT_EYEBALL_DOWN左眼球向上 / 向下RIGHT_EYEBALL_LEFT/RIGHT_EYEBALL_RIGHT右眼球向左 / 向右嘴巴相关JAW_OPEN张嘴MOUTH_SMILE_LEFT/MOUTH_SMILE_RIGHT左嘴角微笑 / 右嘴角微笑MOUTH_FROWN_LEFT/MOUTH_FROWN_RIGHT左嘴角下拉 / 右嘴角下拉MOUTH_FUNNELO 型嘴MOUTH_PUCKER噘嘴TONGUE_OUT_SLIGHT伸舌头眉毛相关BROW_DOWN_LEFT/BROW_DOWN_RIGHT左眉下降 / 右眉下降BROW_INNER_UP双眉上扬BROW_OUTER_UP_LEFT/BROW_OUTER_UP_RIGHT左眉外侧上扬 / 右眉外侧上扬其他CHEEK_PUFF鼓腮FROWN_NOSE_MOUTH_UP鼻子上抬每种微表情都有一个权重值范围是 0 到 1。0 表示完全没做这个表情1 表示完全做到位了。比如EYE_BLINK_LEFT的权重为 0 表示眼睛完全睁开权重为 1 表示眼睛完全闭上。你可以通过getBlendShapeWeight方法获取当前的微表情权重import{arEngine,arViewController}fromkit.AREngine;import{Node}fromkit.ArkGraphics3D;onAnchorUpdate(ctx:arViewController.ARViewContext,node:Node,anchor:arEngine.ARAnchor):void{ctx.getBlendShapeWeight(node,arEngine.ARBlendShapeType.EYE_BLINK_LEFT);}你也可以通过setBlendShapeWeight方法手动设置微表情权重import{arEngine,arViewController}fromkit.AREngine;import{Node}fromkit.ArkGraphics3D;onAnchorUpdate(ctx:arViewController.ARViewContext,node:Node,anchor:arEngine.ARAnchor):void{ctx.setBlendShapeWeight(node,arEngine.ARBlendShapeType.EYE_BLINK_LEFT,0.1);}这在做表情驱动的时候很有用。比如你想让一个虚拟角色模仿用户的表情你可以在onAnchorUpdate回调里读取用户的微表情权重然后设置到虚拟角色的模型上。微表情的实际应用下面的流程图展示了微表情驱动贴纸的逻辑权重0.8权重0.5权重0.3权重变化每帧获取微表情权重检测EYE_BLINK权重触发眨眼拍照检测MOUTH_SMILE权重显示笑脸贴纸检测TONGUE_OUT权重触发搞怪特效检测JAW_OPEN权重驱动虚拟角色嘴巴动画微表情识别能做什么有趣的事情眨眼触发拍照检测EYE_BLINK_LEFT和EYE_BLINK_RIGHT的权重当两者都超过 0.8表示双眼都闭上了触发拍照。用户只需要对着镜头眨眨眼就能拍照比按按钮更自然。微笑贴纸检测MOUTH_SMILE_LEFT和MOUTH_SMILE_RIGHT的权重当两者都超过 0.5 时显示一个笑脸贴纸。用户微笑时贴纸自动出现不笑时贴纸消失。搞怪滤镜检测TONGUE_OUT_SLIGHT的权重当用户伸舌头时触发一个搞怪特效比如脸上出现一个彩虹。口型同步检测JAW_OPEN和MOUTH_FUNNEL的权重用这些数据来驱动虚拟角色的嘴巴动画实现口型同步效果。多人脸模式默认情况下AR Engine 只检测一张脸。如果你要做多人合照的 AR 贴纸需要开启多人脸模式context.config{type:arEngine.ARType.FACE,multiFaceMode:arEngine.ARMultiFaceMode.MULTIFACE_ENABLE};开启后AR Engine 会同时检测画面中的多张脸。每张脸都会有一个独立的锚点和关键点你可以在每张脸上分别放置不同的贴纸。需要注意的是多人脸检测会消耗更多的计算资源。如果设备性能不太好可能会出现卡顿。建议根据实际需求来决定是否开启。人脸 Mesh 三角面除了关键点AR Engine 还提供了人脸 Mesh 三角面信息。Mesh 是由很多三角形组成的网格能够更精确地描述人脸的形状。Mesh 三角面有专门的标签ARAnimojiTriangleLabel告诉你每个三角形属于脸的哪个部位LABEL_LOWER_LIP下嘴唇LABEL_UPPER_LIP上嘴唇LABEL_LEFT_EYE左眼睛LABEL_RIGHT_EYE右眼睛LABEL_LEFT_BROW左眉毛LABEL_RIGHT_BROW右眉毛LABEL_BROW_CENTER眉心LABEL_NOSE鼻子LABEL_FACE_OTHER脸部非关键部位Mesh 数据在做高级人脸特效时很有用。比如你想做瘦脸效果就需要知道脸的轮廓在哪里然后把轮廓往里推。6 个关键点不够精确但 Mesh 可以告诉你脸的每一个细节。检查设备是否支持不是所有设备都支持人脸识别。你可以在使用前先检查一下import{arEngine,arViewController}fromkit.AREngine;arViewController.isARTypeSupported(arEngine.ARFeatureType.ARENGINE_FEATURE_TYPE_FACE);如果返回true说明设备支持人脸识别返回false说明不支持。这时候你应该给用户一个友好的提示比如您的设备不支持 AR 人脸功能。需要的权限人脸识别需要用到摄像头所以你需要在module.json5中声明摄像头权限ohos.permission.CAMERA还需要在代码里动态申请这个权限。如果用户拒绝了权限人脸识别就无法工作。资源管理跟其他 AR 能力一样用完之后记得释放资源import{arViewController}fromkit.AREngine;letcontext:arViewController.ARViewContextnewarViewController.ARViewContext();awaitcontext.destroy();destroy()会销毁 AR 会话和渲染场景释放所有占用的资源。这在用户退出 AR 页面时调用。如果你只是暂时不用比如用户切到了其他页面可以用pause()暂停等用户回来时再用resume()恢复不需要重新初始化。实际应用场景AR 直播贴纸主播在直播时使用 AR 贴纸观众看到的是主播脸上叠加了各种特效。这需要实时性很高人脸识别的速度要跟上摄像头的帧率。AR 试妆用户打开 APP前置摄像头对准自己的脸然后选择不同的口红、眼影、腮红颜色。APP 根据人脸关键点的位置在对应部位叠加颜色效果。用户可以实时看到化妆效果比在手背上试色更直观。AR 表情包制作用户对着摄像头做各种表情APP 用微表情识别来检测用户的表情然后生成对应的 AR 表情包。比如用户做一个惊讶的表情APP 生成一个目瞪口呆的 AR 角色。AR 视频通话特效在视频通话时给对方加上 AR 特效。比如给对方加上猫耳朵或者把对方的脸变成卡通风格。人脸识别是 AR 应用中最贴近生活的能力之一。从自拍贴纸到虚拟试妆从表情驱动到身份验证人脸识别的应用场景无处不在。而 AR Engine 提供的关键点检测和微表情识别能力让开发者可以轻松实现各种创意十足的人脸 AR 应用。