Swift中如何将UIColor转换为3/4/6/8位十六进制字符串？

Great question! Let's walk through how to implement these conversions cleanly, following the CSS color hex notation rules you referenced, and clear up the confusion around alpha channel order.

First, Recap the Hex Notation Rules #

To make sure we're aligned:

• 6-digit (#RRGGBB): Full RGB values, alpha is fully opaque (1.0)
• 8-digit (#RRGGBBAA): Full RGBA values, last two digits represent alpha (00 = fully transparent, FF = fully opaque)
• 3-digit (#RGB): Shorthand for 6-digit, where each digit is doubled (e.g., #F0A → #FF00AA)
• 4-digit (#RGBA): Shorthand for 8-digit, where each digit is doubled (e.g., #F0AC → #FF00AACC)

Implementation: UIColor Extension #

We'll create a UIColor extension to add these computed properties, making it easy to call like UIColor.blue.eightDigitsHexString.

import UIKit

extension UIColor {
    // Private helper to get normalized RGBA components (0-255 integers)
    private func normalizedRGBAComponents() -> (red: Int, green: Int, blue: Int, alpha: Int)? {
        guard let components = cgColor.components, components.count >= 3 else {
            // Return nil for colors that can't be converted to RGB (e.g., pattern colors)
            return nil
        }
        
        let red = lroundf(Float(components[0]) * 255)
        let green = lroundf(Float(components[1]) * 255)
        let blue = lroundf(Float(components[2]) * 255)
        let alpha = components.count >= 4 ? lroundf(Float(components[3]) * 255) : 255
        
        return (red, green, blue, alpha)
    }
    
    // 6-digit hex string (#RRGGBB)
    var sixDigitsHexString: String? {
        guard let (r, g, b, _) = normalizedRGBAComponents() else { return nil }
        return String(format: "#%02lX%02lX%02lX", r, g, b)
    }
    
    // 8-digit hex string (#RRGGBBAA) – matches CSS spec
    var eightDigitsHexString: String? {
        guard let (r, g, b, a) = normalizedRGBAComponents() else { return nil }
        return String(format: "#%02lX%02lX%02lX%02lX", r, g, b, a)
    }
    
    // 3-digit hex string (#RGB) – only valid if components are multiples of 17
    var threeDigitsHexString: String? {
        guard let (r, g, b, _) = normalizedRGBAComponents() else { return nil }
        
        // 3-digit is a shorthand: each digit maps to two identical digits in 6-digit
        // So each component must be divisible by 17 (since 17*15 = 255 → 0xF → 0xFF)
        guard r % 17 == 0, g % 17 == 0, b % 17 == 0 else {
            // If the color can't be represented as 3-digit, return nil (or fall back to 6-digit if preferred)
            return nil
        }
        
        let rShort = r / 17
        let gShort = g / 17
        let bShort = b / 17
        
        return String(format: "#%1lX%1lX%1lX", rShort, gShort, bShort)
    }
    
    // 4-digit hex string (#RGBA) – only valid if all components are multiples of 17
    var fourDigitsHexString: String? {
        guard let (r, g, b, a) = normalizedRGBAComponents() else { return nil }
        
        // Same logic as 3-digit, but includes alpha
        guard r % 17 == 0, g % 17 == 0, b % 17 == 0, a % 17 == 0 else {
            return nil
        }
        
        let rShort = r / 17
        let gShort = g / 17
        let bShort = b / 17
        let aShort = a / 17
        
        return String(format: "#%1lX%1lX%1lX%1lX", rShort, gShort, bShort, aShort)
    }
}

Key Notes on the Implementation #

• Handling Non-RGB Colors: The helper method returns nil for colors that can't be decomposed into RGB components (like pattern colors or system colors with unknown spaces). You can adjust this to fall back to a default if needed.
• 3/4-Digit Shorthand Validity: Not all colors can be represented in shorthand form. For example, a color with red=200 isn't divisible by 17, so it can't be written as a single hex digit. The code returns nil in these cases, but you could modify it to return the 6/8-digit string instead if you want a fallback.
• Case Control: The code uses %02lX for uppercase hex letters. Use %02lx if you prefer lowercase.

RRGGBBAA vs AARRGGBB: What's the Difference? #

The order of the alpha channel matters a lot depending on where you're using the string:

• RRGGBBAA: This follows the CSS color specification. The last two digits represent alpha, which is standard for web, cross-platform systems, and most design tools. Your example UIColor.blue.eightDigitsHexString returning #0000FFFF uses this format (blue with 100% opacity).
• AARRGGBB: This is the native byte order for iOS/macOS's CGColor (ARGB32 format). While iOS can parse this format internally, it's not compatible with CSS or other external systems. If you send an AARRGGBB string to a web app, it will interpret the first two digits as red, leading to incorrect colors.

Rule of Thumb: Use RRGGBBAA if you need compatibility with CSS/web, use AARRGGBB only if the string is exclusively for iOS/macOS internal use.

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