#鸿蒙通关秘籍#在HarmonyOS中如何将RGB颜色格式转换为HSV并进行调整?

HarmonyOS
2024-12-03 11:41:07
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
hm67482d787ed5a

RGB到HSV的转换需要考虑三个颜色通道的最大最小值,以计算色调、饱和度和亮度。步骤如下:

  1. 首先,将RGB颜色格式转换成HSV格式:

    let hsv: ColorHsv = ColorUtils.rgb2hsv(rgb);
    
    public static rgb2hsv(color: ColorRgb): ColorHsv {
      const red: number = color.red / MAX_RGB_VALUE;
      const green: number = color.green / MAX_RGB_VALUE;
      const blue: number = color.blue / MAX_RGB_VALUE;
    
      const max: number = Math.max(red, green, blue);
      const min: number = Math.min(red, green, blue);
      const delta: number = max - min;
    
      let hue: number = 0;
      let saturation: number = 0;
      let value: number = 0;
      if (max === min) {
        hue = 0;
      } else if (max === red) {
        hue = (green >= blue ? ((green - blue) / delta) * 60 : ((green - blue) / delta) * 60 + 360);
      } else if (max === green) {
        hue = (((blue - red) / delta) + 2) * 60;
      } else if (max === blue) {
        hue = (((red - green) / delta) + 4) * 60;
      }
      saturation = (max === 0 ? 0 : delta / max);
      value = max;
    
      return {
        hue: hue,
        saturation: saturation,
        value: value,
        alpha:color.alpha
      }
    }
    
  2. 对HSV格式中的Saturation和Value进行调整,使背景色和图标主色有明显区分:

    export function modifySVValue(color: ColorHsv): void {
      if (color.hue > 20 && color.hue <= 60) {
        color.saturation = 0.12;
        color.value = 0.93;
      } else if (color.hue > 60 && color.hue <= 190) {
        color.saturation = 0.08;
        color.value = 0.91;
      } else if (color.hue > 190 && color.hue <= 270) {
        color.saturation = 0.1;
        color.value = 0.93;
      } else {
        color.saturation = 0.08;
        color.value = 0.93;
      }
    }
    
  3. 把调整后的HSV值转换回RGB格式:

    rgb = ColorUtils.hsv2rgb(hsv);
    
    public static hsv2rgb(color: ColorHsv): ColorRgb {
      const h60: number = color.hue / 60;
      const h60f: number = Math.floor(h60);
      const hi: number = h60f % 6;
      const f: number = h60 - h60f;
      const p: number = color.value * (1 - color.saturation);
      const q: number = color.value * (1 - f * color.saturation);
      const t: number = color.value * (1 - (1 - f) * color.saturation);
    
      let red: number = 0.0;
      let green: number = 0.0;
      let blue: number = 0.0;
      if (hi === 0) {
        red = color.value;
        green = t;
        blue = p;
      } else if (hi === 1) {
        red = q;
        green = color.value;
        blue = p;
      } else if (hi === 2) {
        red = p;
        green = color.value;
        blue = t;
      } else if (hi === 3) {
        red = p;
        green = q;
        blue = color.value;
      } else if (hi === 4) {
        red = t;
        green = p;
        blue = color.value;
      } else if (hi === 5) {
        red = color.value;
        green = p;
        blue = q;
      }
      return {
        red: Math.floor(red * MAX_RGB_VALUE),
        green: Math.floor(green * MAX_RGB_VALUE),
        blue: Math.floor(blue * MAX_RGB_VALUE),
        alpha:color.alpha
      }
    }
    
分享
微博
QQ
微信
回复
2024-12-03 13:24:30
相关问题
如何将时间戳转换为日期格式的时间
3386浏览 • 1回复 待解决
HarmonyOS 如何将视频转换为GIF
141浏览 • 1回复 待解决
HarmonyOS 如何将base64数据转换为图片
674浏览 • 1回复 待解决
如何将字符串转换为浮点数。
643浏览 • 1回复 待解决
如何将app.media.app_icon,转换为PixelMap
2232浏览 • 1回复 待解决
HarmonyOS 如何将时间进行格式化?
449浏览 • 1回复 待解决