web-dev-qa-db-ja.com

2色間のグラデーションの特定のポイントで色を計算しますか?

したがって、これは基本的に私が書きたいメソッドです(Objective-C/CocoaではUIColorsを使用しますが、根底にある数学に本当に興味があります)。

+ (UIColor *)colorBetweenColor:(UIColor *)startColor andColor:(UIColor *)endColor atLocation:(CGFloat)location;

たとえば、純粋な赤と純粋な青の2色があるとします。 2つの間に線形グラデーションがある場合、そのグラデーションの33%マークにある色を計算します。 Example
だから私が私のように私のメソッドを呼び出すとしたら:

UIColor *resultingColor = [UIColor colorBetweenColor:[UIColor redColor] andColor:[UIColor blueColor] atLocation:0.33f];

「B」で結果の色を取得し、同様に0.0f場所が色「A」を返すため、1.0fは色「C」を返します。

したがって、基本的に私の質問は、2つの色のRGB値を混合し、それらの間の特定の「場所」で色を決定するにはどうすればよいですか?

37
blabus

次のように、赤、緑、青のチャネルを線形補間するだけです。

double resultRed = color1.red + percent * (color2.red - color1.red);
double resultGreen = color1.green + percent * (color2.green - color1.green);
double resultBlue = color1.blue + percent * (color2.blue - color1.blue);

ここで、percentは0〜1の値です(最初のメソッドプロトタイプではlocation)。

57
user1118321

RGB色空間は円のようなものです。外側の境界に沿って彩度が最も高く、中央が灰色です。ある色から別の色に移動するときは、中央から同じ半径(円)に沿って色を移動することが望ましいでしょう。飽和と値が同じままになるように。その場合、色相は直線的に変化します。最初は左右の色よりも灰色の領域に交差することはありません。内側のリングから外側のリングに移動できます。彩度を上げる(または下げる)だけです。再び直線的に。カラーサークルについては こちら を参照してください(Paint.netなどで試してください)。

Apple(iOS)の目的クラスを使用すると、RGB以外のスペクトルを操作できます。

1
LenArt

a Swiftバージョンは誰かに役立つかもしれません。

private struct Color {
    let r: Int
    let g: Int
    let b: Int
    func getColor() -> UIColor {
        return UIColor(red: CGFloat(r)/255.0, green: CGFloat(g)/255.0, blue: CGFloat(b)/255.0, alpha: 1)
    }

    static func getGradientColor(from: Color, to: Color, percentage: CGFloat) -> Color {
        precondition(percentage >= 0 && percentage <= 1)
        return Color(r: from.r + Int(CGFloat(to.r - from.r) * percentage),
                     g: from.g + Int(CGFloat(to.g - from.g) * percentage),
                     b: from.b + Int(CGFloat(to.b - from.b) * percentage))
    }
}
0
Mint