HarmonyOS 鸿蒙Next RichEditor获取编辑的图文内容的问题

发布于 1周前 作者 htzhanglong 来自 鸿蒙OS

HarmonyOS 鸿蒙Next RichEditor获取编辑的图文内容的问题

1. 在使用RichEditor组件编辑图文的时候，通过getSpans方法获取内容的时候，发现图片是以 resource:///16777239.png 这种格式返回的，这样好像无法直接在Imge展示，请问这样的图片如何能在Image使用？

2. 顺便问一下 通过getMediaContentSync(resId: number, density?: number): Uint8Array 方法拿到的的图片信息
Uint8Array怎么转换成可以用Image展示的格式

Harmonyos Next教程
2 回复

1、getSpans方法获取的图片是否能在Image中使用 可以直接使用。getSpans方法获取到的图片数据类型为ResourceStr，imge也支持这个数据类型，可以直接将这个url放置上去，样例： Image(ResourceStr) 2、Uint8Array怎么转换成可以用Image展示的格式？ 使用[@kit](/user/kit).ImageKit插件中的image方法（import { image } from '[@kit](/user/kit).ImageKit';）

const fileData: Uint8Array = getMediaContentSync(resId: number, density?: number)
const buffer = fileData.buffer;
const imageSource: image.ImageSource = image.createImageSource(buffer as ArrayBuffer);<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>

// 这个是一个异步方法,得出的数据是一个可以通过Image方法渲染出来的数据

const pixelMap: image.PixelMap = await imageSource.createPixelMap();<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>

可以按照下面的样例进行渲染 Image(pixelMap)

针对HarmonyOS 鸿蒙Next RichEditor获取编辑的图文内容的问题，以下是一些解决方案：

  1. 图片内容获取：

    • 使用getSpans方法获取图片内容时，返回的图片格式可能是resource:///开头的URL。这种格式的图片可以直接在Image组件中使用，因为Image组件支持ResourceStr类型的数据。
    • 如果需要获取图片的二进制数据，可以使用getMediaContentSync方法，该方法返回一个Uint8Array类型的图片数据。要将其转换为Image组件可展示的格式，可以使用@kit.ImageKit插件中的image方法，将Uint8Array转换为image.ImageSource，再进一步转换为image.PixelMap进行渲染。

  2. 文本内容获取：

    • 如果在onPaste回调中无法直接获取粘贴的文本信息，可以尝试通过pasteboard API来获取剪切板内容。确保应用已获得剪切板访问权限，并使用pasteboard.getSystemPasteboard().getDataSync().getPrimaryText()来获取文本。

如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html 。

回到顶部