HarmonyOS 鸿蒙Next：在用户不需操作和预览的情况下，实现给图片添加水印

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

HarmonyOS 鸿蒙Next：在用户不需操作和预览的情况下，实现给图片添加水印

用户选择或拍摄了图片后，不需要经过用户操作和预览，直接对图片添加水印，该如何实现呢？
就是用户只看到选择图片或拍照的界面，不看到给图片加水印的过程 

Harmonyos Next教程
2 回复

可以参考如下Demo示例：

import { image } from '[@kit](/user/kit).ImageKit'

[@Entry](/user/Entry)

[@Component](/user/Component)

struct Index {

  [@State](/user/State) pixelMap: PixelMap | null = null

  aboutToAppear(): void {

    getContext(this).resourceManager.getMediaContent($r("app.media.startIcon")).then((data) => {

      let arrayBuffer = data.buffer.slice(data.byteOffset, data.byteLength + data.byteOffset)

      let imageSource: image.ImageSource = image.createImageSource(arrayBuffer);

      imageSource.getImageInfo((err, value) => {

        if (err) {

          return;

        }

        let opts: image.DecodingOptions = {

          editable: true,

          desiredSize: {

            height: value.size.height,

            width: value.size.width

          }

        };

        imageSource.createPixelMap(opts, (err, pixelMap) => {

          // 这个回调的pixelMap就是当前图片的pixelMap

          let offScreenCanvas = new OffscreenCanvas(value.size.width, value.size.height)

          let OffScreenContext = offScreenCanvas.getContext("2d")

          OffScreenContext.drawImage(pixelMap, 0, 0, offScreenCanvas.width, offScreenCanvas.height)

          OffScreenContext.fillStyle = '#30000000'

          OffScreenContext.font = "50px"

          OffScreenContext.fillText("水印水印水印水印水印", 20, 30)

          // 获取新的PixelMap

          this.pixelMap = OffScreenContext.getPixelMap(0, 0, offScreenCanvas.width, offScreenCanvas.height)

        })

      })

    })

  }

  build() {

    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {

      Image(this.pixelMap).width(100).height(100)

    }

    .width('100%')

    .height('100%')

  }

}

更多关于HarmonyOS 鸿蒙Next：在用户不需操作和预览的情况下，实现给图片添加水印的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，若要在用户无需操作和预览的情况下自动为图片添加水印，可以通过以下方式实现：

  1. 利用系统API进行图像处理：鸿蒙系统提供了丰富的多媒体处理API，可以直接调用这些API对图片进行加载、处理和保存。具体地，可以使用Image类加载图片，通过Canvas类进行绘制水印，最后使用Bitmap类保存处理后的图片。

  2. 水印内容与位置：水印内容可以设定为固定的文字或图标，位置可以根据图片的布局自动计算，如固定在图片的右下角。

  3. 自动化处理：在后台服务或定时任务中执行上述图像处理逻辑，确保用户无需手动操作和预览即可实现水印添加。

  4. 权限与资源管理：确保应用具有读写存储空间的权限，并合理管理图片处理过程中所需的内存和CPU资源。

示例代码（简化）：

Image image = Image.load("path/to/image");
Canvas canvas = new Canvas(image);
canvas.drawText("Watermark", x, y, paint);
Bitmap bitmap = canvas.toBitmap();
bitmap.save("path/to/save");

（注意：实际代码需根据鸿蒙系统的API文档进行适配）

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

回到顶部