HarmonyOS 16进制的颜色怎么转换成colorFilter中的参数?

有一个png的图片,我需要改变它的颜色,在api中看到colorFilter这个方式,如果是16进制的颜色我应该怎么转换成colorFilter中的参数。

阅读 508
1 个回答

可以使用如下方法:

function hexColorToColorFilter(hexColor:string):ColorFilter{
  let r=0
  let g=0
  let b=0
  let a=1
  let hexArr:number[] = []
  let length = hexColor.length;
  if (length%2 === 1) {
    hexColor = hexColor.slice(1)
  }
  for (let i = 0; i < hexColor.length/2; i++) {
    let charCode1 = Number.parseInt(hexColor[i*2],16);
    let charCode2 = Number.parseInt(hexColor[i*2+1],16);
    let hexNumber = charCode1*16 + charCode2
    hexArr.push((hexNumber/255.0))
    console.debug(hexNumber.toString(16))
  }
  //大于3表示有透明度
  if (hexArr.length > 3) {
    a = hexArr[0]
    r = hexArr[1]
    g = hexArr[2]
    b = hexArr[3]
  }else {
    r = hexArr[0]
    g = hexArr[1]
    b = hexArr[2]
  }
  let colorFilter: ColorFilter = [r,0,0,0,0,
    0,g,0,0,0,
    0,0,b,0,0,
    0,0,0,a,0,];
  return colorFilter;
}

Image组件使用

Image($r('app.media.live_eye'))
  .backgroundColor('#116f8091')
  .objectFit(ImageFit.Fill)
  .width(60)
  .saturate(0.9)
  .height(60)
  .colorFilter(hexColorToColorFilter("#e90f48db"))
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进