const LabelMap: Record<number, string> = { 0: "风景", 1: "动物", 2: "植物", 3: "建筑", 5: "人脸", 6: "表格", 7: "文本", 8: "人头", 9: "猫头", 10: "狗头", 11: "食物", 12: "汽车", 13: "人体", 21: "文档", 22: "卡证" };
@Entry @ComponentV2 struct ObjectDetection { @Local chooseImage?: PixelMap @Local objects: objectDetection.VisionObject[] = [] @Local canvasWidth: number = 320 @Local canvasHeight: number = 200 @Local bozaiImage?: PixelMap
async aboutToAppear(): Promise<void> {
const resManager = getContext()
.resourceManager
const bozaiArray = await resManager.getMediaContent($r('app.media.bozai'))
const bozaiResource = image.createImageSource(bozaiArray.buffer)
this.bozaiImage = await bozaiResource.createPixelMap()
}
async checkImage() {
// 1. 选择图片
const photoPicker = new photoAccessHelper.PhotoViewPicker()
const result = await photoPicker.select({
MIMEType: photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE,
maxSelectNumber: 1
})
const uri = result.photoUris[0]
if (uri) {
const imageFile = await fileIo.open(uri, fileIo.OpenMode.READ_ONLY)
const imageSource = image.createImageSource(imageFile.fd)
this.chooseImage = await imageSource.createPixelMap()
// 2. 进行识别
const request: visionBase.Request = {
inputData: { pixelMap: this.chooseImage }
}
if (canIUse('SystemCapability.AI.Vision.ObjectDetection')) {
const objectDetector = await objectDetection.ObjectDetector.create()
const data = await objectDetector.process(request)
this.objects = data.objects
// 3. 绘制识别区域
const imageInfo = await this.chooseImage.getImageInfo()
const ratio = 320 / imageInfo.size.width
this.canvasHeight = imageInfo.size.height * ratio
this.canvasContext.drawImage(this.chooseImage, 0, 0, this.canvasWidth, this.canvasHeight)
this.objects.forEach(item => {
if (item.labels.includes(5)) {
const box = item.boundingBox
this.canvasContext.drawImage(this.bozaiImage, box.left * ratio - ( box.height * ratio * 0.15 ), box.top * ratio, box.height * ratio,
box.height * ratio)
}
// const box = item.boundingBox
// this.canvasContext.strokeStyle = '#FF0000'
// this.canvasContext.strokeRect(box.left * ratio, box.top * ratio, box.width * ratio, box.height * ratio);
})
}
}
}
private settings: RenderingContextSettings = new RenderingContextSettings(true);
private canvasContext: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings);
build() {
Column({ space: 20 }) {
Canvas(this.canvasContext) {
}
.width(this.canvasWidth)
.height(this.canvasHeight)
.backgroundColor('#CCCCCC')
Button('选择图片,进行识别')
.onClick(() => {
this.checkImage()
})
List({ space: 20 }) {
ForEach(this.objects, (item: objectDetection.VisionObject) => {
ListItem() {
Column() {
Text('可信度:' + item.score)
.width('100%')
Text('标签:' + item.labels.map(label => LabelMap[label])
.join(','))
.width('100%')
Text('尺寸:' + JSON.stringify(item.boundingBox))
.width('100%')
}
}
})
}
.width('100%')
.height('100%')
.layoutWeight(1)
}
.padding(15)
.height('100%')
.width('100%')
}
}