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

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

HarmonyOS
2024-12-26 15:02:06
630浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
zbw_apple

可以参考如下Demo示例:

import { image } from '@kit.ImageKit'

@Entry
@Component
struct Index {
  @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%')
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
分享
微博
QQ
微信
回复
2024-12-26 16:12:06


相关问题
HarmonyOS 如何 app 添加水印
1238浏览 • 1回复 待解决
HarmonyOS是否支持图片添加水印
1013浏览 • 1回复 待解决
HarmonyOS拍照后图片添加水印
695浏览 • 1回复 待解决
HarmonyOS windows级别添加水印
660浏览 • 1回复 待解决
如何使用canvas添加水印
2335浏览 • 1回复 待解决
HarmonyOS 拍照后图片加水印
700浏览 • 1回复 待解决
HarmonyOS PDF添加水印后展示白屏
712浏览 • 1回复 待解决
HarmonyOS 如何在app内全页面添加水印
812浏览 • 1回复 待解决
HarmonyOS 有没有对UI添加水印方法
706浏览 • 1回复 待解决
HarmonyOS 如何图片增加文字水印
739浏览 • 1回复 待解决
HarmonyOS 使用canvas进行图片水印操作
881浏览 • 1回复 待解决
HarmonyOS 手机静音情况下,无法震动
1011浏览 • 1回复 待解决
如何按钮添加图片
6656浏览 • 4回复 待解决
恭喜您,今日已阅读两篇内容,特奖励+2声望, 快来领取吧。