HarmonyOS Scan Kit服务中码图生成如何添加logo图片?

我们使用码图生成的api createBarcode生成二维码时,发现不支持传一个图片覆盖在二维码中。

HarmonyOS
3天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

​1、通过布局的方式,比如使用Stack堆叠布局,下层放二维码图片,上层放logo图片;

2、通过Canvas进行绘制,先绘制二维码图片,再绘制logo图片,绘制的位置根据实际情况调整,提供参考代码如下:​

@Entry 
@Component 
struct Index { 
  @State pixelMap: image.PixelMap | undefined = undefined 
  private settings: RenderingContextSettings = new RenderingContextSettings(true) 
  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) 
  private img: ImageBitmap = new ImageBitmap("common/logo.png") 
 
  createQRCode() { 
    this.pixelMap = undefined; 
    let content: string = 'huawei'; 
    let options: generateBarcode.CreateOptions = { 
      scanType: scanCore.ScanType.QR_CODE, 
      height: 300, 
      width: 300 
    } 
    // 码图生成接口,成功返回PixelMap格式图片 
    generateBarcode.createBarcode(content, options).then((pixelMap: image.PixelMap) => { 
      this.pixelMap = pixelMap; 
      this.context.drawImage(this.pixelMap, 0, 0, 300, 300, 0, 0, 300, 300); 
      this.context.drawImage(this.img, 0, 0, 80, 80, 110, 110,80,80 ); 
    }).catch((error: BusinessError) => { 
      hilog.error(0x0001, '[generateBarcode]', 'promise error : %{public}s', JSON.stringify(error)); 
    }) 
  } 
 
  build() { 
    Column() { 
      Canvas(this.context) 
        .width(300) 
        .height(300) 
        .onReady(()=>{ 
          this.createQRCode() 
        }) 
    } 
    .width('100%') 
    .height('100%') 
    .alignItems(HorizontalAlign.Start) 
    .justifyContent(FlexAlign.Start) 
  } 
}
分享
微博
QQ
微信
回复
3天前
相关问题
Scan Kit无法识别多个
1643浏览 • 1回复 待解决
自定义组件如何添加图片
2496浏览 • 1回复 待解决
如何生成时的镂空遮罩?
148浏览 • 1回复 待解决
HarmonyOS服务权限问题
53浏览 • 1回复 待解决
HarmonyOS 图片问题
153浏览 • 1回复 待解决
HarmonyOS 二维生成的demo
67浏览 • 2回复 待解决
HarmonyOS服务添加、删除功能
429浏览 • 1回复 待解决
如何给按钮添加图片
5304浏览 • 4回复 待解决
服务中心添加卡片怎么添加
6279浏览 • 1回复 待解决
图片如何添加渐变模糊
1846浏览 • 1回复 待解决