fix: material3 container colors.

oxyroid · May 17, 2024 · dd77a10 · dd77a10
1 parent 1f94a64
commit dd77a10
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 16 deletions.
diff --git a/features/playlist/src/main/java/com/m3u/features/playlist/PlaylistScreen.kt b/features/playlist/src/main/java/com/m3u/features/playlist/PlaylistScreen.kt
@@ -52,7 +52,6 @@ import com.m3u.data.service.MediaCommand
 import com.m3u.features.playlist.internal.SmartphonePlaylistScreenImpl
 import com.m3u.features.playlist.internal.TvPlaylistScreenImpl
 import com.m3u.i18n.R.string
-import com.m3u.material.ktx.asColorScheme
 import com.m3u.material.ktx.checkPermissionOrRationale
 import com.m3u.material.ktx.createScheme
 import com.m3u.material.ktx.interceptVolumeEvent
@@ -320,7 +319,7 @@ private fun PlaylistScreen(
         val preferences = hiltPreferences()
         TvMaterialTheme(
             colorScheme = remember(preferences.argb) {
-                createScheme(preferences.argb, true).asColorScheme().asTvScheme()
+                createScheme(preferences.argb, true).asTvScheme()
             }
         ) {
             TvPlaylistScreenImpl(

diff --git a/features/setting/src/main/java/com/m3u/features/setting/components/CanvasBottomSheet.kt b/features/setting/src/main/java/com/m3u/features/setting/components/CanvasBottomSheet.kt
@@ -41,7 +41,6 @@ import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import com.m3u.i18n.R.string
-import com.m3u.material.ktx.asColorScheme
 import com.m3u.material.ktx.createScheme
 import com.m3u.material.model.LocalSpacing
 import com.m3u.material.model.SugarColors
@@ -63,7 +62,7 @@ internal fun CanvasBottomSheet(
 
         val scheme by remember {
             derivedStateOf {
-                createScheme(currentColorInt, currentIsDark).asColorScheme()
+                createScheme(currentColorInt, currentIsDark)
             }
         }
 

diff --git a/material/src/main/java/com/m3u/material/components/ThemeSelection.kt b/material/src/main/java/com/m3u/material/components/ThemeSelection.kt
@@ -45,7 +45,6 @@ import androidx.tv.material3.Border
 import androidx.tv.material3.Card
 import com.m3u.material.LocalM3UHapticFeedback
 import com.m3u.material.ktx.InteractionType
-import com.m3u.material.ktx.asColorScheme
 import com.m3u.material.ktx.createScheme
 import com.m3u.material.ktx.interactionBorder
 import com.m3u.material.ktx.isTelevision
@@ -68,7 +67,7 @@ fun ThemeSelection(
     val tv = isTelevision()
 
     val colorScheme = remember(argb, isDark) {
-        createScheme(argb, isDark).asColorScheme()
+        createScheme(argb, isDark)
     }
 
     val alpha by animateFloatAsState(

diff --git a/material/src/main/java/com/m3u/material/ktx/Colors.kt b/material/src/main/java/com/m3u/material/ktx/Colors.kt
@@ -1,22 +1,20 @@
 package com.m3u.material.ktx
 
 import android.annotation.SuppressLint
+import androidx.annotation.ColorInt
+import androidx.annotation.IntRange
 import androidx.compose.material3.ColorScheme
 import androidx.compose.ui.graphics.Color
+import com.google.android.material.color.utilities.Hct
 import com.google.android.material.color.utilities.Scheme
 
 @SuppressLint("RestrictedApi")
 fun createScheme(
     argb: Int,
     isDark: Boolean
-): Scheme {
-    return if (isDark) Scheme.dark(argb)
+): ColorScheme {
+    val scheme = if (isDark) Scheme.dark(argb)
     else Scheme.light(argb)
-}
-
-@SuppressLint("RestrictedApi")
-fun Scheme.asColorScheme(): ColorScheme {
-    val scheme = this
     return ColorScheme(
         primary = Color(scheme.primary),
         onPrimary = Color(scheme.onPrimary),
@@ -47,5 +45,46 @@ fun Scheme.asColorScheme(): ColorScheme {
         outline = Color(scheme.outline),
         outlineVariant = Color(scheme.outlineVariant),
         scrim = Color(scheme.scrim),
+        /**
+         * Color Role                   Tone: Light	    Tone: Dark
+         * Surface Dim                  N-87	        N-6
+         * Surface Bright               N-98	        N-24
+         * Surface Container  Lowest    N-100	        N-4
+         * Surface Container  Low       N-96	        N-10
+         * Surface Container            N-94	        N-12
+         * Surface Container  High      N-92	        N-17
+         * Surface Container  Highest	N-90	        N-22
+         */
+        surfaceBright = getColor(argb, if (!isDark) 98 else 24, 6),
+        surfaceDim = getColor(argb, if (!isDark) 87 else 6, 6),
+        surfaceContainer = getColor(argb, if (!isDark) 94 else 12, 6),
+        surfaceContainerHigh = getColor(argb, if (!isDark) 92 else 17, 6),
+        surfaceContainerHighest = getColor(argb, if (!isDark) 90 else 22, 6),
+        surfaceContainerLow = getColor(argb, if (!isDark) 96 else 10, 6),
+        surfaceContainerLowest = getColor(argb, if (!isDark) 100 else 4, 6)
     )
-}
+}
+
+
+@ColorInt
+@SuppressLint("RestrictedApi")
+private fun getColor(
+    @ColorInt color: Int,
+    @IntRange(from = 0L, to = 100L) tone: Int
+): Int {
+    val hctColor = Hct.fromInt(color)
+    hctColor.tone = tone.toDouble()
+    return hctColor.toInt()
+}
+
+@ColorInt
+@SuppressLint("RestrictedApi")
+private fun getColor(
+    @ColorInt color: Int,
+    @IntRange(from = 0L, to = 100L) tone: Int,
+    chroma: Int
+): Color {
+    val hctColor = Hct.fromInt(getColor(color, tone))
+    hctColor.chroma = chroma.toDouble()
+    return Color(hctColor.toInt())
+}
diff --git a/material/src/main/java/com/m3u/material/model/Theme.kt b/material/src/main/java/com/m3u/material/model/Theme.kt
@@ -12,7 +12,6 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.platform.LocalContext
 import com.m3u.material.ktx.TelevisionChain
-import com.m3u.material.ktx.asColorScheme
 import com.m3u.material.ktx.createScheme
 import androidx.tv.material3.ColorScheme as TvColorScheme
 import androidx.tv.material3.Typography as TvTypography
@@ -32,7 +31,7 @@ fun Theme(
         if (useDynamicColors && supportsDynamicTheming) {
             if (useDarkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
         } else {
-            createScheme(argb, useDarkTheme).asColorScheme()
+            createScheme(argb, useDarkTheme)
         }
     }