Get lighter and darker color variations for a given UIColor

前端 未结 11 2157
一生所求
一生所求 2021-01-30 02:32

How to get different lighter and darker variations of a given UIColor in Swift?

相关标签:
11条回答
  • 2021-01-30 02:48

    The code example below demonstrate how you can get a lighter and darker shade of a given color, useful in applications having dynamic themes

    For Darker Color

    + (UIColor *)darkerColorForColor:(UIColor *)c
    {
    CGFloat r, g, b, a;
        if ([c getRed:&r green:&g blue:&b alpha:&a])
    return [UIColor colorWithRed:MAX(r - 0.2, 0.0)
                                   green:MAX(g - 0.2, 0.0)
                                    blue:MAX(b - 0.2, 0.0)
    return nil; 
    }
    
    

    For Lighter Color

    + (UIColor *)lighterColorForColor:(UIColor *)c
    {
    CGFloat r, g, b, a;
        if ([c getRed:&r green:&g blue:&b alpha:&a])
    return [UIColor colorWithRed:MIN(r + 0.2, 1.0)
                           green:MIN(g + 0.2, 1.0)
                            blue:MIN(b + 0.2, 1.0)
    alpha:a];
    return nil;
    }
    
    
    0 讨论(0)
  • 2021-01-30 02:52

    I want to provide another version using brightness & saturation instead of RGB

    extension UIColor {
      /**
       Create a ligher color
       */
      func lighter(by percentage: CGFloat = 30.0) -> UIColor {
        return self.adjustBrightness(by: abs(percentage))
      }
    
      /**
       Create a darker color
       */
      func darker(by percentage: CGFloat = 30.0) -> UIColor {
        return self.adjustBrightness(by: -abs(percentage))
      }
    
      /**
       Try to increase brightness or decrease saturation
       */
      func adjustBrightness(by percentage: CGFloat = 30.0) -> UIColor {
        var h: CGFloat = 0, s: CGFloat = 0, b: CGFloat = 0, a: CGFloat = 0
        if self.getHue(&h, saturation: &s, brightness: &b, alpha: &a) {
          if b < 1.0 {
            let newB: CGFloat = max(min(b + (percentage/100.0)*b, 1.0), 0.0)
            return UIColor(hue: h, saturation: s, brightness: newB, alpha: a)
          } else {
            let newS: CGFloat = min(max(s - (percentage/100.0)*s, 0.0), 1.0)
            return UIColor(hue: h, saturation: newS, brightness: b, alpha: a)
          }
        }
        return self
      }
    }
    
    0 讨论(0)
  • 2021-01-30 02:52

    For Swift 5.0 :

    extension UIColor {
    
    func lighter(by percentage: CGFloat = 10.0) -> UIColor {
        return self.adjust(by: abs(percentage))
    }
    
    func darker(by percentage: CGFloat = 10.0) -> UIColor {
        return self.adjust(by: -abs(percentage))
    }
    
    func adjust(by percentage: CGFloat) -> UIColor {
        var alpha, hue, saturation, brightness, red, green, blue, white : CGFloat
        (alpha, hue, saturation, brightness, red, green, blue, white) = (0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0)
    
        let multiplier = percentage / 100.0
    
        if self.getHue(&hue, saturation: &saturation, brightness: &brightness, alpha: &alpha) {
            let newBrightness: CGFloat = max(min(brightness + multiplier*brightness, 1.0), 0.0)
            return UIColor(hue: hue, saturation: saturation, brightness: newBrightness, alpha: alpha)
        }
        else if self.getRed(&red, green: &green, blue: &blue, alpha: &alpha) {
            let newRed: CGFloat = min(max(red + multiplier*red, 0.0), 1.0)
            let newGreen: CGFloat = min(max(green + multiplier*green, 0.0), 1.0)
            let newBlue: CGFloat = min(max(blue + multiplier*blue, 0.0), 1.0)
            return UIColor(red: newRed, green: newGreen, blue: newBlue, alpha: alpha)
        }
        else if self.getWhite(&white, alpha: &alpha) {
            let newWhite: CGFloat = (white + multiplier*white)
            return UIColor(white: newWhite, alpha: alpha)
        }
    
        return self
        }
    }
    
    0 讨论(0)
  • 2021-01-30 02:57

    Updated

    Use below UIColor Extension:

    extension UIColor {
    
        func lighter(by percentage: CGFloat = 30.0) -> UIColor? {
            return self.adjust(by: abs(percentage) )
        }
    
        func darker(by percentage: CGFloat = 30.0) -> UIColor? {
            return self.adjust(by: -1 * abs(percentage) )
        }
    
        func adjust(by percentage: CGFloat = 30.0) -> UIColor? {
            var red: CGFloat = 0, green: CGFloat = 0, blue: CGFloat = 0, alpha: CGFloat = 0
            if self.getRed(&red, green: &green, blue: &blue, alpha: &alpha) {
                return UIColor(red: min(red + percentage/100, 1.0),
                               green: min(green + percentage/100, 1.0),
                               blue: min(blue + percentage/100, 1.0),
                               alpha: alpha)
            } else {
                return nil
            }
        }
    }
    

    Usage:

    let color = UIColor(red:0.96, green:0.54, blue:0.10, alpha:1.0)
    color.lighter(30) // returns lighter color by 30%
    color.darker(30) // returns darker color by 30%
    

    instead of .lighter() and .darker(), you can use .adjust() with positive values for lightening and negative values for darkening

    color.adjust(-30) // 30% darker color
    color.adjust(30) // 30% lighter color
    

    Output:

    0 讨论(0)
  • 2021-01-30 02:59

    Version with RGB values modification

    Here I put simple UIColor extension which is based on previous answers. It's working perfectly for me.

    Below demo:

    Colors manipulation code

    public extension UIColor {
    
        /**
         Create a lighter color
         */
        public func lighter(by percentage: CGFloat = 30.0) -> UIColor {
            return self.adjustBrightness(by: abs(percentage))
        }
    
        /**
         Create a darker color
         */
        public func darker(by percentage: CGFloat = 30.0) -> UIColor {
            return self.adjustBrightness(by: -abs(percentage))
        }
    
        /**
         Changing R, G, B values
         */
    
        func adjustBrightness(by percentage: CGFloat = 30.0) -> UIColor {
    
            var red: CGFloat = 0.0
            var green: CGFloat = 0.0
            var blue: CGFloat = 0.0
            var alpha: CGFloat = 0.0
    
            if self.getRed(&red, green: &green, blue: &blue, alpha: &alpha) {
    
                let pFactor = (100.0 + percentage) / 100.0
    
                let newRed = (red*pFactor).clamped(to: 0.0 ... 1.0)
                let newGreen = (green*pFactor).clamped(to: 0.0 ... 1.0)
                let newBlue = (blue*pFactor).clamped(to: 0.0 ... 1.0)
    
                return UIColor(red: newRed, green: newGreen, blue: newBlue, alpha: alpha)
            }
    
            return self
        }
    }
    

    Clamped function Extension to easily keep values between min and max.

    extension Comparable {
    
        func clamped(to range: ClosedRange<Self>) -> Self {
    
            if self > range.upperBound {
                return range.upperBound
            } else if self < range.lowerBound {
                return range.lowerBound
            } else {
                return self
            }
        }
    }
    
    0 讨论(0)
提交回复
热议问题