xyk blog

最近は iOS 開発の記事が多めです。

UIColor の2色間の中間色を表示する

検証環境:
Xcode 11.3
Swift 5.1.3

2色間の中間色を補完する leap メソッドを UIColor の Extension として追加。
progress で割合を調整します。

import UIKit

extension UIColor {
    
    func lerp(to: UIColor, progress: CGFloat) -> UIColor {
        return .lerp(from: self, to: to, progress: progress)
    }
    
    static func lerp(from: UIColor, to: UIColor, progress: CGFloat) -> UIColor {
        
        let t = max(0, min(1, progress))
        
        var redA: CGFloat = 0
        var greenA: CGFloat = 0
        var blueA: CGFloat = 0
        var alphaA: CGFloat = 0
        from.getRed(&redA, green: &greenA, blue: &blueA, alpha: &alphaA)
        
        var redB: CGFloat = 0
        var greenB: CGFloat = 0
        var blueB: CGFloat = 0
        var alphaB: CGFloat = 0
        to.getRed(&redB, green: &greenB, blue: &blueB, alpha: &alphaB)
        
        let lerp = { (a: CGFloat, b: CGFloat, t: CGFloat) -> CGFloat in
            return a + (b - a) * t
        }
        
        let r = lerp(redA, redB, t)
        let g = lerp(greenA, greenB, t)
        let b = lerp(blueA, blueB, t)
        let a = lerp(alphaA, alphaB, t)
        
        return UIColor(red: r, green: g, blue: b, alpha: a)
    }
}

使い方

// 青色と黄色の中間色を取得する例
let blueYellow = UIColor.blue.leap(to: .yellow, progress: 0.5)
// または
let blueYellow = UIColor.leap(from: .blue, to: .yellow, progress: 0.5)

追記:
以前にも全く同じ内容の記事を書いていた。。。

ある UIColor から別の UIColor に徐々に色を変化させる - xykのブログ

UIColorの色を暗くする - xykのブログ