HarmonyOS 鸿蒙Next生成二维码中间添加logo问题

目前有需求需要生成二维码, 并且在中间添加logo之后, 转成base64字符串传给前端

之前论坛搜到有直接用Stack放2个Image显示, 但这个需求是不能显示, 直接生成带logo的图片

请问各位大佬有解决方案吗

gougou168 1楼•2 天前

Stack放2个Image 可以的
设置占位隐藏，然后调用组件截图方法就行

yuanlaile 2楼•2 天前

可以通过canvas绘制，达到效果

不在UI组件内也可以，不需要组件显示，可以直接获取到绘制完的图片pixelMap

先使用generateBarcode.createBarcode生成二维码pixelMap

创建canvas

let settings: RenderingContextSettings = new RenderingContextSettings(true)

let img:ImageBitmap = new ImageBitmap("resources/base/media/XXX.png")

let offCanvas: OffscreenCanvas = new OffscreenCanvas(codeSize, codeSize)

let offContext = offCanvas.getContext("2d", settings)

//result：二维码图片pixelMap。先绘制二维码

offContext.drawImage(result, 0, 0,codeSize,codeSize)

//绘制中间的图片

offContext.drawImage(img, codeSize/2-40, codeSize/2-40, 80, 80)

//得到添加完logo的图片数据

let bindImgPixel = offContext.getPixelMap(0,0,codeSize,codeSize)

vueper 3楼•2 天前

针对HarmonyOS鸿蒙Next生成二维码中间添加logo的问题，虽然Scan Kit并未直接提供添加logo的接口，但可以通过以下方法实现：

一种常见的方法是使用Stack布局。首先，通过Scan Kit的接口生成二维码图片，然后在Stack布局中，将生成的二维码图片组件放在下层，logo图片组件放在上层。这样，就可以实现二维码中间带有logo的效果。

另一种方法是通过Canvas绘制。首先，同样使用Scan Kit生成二维码图片，然后利用Canvas的drawImage方法，先绘制二维码图片，再绘制logo图片。通过调整绘制位置和大小，可以将logo放置在二维码的中心位置。

以上两种方法均可以实现HarmonyOS鸿蒙Next生成二维码中间添加logo的需求。如果在实际操作中遇到问题，建议检查二维码和logo图片的格式、大小以及布局或绘制参数是否正确设置。

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