頑張れば使いこなせる SwiftUI grayscale の裏技

普通

SwiftUIの grayscale はこういうもんです。

HStack {
    Color.red
    Color.red.grayscale(0.25)
    Color.red.grayscale(0.5)
    Color.red.grayscale(0.75)
    Color.red.grayscale(1.0)
}

何かに使えそうですね。

1超え

与える値が1.0を超えると反対の色になっていきます。引き続き .red に対して指令しています。

HStack {
    Color.red.grayscale(1.0)
    Color.red.grayscale(1.25)
    Color.red.grayscale(1.5)
    Color.red.grayscale(1.75)
    Color.red.grayscale(2.0)
}

何かに使え...そう？

さらに超え

さらに値を大きくします。

HStack {
    Color.red.grayscale(3.0)
    Color.red.grayscale(4.0)
    Color.red.grayscale(5.0)
    Color.red.grayscale(6.0)
    Color.red.grayscale(7.0)
}

.red の場合は7ぐらいが限界ですな。

反対

マイナスを与えるともとの色が強くなります。.red はもともとはっきりしているので代わりに .brown でやってみます。

HStack {
    Color.brown.grayscale(0.0)
    Color.brown.grayscale(-0.5)
    Color.brown.grayscale(-1.0)
    Color.brown.grayscale(-2.0)
    Color.brown.grayscale(-3.0)
}

何かに使え...そう？？？

ほぼ灰色を変身させる

次の3つの色（ほぼ灰色）にgrayscaleを与えて変身させます。

ほぼ灰色

Color(red: 0.49, green: 0.49, blue: 0.51)
Color(red: 0.49, green: 0.51, blue: 0.49)
Color(red: 0.51, green: 0.49, blue: 0.49)

変身

HStack(spacing: 0) {
    ForEach(-10..<11) { index in
        Color(red: 0.49, green: 0.49, blue: 0.51)
            .grayscale(Double(index * 5))
    }
}
HStack(spacing: 0) {
    ForEach(-10..<11) { index in
        Color(red: 0.49, green: 0.51, blue: 0.49)
            .grayscale(Double(index * 5))
    }
}
HStack(spacing: 0) {
    ForEach(-10..<11) { index in
        Color(red: 0.51, green: 0.49, blue: 0.49)
            .grayscale(Double(index * 5))
    }
}
HStack(spacing: 0) {
    Text("-50.0")
    Spacer()
    Text("0.0")
    Spacer()
    Text("+50.0")
}

計算イメージ

画像はイメージです。
実際にどうなっているかは知りません。

c: 各色
g: モディファイアの引数
max(min((c - 0.5) * (1.0 - g) + 0.5, 1.0), 0.0)