文档管理中心
|

HarmonyOS 5

图形图像

图片文字识别和滑动复制文字

一、开发准备

识别文字和滑动复制文字分别需要导入以下依赖。

import { textRecognition } from '@kit.CoreVisionKit';//用于文字识别能力

import { BusinessError, pasteboard } from '@kit.BasicServicesKit';//用于对剪切板操作,支持复 制文本到剪贴板。

二、实现文字识别功能

获取图像资源

通过封装工具类处理不同类型的图片来源(本地路径、网络URL、资源文件)并保存到沙箱中。

封装方法加载图片并将其转换为PixelMap对象供后续识别使用。

收起
自动换行
深色代码主题
复制
 const file = fs.openSync(filePath, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE)
 const imageSource = image.createImageSource(file.fd)
 return await imageSource.createPixelMap()

调用文字识别API

在aboutToAppear()生命周期钩子中调用textRecognition.init()进行初始化文字识别模块。

使用textRecognition.recognizeText(visionInfo, textConfiguration)执行实际的文字识别操作,并将结果存储在dataValues中

收起
自动换行
深色代码主题
复制
   try {
      const result = await textRecognition.recognizeText(visionInfo, textConfiguration)
      console.log('文字识别结果:' + this.dataValues)
      if (!result.value) {
        promptAction.showToast({ message: '该图片识别不到文字' })
        PromptQrTextResultDialog.closeDialog()
        return
      }
this.dataValues = result.value
      this.updateCharList() // 初始化字符列表
      this.showBindSheet = true
    } catch (e) {
      promptAction.showToast({ message: '文字识别失败' })
    }

释放资源

在组件销毁前调用`textRecognition.release()`释放识别资源,避免内存泄漏

三、实现滑动复制图片功能

字符布局与绑定位置信息

将识别出的文本按行拆分为字符数组,并通过onAreaChange事件记录每个字符的位置(x, y)、宽度和高度。构建lineGroups结构,便于后续对每一行字符进行操作。

收起
自动换行
深色代码主题
复制
.onAreaChange((_: Area, newValue: Area) => {
                    charInfo.width = newValue.width;
                    charInfo.height = newValue.height;
                    charInfo.x = newValue.globalPosition.x;
                    charInfo.y = newValue.globalPosition.y;
                  })

    手势交互处理和触摸事件处理

使用PanGesture监听横向滑动手势,用于多选操作,在onActionUpdate回调中计算当前滑动区域内的字符范围,并更新其isSelected状态以高亮选中字符

监听onTouch事件,记录起始点和结束点,确定用户选择的矩形区域,根据触点坐标判断哪些字符位于该区域内,并相应地更新它们的选中状态

复制选中文本

收集所有被选中的字符,按照原始顺序拼接成字符串,利用pasteboard模块将最终结果复制到系统剪贴板,并给出提示反馈

收起
自动换行
深色代码主题
复制
copyText(text: string) {

    const pasteboardData = pasteboard.createData(pasteboard.MIMETYPE_TEXT_PLAIN, text);

    const systemPasteboard = pasteboard.getSystemPasteboard();

    systemPasteboard.setData(pasteboardData); // 将数据放入剪切板

    systemPasteboard.getData().then((data) => {

//成功和失败处理

    })

  }

点赞
收藏
回复
1
分享
举报
浏览192 发布于2025-06-06 03:52江苏
全部评论
最多点赞
最新发布
最早发布
写回答
新增插入模板功能
一键使用模板,快速填写内容,轻松发帖~
知道了
  • 为了保障您的信息安全,请勿上传您的敏感个人信息(如您的密码等信息)和您的敏感资产信息(如关键源代码、签名私钥、调试安装包、业务日志等信息),且您需自行承担由此产生的信息泄露等安全风险。
  • 如您发布的内容为转载内容,请注明内容来源。

我要发帖子

了解社区公约,与您携手共创和谐专业的开发者社区。