如何获取图片的颜色平均值

import image from '@ohos.multimedia.image'; 
import effectKit from '@ohos.effectKit'; 
import resourceManager from '@ohos.resourceManager'; 
import window from '@ohos.window'; 
 
@Entry 
@Component 
struct Index { 
  @State imgData: Resource[] = [ 
    $r("app.media.image1"), 
    $r("app.media.image2"), 
    $r("app.media.image3") 
  ]; 
  @State bgColor: string = "#ffffff" 
  @State topSafeHeight: number = 0 
  private swiperController: SwiperController = new SwiperController() 
 
  async aboutToAppear() { 
    // 顶部安全高度适配 
    let w: window.Window = await window.getLastWindow(getContext(this)) 
    await w.setWindowLayoutFullScreen(true) 
    this.topSafeHeight = px2vp(w.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM).topRect.height) 
 
    // 初始化页面获取第一张图片的颜色 
    const context = getContext(this); 
    const resourceMgr: resourceManager.ResourceManager = context.resourceManager 
    const fileData: Uint8Array = await resourceMgr.getMediaContent(this.imgData[0]) 
    const buffer = fileData.buffer 
    const imageSource: image.ImageSource = image.createImageSource(buffer) 
    const pixelMap: image.PixelMap = await imageSource.createPixelMap() 
 
    effectKit.createColorPicker(pixelMap, (err, colorPicker) => { 
      let color = colorPicker.getMainColorSync() 
      this.bgColor = "#" + color.alpha.toString(16) + color.red.toString(16) + color.green.toString(16) + color.blue.toString(16) 
    }) 
  } 
 
  build() { 
    Column() { 
      Swiper(this.swiperController) { 
        ForEach(this.imgData, (item: Resource) => { 
          Image(item).borderRadius(10).margin({ top: 20 }) 
        }) 
      } 
      .width("100%") 
      .padding({ left: 20, right: 20 }) 
      .autoPlay(true) 
      .interval(3500) 
      .duration(500) 
      .loop(true) 
      .itemSpace(10) 
      .indicator(false) 
      .disableSwipe(true) 
      .onAnimationStart(async (index, targetIndex) => { 
        try { 
          const context = getContext(this); 
          // 获取resourceManager资源管理器 
          const resourceMgr: resourceManager.ResourceManager = context.resourceManager 
          const fileData: Uint8Array = await resourceMgr.getMediaContent(this.imgData[targetIndex]) 
          // 获取图片的ArrayBuffer 
          const buffer = fileData.buffer 
          //创建imageSource 
          const imageSource: image.ImageSource = image.createImageSource(buffer) 
          //创建PixelMap 
          const pixelMap: image.PixelMap = await imageSource.createPixelMap() 
 
          effectKit.createColorPicker(pixelMap, (err, colorPicker) => { 
            //读取图像主色的颜色值，结果写入Color里 
            let color = colorPicker.getMainColorSync() 
            //开启背景颜色渲染的属性动画 
            animateTo({ duration: 500, curve: Curve.Linear, iterations: 1 }, () => { 
              this.bgColor = "#" + color.alpha.toString(16) + color.red.toString(16) + color.green.toString(16) + color.blue.toString(16) 
            }) 
          }) 
 
 
        } catch (e) { 
          console.log(e) 
        } 
      }) 
    } 
    .width('100%') 
    .height('100%') 
    .linearGradient({ 
      direction: GradientDirection.Bottom, // 渐变方向 
      colors: [[this.bgColor, 0.0], [0xffffff, 0.5]] // 数组末尾元素占比小于1时满足重复着色效果 
    }) 
    .padding({ top: this.topSafeHeight }) 
  } 
}