做教案找资料有哪些网站,Fastcgi做网站,南阳网站建设制作,四川省成都市建设厅官网鸿蒙学习实战之路-Core Vision Kit人脸检测实现指南
Core Vision Kit#xff08;基础视觉服务#xff09;提供了机器视觉相关的基础能力#xff0c;什么意思呢#xff1f;通俗点说#xff0c;就是让你的鸿蒙应用长一双眼睛——能看懂图片里的内容是人脸还是文…鸿蒙学习实战之路-Core Vision Kit人脸检测实现指南Core Vision Kit基础视觉服务提供了机器视觉相关的基础能力什么意思呢通俗点说就是让你的鸿蒙应用长一双眼睛——能看懂图片里的内容是人脸还是文字甚至是通用物体。这套能力封装在kit.CoreVisionKit这个包里今天咱们先来聊聊最常用的人脸检测功能。害说起人脸检测我有个朋友去年做美颜相机 App光是调研人脸检测方案就花了两周时间又是研究第三方 SDK又是担心隐私合规问题结果发现鸿蒙系统早就内置了这套能力悔得肠子都青了今天这篇文章我就手把手带你用 Core Vision Kit 实现人脸检测全程不超过 10 分钟适用场景人脸检测技术可以识别图片中的人脸并返回高精度信息适用于多种场景人脸美化与修饰自动定位眼睛、鼻子、嘴巴等五官位置磨皮美白更精准人脸识别与验证刷脸登录、支付验证安全性更高人脸聚类与分组给相册里的人脸自动分组找照片更方便拍照时人脸自动对焦手机摄像头自动锁定人脸拍照不虚焦约束与限制在开始写代码之前有些坑咱们得先避开省得写到一半发现不支持白忙活一场约束项具体说明图像质量建议 720p 以上224px 高度 15210px100px 宽度 10000px宽高比例建议 10:1 以下高度小于宽度的 10 倍实时性接口调用耗时较久不适合实时检测场景并发限制不支持同一用户启用多个线程设备支持不支持模拟器西兰花警告记得上次有个兄弟拿 50x50 像素的头像去做人脸检测信心满满说肯定能识别结果返回空数据来找我维权。害官方建议最小宽度 100px 呢这锅咱鸿蒙可不背啊世界坐标系人脸朝向判断是基于世界坐标系的这个概念稍微有点抽象我给大家伙儿解释一下简单理解Core Vision Kit 内部定义了一套标准的人脸朝向参考系当你传入一张照片时它会判断人脸相对于这个参考系偏转了多少度。听起来有点玄乎对吧没关系实际开发中你只需要知道返回值 orientation 代表什么就行具体怎么判断朝向鸿蒙已经帮你做好了。开发步骤好铺垫完了咱们开始上代码整体流程大概是导入依赖 → 设计页面 → 选择图片 → 执行检测 → 处理结果。1. 导入依赖首先得把要用到的模块 import 进来这一步没啥好说的照着抄就行import{faceDetector}fromkit.CoreVisionKit;import{image}fromkit.ImageKit;import{photoAccessHelper}fromkit.MediaLibraryKit;import{fileIo}fromkit.CoreFileKit;西兰花小贴士这里faceDetector是人脸检测的核心 API类似 JavaScript 里的face-api.js但人家是鸿蒙亲儿子优化做得更好2. 页面布局设计页面结构很简单一个图片展示区、一个结果显示区、两个按钮。代码就像 Vue 的模板一样写起来很直观build(){Column(){// 显示选中的图片Image(this.chooseImage).objectFit(ImageFit.Fill).height(60%)// 显示检测结果Text(this.dataValues).copyOption(CopyOptions.LocalDevice).height(15%).margin(10).width(60%)// 选择图片按钮Button(选择图片).type(ButtonType.Capsule).fontColor(Color.White).alignSelf(ItemAlign.Center).width(80%).margin(10).onClick(()this.selectImage())// 人脸检测按钮Button(人脸检测).type(ButtonType.Capsule).fontColor(Color.White).alignSelf(ItemAlign.Center).width(80%).margin(10).onClick(()this.detectFace())}.width(100%).height(100%).justifyContent(FlexAlign.Center)}这布局就像叠积木一样Column 组件把子元素竖着排列Image 显示图片Text 显示文字Button 就是按钮有没有觉得有点像写 Flutter 或者 Jetpack Compose ArkUI 的声明式写法就是这种感觉3. 图片选择与加载用户点击选择图片按钮后我们需要调用系统图库获取图片然后加载成 PixelMap 格式——这是鸿蒙处理图像的统一格式。// 选择图片privateasyncselectImage(){consturiawaitthis.openPhoto();if(uri)this.loadImage(uri);}// 打开图库privateopenPhoto():Promisestring{returnnewPromise((resolve){constphotoPickernewphotoAccessHelper.PhotoViewPicker();photoPicker.select({MIMEType:photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE,maxSelectNumber:1}).then((res){resolve(res.photoUris[0]);}).catch((err){console.error(选择图片失败:${err.code}-${err.message});resolve();});});}// 加载图片并转换为PixelMapprivateloadImage(uri:string){setTimeout(async(){try{constfileSourceawaitfileIo.open(uri,fileIo.OpenMode.READ_ONLY);constimageSourceimage.createImageSource(fileSource.fd);this.chooseImageawaitimageSource.createPixelMap();this.dataValues;awaitfileIo.close(fileSource);}catch(error){console.error(加载图片失败:${error});}},100);}解释一下这段代码在干嘛openPhoto()调用系统图库让用户选一张图片返回图片的 URIloadImage()根据 URI 打开文件创建 ImageSource最后生成 PixelMap 给 UI 显示这里加了个setTimeout(..., 100)是因为有时候图片刚选出来立马加载会出问题稍微等一下更稳妥4. 执行人脸检测重头戏来了检测本身其实就几行代码的事儿但前后有不少准备工作privateasyncdetectFace(){if(!this.chooseImage)return;try{// 初始化人脸检测器awaitfaceDetector.init();// 配置检测参数constvisionInfo:faceDetector.VisionInfo{pixelMap:this.chooseImage// 传入PixelMap对象};// 执行人脸检测constfaces:faceDetector.Face[]awaitfaceDetector.detect(visionInfo);// 处理检测结果if(faces.length0){this.dataValues未检测到人脸请选择包含人脸的图片;}else{// 格式化输出检测结果constresultfaces.map((face,index){return人脸${index1} 矩形框:${JSON.stringify(face.rect)}置信度:${face.confidence}朝向:${face.orientation}关键点:${face.landmarks.length}个;}).join(\n\n);this.dataValuesresult;}}catch(error){console.error(人脸检测失败:${(errorasBusinessError).message});this.dataValues检测失败:${(errorasBusinessError).message};}finally{// 释放资源faceDetector.release();}}流程一目了然初始化 → 构造 VisionInfo → 调用 detect → 处理结果 → 释放资源。记住finally里一定要调release()跟 Java 里的finally { stream.close() }一个道理完整代码示例上面拆开讲了一遍现在把完整的可运行代码给大家直接复制到 DevEco Studio 里就能跑import{faceDetector}fromkit.CoreVisionKit;import{image}fromkit.ImageKit;import{hilog}fromkit.PerformanceAnalysisKit;import{BusinessError}fromkit.BasicServicesKit;import{fileIo}fromkit.CoreFileKit;import{photoAccessHelper}fromkit.MediaLibraryKit;import{Button,ButtonType,Column,Image,ImageFit,ItemAlign,Text}fromkit.ArkUI;EntryComponentstruct FaceDetectionPage{StatechooseImage:PixelMap|undefinedundefined;StatedataValues:string;build(){Column(){Image(this.chooseImage).objectFit(ImageFit.Fill).height(60%)Text(this.dataValues).copyOption(Text.CopyOptions.LocalDevice).height(15%).margin(10).width(90%).backgroundColor(#f5f5f5).padding(10).borderRadius(5)Button(选择图片).type(ButtonType.Capsule).fontColor(Color.White).alignSelf(ItemAlign.Center).width(80%).margin(10).backgroundColor(#007dff).onClick(()this.selectImage())Button(人脸检测).type(ButtonType.Capsule).fontColor(Color.White).alignSelf(ItemAlign.Center).width(80%).margin(10).backgroundColor(#007dff).onClick(()this.detectFace())}.width(100%).height(100%).justifyContent(FlexAlign.Center)}privateasyncselectImage(){consturiawaitthis.openPhoto();if(uri)this.loadImage(uri);}privateopenPhoto():Promisestring{returnnewPromise((resolve){constphotoPickernewphotoAccessHelper.PhotoViewPicker();photoPicker.select({MIMEType:photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE,maxSelectNumber:1}).then((res){resolve(res.photoUris[0]);}).catch((err:BusinessError){hilog.error(0x0000,FaceDemo,选择图片失败:${err.code}-${err.message});resolve();});});}privateloadImage(uri:string){setTimeout(async(){try{constfileSourceawaitfileIo.open(uri,fileIo.OpenMode.READ_ONLY);constimageSourceimage.createImageSource(fileSource.fd);this.chooseImageawaitimageSource.createPixelMap();this.dataValues;awaitfileIo.close(fileSource);}catch(error){hilog.error(0x0000,FaceDemo,加载图片失败:${error});}},100);}privateasyncdetectFace(){if(!this.chooseImage)return;try{awaitfaceDetector.init();constvisionInfo:faceDetector.VisionInfo{pixelMap:this.chooseImage};constfaces:faceDetector.Face[]awaitfaceDetector.detect(visionInfo);if(faces.length0){this.dataValues未检测到人脸请选择包含人脸的图片;}else{this.dataValuesthis.formatDetectionResult(faces);}}catch(error){consterrerrorasBusinessError;hilog.error(0x0000,FaceDemo,检测失败:${err.code}-${err.message});this.dataValues检测失败:${err.message};}finally{faceDetector.release();}}privateformatDetectionResult(faces:faceDetector.Face[]):string{returnfaces.map((face,index){return人脸${index1}: 位置: x:${face.rect.left}, y:${face.rect.top}, 宽:${face.rect.width}, 高:${face.rect.height}置信度:${face.confidence.toFixed(2)}朝向:${face.orientation}关键点:${face.landmarks.length}个;}).join(\n\n);}}这段代码直接把前面的功能整合到了一起还加了formatDetectionResult方法把检测结果格式化输出更清晰。检测结果说明人脸检测完成后返回的Face对象包含以下关键信息属性类型描述rectRect人脸矩形框坐标left, top, width, heightconfidencenumber检测置信度0-1 之间orientationnumber人脸朝向基于世界坐标系landmarksLandmark[]人脸关键点坐标眼睛、鼻子、嘴巴等西兰花小贴士confidence是检测的可信度如果返回 0.98说明系统有 98% 的把握认为这里有张脸。如果你想做更严格的人脸识别可以加个判断if (face.confidence 0.8) continue;下一步人脸检测做完了还能玩出啥花样官方文档里还提到了两个人脸相关的 API感兴趣的朋友可以继续捣鼓人脸比对判断两张脸是不是同一个人_通用文字识别前面讲过的 OCR识别图片里的文字推荐资料 官方文档是个好东西说三遍官方人脸检测文档Core Vision Kit 人脸检测API 参考手册FaceDetector API我是盐焗西兰花不教理论只给你能跑的代码和避坑指南。下期见