HarmonyOS 从文件读取图片为pixelMap 怎样做平铺和纯色填充、图片裁切

从rawfile或者sd卡读取到图片

imageSource.createPixelMap(decodingOptions)

怎样对pixelMap做一些变化操作比如平铺、纯色填充生成个新的pixelMap 给一些组件设置背景使用

HarmonyOS

put_get

5天前

浏览

回答 1

待解决

回答 1

按赞同

按时间

superinsect

先看下这个对pixelmap操作的文档是否满足述求：

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/image-transformation-V5#ZH-CN_TOPIC_0000001893211181__开发步骤

api:

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-image-V5#ZH-CN_TOPIC_0000001847051024__pixelmap7

纯色填充，看下是否满足：

import multimedia_image from '@ohos.multimedia.image';
import { BusinessError } from '@kit.BasicServicesKit'

@Entry
@Component
struct Index1 {
  @State imgSource: multimedia_image.ImageSource | undefined = undefined
  @State _pixelMap: multimedia_image.PixelMap | undefined = undefined
  @State imagePackerApi: multimedia_image.ImagePacker | undefined = undefined


  async btn() {
    const color = new ArrayBuffer(255 * 255 * 4);
    let colorInfo1 : Uint8Array = new Uint8Array(color);
    for (let i = 0; i < colorInfo1.length; i += 4) {
      // b
      colorInfo1[i] = 0;
      // g
      colorInfo1[i + 1] = 0;
      // r
      colorInfo1[i + 2] = 255;
      //a
      colorInfo1[i + 3] = 255;
    }
    let opts : multimedia_image.InitializationOptions = {
      editable: true,
      pixelFormat: 4,
      size: {
        height: 255,
        width: 255
      },
    };
    multimedia_image.createPixelMap(colorInfo1.buffer, opts).then((pixelMap: multimedia_image.PixelMap) => {
      this._pixelMap = pixelMap
      console.info(' succeeded in creating pixelmap.');
    }).catch((error: BusinessError) => {
      console.error(' Failed to create pixelmap.' + error);
    })
  }

  build() {
    Row() {
      Column() {
        Button('提交').onClick(() => {
          this.btn()
        }).height('8%')
          .width('20%')
          .margin(20)
        Image(this._pixelMap)
          .border({ width: 1, color: Color.Blue })
          .width(200).height(200)
          .objectFit(ImageFit.None)
      }
      .width('100%')
    }
    .height('100%')
  }
}