图片拼接鸿蒙示例代码

本文原创发布在华为开发者社区。

介绍

本示例可以通过图库选择一张图片，可横向拼接成一张图，也可竖向拼接成一张图，然后保存到图库。

图片拼接源码链接

效果预览

使用说明

点击横向拼接或竖向拼接按钮进行图片拼接，拼接完成后可点击进行下载保存拼接得到的图片。

实现思路

获取要拼接图片的信息，计算出拼接后图片的大小等信息，根据这些信息创建出一个pixelMap。然后将要拼接的图片的pixelMap写入创建的空的pixelMap即可。

 export async function joinImages(images: Array<string>, isH = true) {
  try {
    if (images.length < 2) {
      return;
    }
    获取图片信息
    ...
    
    根据要拼接图片创建拼接后的pixelMap
    const combineColor = new ArrayBuffer(combineOpts.size.width * combineOpts.size.height * 4);
    const newPixelMap = await image.createPixelMap(combineColor, combineOpts);
    for (let x = 0; x < images.length; x++) {
      const singleOpts = x === 0 ? singleOpts1 : singleOpts2
      let singleColor = new ArrayBuffer(singleOpts.desiredSize!.width * singleOpts.desiredSize!.height * 4);
      let imageSource = x === 0 ? imageSource1 : imageSource2
      let singleWidth = x === 0 ? singleWidth1 : singleWidth2
      let singleHeight = x === 0 ? singleHeight1 : singleHeight2
      //读取小图
      const singlePixelMap = await imageSource.createPixelMap(singleOpts);
      await singlePixelMap.readPixelsToBuffer(singleColor);
      //写入大图
      let area: image.PositionArea = {
        pixels: singleColor,
        offset: 0,
        stride: singleWidth * 4,
        region: {
          size: { height: singleHeight, width: singleWidth },
          x: isH ? x === 0 ? 0 : singleWidth1 : 0,
          y: isH ? 0 : x === 0 ? 0 : singleHeight1
        }
      }
      await newPixelMap.writePixels(area);
    }
    return newPixelMap;
  } catch (err) {
    hilog.error(0x0000, 'JOIN_IMAGES', 'PictureJoinTogether join error: ' + JSON.stringify(err))
  }
  return
}