如何使用Flutter Dart将十六进制颜色转换为RGB颜色

一、手动转换步骤 #

以你给出的示例0xff4f6872为例：

1. 拆分颜色通道：先去掉前缀0x，剩余的ff4f6872是8位十六进制值，其中前两位ff代表透明度（Alpha通道），后面六位按两位一组拆分：4f（红色）、68（绿色）、72（蓝色）。
2. 十六进制转十进制：将每组两位的十六进制数转换为十进制：
   • 4f：4*16 + 15 = 79
   • 68：6*16 + 8 = 104
   • 72：7*16 + 2 = 114
     最终得到RGB值 (R:79 G:104 B:114)

如果是其他常见格式：

• 6位纯RGB格式（如#4f6872）：直接拆分后六位为三组两位，按上述方法转十进制即可。
• 3位缩写格式（如#f46）：先扩展为6位（#ff4466），再执行转换。

二、代码实现示例 #

Python 版本

def hex_to_rgb(hex_str):
    # 去除前缀0x或#
    clean_hex = hex_str.lstrip('0x#')
    
    if len(clean_hex) == 8:
        # 处理带Alpha的8位格式，忽略Alpha返回RGB
        r = int(clean_hex[2:4], 16)
        g = int(clean_hex[4:6], 16)
        b = int(clean_hex[6:8], 16)
    elif len(clean_hex) == 6:
        # 处理6位纯RGB格式
        r = int(clean_hex[:2], 16)
        g = int(clean_hex[2:4], 16)
        b = int(clean_hex[4:6], 16)
    elif len(clean_hex) == 3:
        # 处理3位缩写格式
        r = int(clean_hex[0]*2, 16)
        g = int(clean_hex[1]*2, 16)
        b = int(clean_hex[2]*2, 16)
    else:
        raise ValueError("无效的十六进制颜色格式")
    
    return (r, g, b)

# 测试示例
print(hex_to_rgb("0xff4f6872"))  # 输出 (79, 104, 114)

JavaScript 版本

function hexToRgb(hexStr) {
    const cleanHex = hexStr.replace(/^0x|#/, '');
    let r, g, b;

    if (cleanHex.length === 8) {
        r = parseInt(cleanHex.substring(2, 4), 16);
        g = parseInt(cleanHex.substring(4, 6), 16);
        b = parseInt(cleanHex.substring(6, 8), 16);
    } else if (cleanHex.length === 6) {
        r = parseInt(cleanHex.substring(0, 2), 16);
        g = parseInt(cleanHex.substring(2, 4), 16);
        b = parseInt(cleanHex.substring(4, 6), 16);
    } else if (cleanHex.length === 3) {
        r = parseInt(cleanHex[0] + cleanHex[0], 16);
        g = parseInt(cleanHex[1] + cleanHex[1], 16);
        b = parseInt(cleanHex[2] + cleanHex[2], 16);
    } else {
        throw new Error("无效的十六进制颜色格式");
    }

    return { r, g, b };
}

// 测试示例
console.log(hexToRgb("0xff4f6872"));  // 输出 {r: 79, g: 104, b: 114}

内容的提问来源于stack exchange，提问作者WIN