mirror of
https://github.com/simplex-chat/simplex-chat.git
synced 2026-06-04 12:31:46 +00:00
ui: OKLCH colors for gradients in onboarding cards (#6859)
* ui: OKLCH colors for gradients in onboarding cards * add wide gamut to manifest
This commit is contained in:
+55
-7
@@ -3,16 +3,64 @@ package chat.simplex.common.ui.theme
|
||||
import androidx.compose.material.LocalContentColor
|
||||
import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.runtime.collectAsState
|
||||
import androidx.compose.ui.graphics.*
|
||||
import chat.simplex.common.views.helpers.mixWith
|
||||
import androidx.compose.ui.graphics.colorspace.ColorSpaces
|
||||
import kotlin.math.cos
|
||||
import kotlin.math.max
|
||||
import kotlin.math.min
|
||||
import kotlin.math.pow
|
||||
import kotlin.math.sin
|
||||
|
||||
fun oklch(L: Float, C: Float, H: Float, alpha: Float = 1f): Color {
|
||||
val hRad = H * (Math.PI.toFloat() / 180f)
|
||||
val cosH = cos(hRad)
|
||||
val sinH = sin(hRad)
|
||||
|
||||
fun linearP3(c: Float): Triple<Float, Float, Float> {
|
||||
val a = c * cosH
|
||||
val b = c * sinH
|
||||
// oklab → LMS (Ottosson 2021)
|
||||
val l_ = L + 0.3963377774f * a + 0.2158037573f * b
|
||||
val m_ = L - 0.1055613458f * a - 0.0638541728f * b
|
||||
val s_ = L - 0.0894841775f * a - 1.2914855480f * b
|
||||
val l = l_ * l_ * l_
|
||||
val m = m_ * m_ * m_
|
||||
val s = s_ * s_ * s_
|
||||
// LMS → linear Display P3
|
||||
return Triple(
|
||||
3.1281105148f * l - 2.2570749853f * m + 0.1293047593f * s,
|
||||
-1.0911282009f * l + 2.4132668169f * m - 0.3221681599f * s,
|
||||
-0.0260136845f * l - 0.5080276339f * m + 1.5333166364f * s
|
||||
)
|
||||
}
|
||||
|
||||
fun inGamut(r: Float, g: Float, b: Float) = r in 0f..1f && g in 0f..1f && b in 0f..1f
|
||||
|
||||
// linear P3 → gamma-encoded P3 (same transfer function as sRGB)
|
||||
fun gammaEncode(x: Float): Float =
|
||||
if (x >= 0.0031308f) 1.055f * min(x, 1f).pow(1f / 2.4f) - 0.055f
|
||||
else 12.92f * max(x, 0f)
|
||||
|
||||
var (r, g, b) = linearP3(C)
|
||||
if (!inGamut(r, g, b)) {
|
||||
var lo = 0f; var hi = C
|
||||
while (hi - lo > 1e-5f) {
|
||||
val mid = (lo + hi) / 2
|
||||
val (mr, mg, mb) = linearP3(mid)
|
||||
if (inGamut(mr, mg, mb)) { lo = mid; r = mr; g = mg; b = mb }
|
||||
else hi = mid
|
||||
}
|
||||
}
|
||||
|
||||
return Color(
|
||||
red = gammaEncode(r),
|
||||
green = gammaEncode(g),
|
||||
blue = gammaEncode(b),
|
||||
alpha = alpha,
|
||||
colorSpace = ColorSpaces.DisplayP3
|
||||
)
|
||||
}
|
||||
|
||||
val Purple200 = Color(0xFFBB86FC)
|
||||
val Purple500 = Color(0xFF6200EE)
|
||||
val Purple700 = Color(0xFF3700B3)
|
||||
val Teal200 = Color(0xFF03DAC5)
|
||||
val Gray = Color(0x22222222)
|
||||
val Indigo = Color(0xFF9966FF)
|
||||
val SimplexBlue = Color(0, 136, 255, 255) // If this value changes also need to update #0088ff in string resource files
|
||||
val SimplexGreen = Color(77, 218, 103, 255)
|
||||
|
||||
+8
-8
@@ -89,17 +89,17 @@ internal fun gradientPoints(aspectRatio: Float, scale: Float): GradientEndpoints
|
||||
}
|
||||
|
||||
internal val lightStops = arrayOf(
|
||||
0.0f to Color(0xFFd2e8ff),
|
||||
0.5f to Color(0xFFcce9ff),
|
||||
0.9f to Color(0xFFdfffff),
|
||||
1.0f to Color(0xFFfffcea)
|
||||
0.0f to oklch(0.9219f, 0.0431f, 249.4f),
|
||||
0.5f to oklch(0.9198f, 0.0471f, 240.7f),
|
||||
0.9f to oklch(0.9772f, 0.0358f, 196.6f),
|
||||
1.0f to oklch(0.9886f, 0.0272f, 99.1f)
|
||||
)
|
||||
|
||||
internal val darkStops = arrayOf(
|
||||
0.4f to Color(0xFF040a24),
|
||||
0.72f to Color(0xFF3854ab),
|
||||
0.9f to Color(0xFFa8edf3),
|
||||
1.0f to Color(0xFFfff6e0)
|
||||
0.4f to oklch(0.1578f, 0.0609f, 267.3f),
|
||||
0.72f to oklch(0.4729f, 0.1574f, 267.3f),
|
||||
0.9f to oklch(0.9024f, 0.0760f, 202.8f),
|
||||
1.0f to oklch(0.9744f, 0.0370f, 88.4f)
|
||||
)
|
||||
|
||||
private fun Modifier.maxHeightByWidthRatio(ratio: Float) = layout { measurable, constraints ->
|
||||
|
||||
Reference in New Issue
Block a user