Use image placeholder colors from material theme (#18)

Better looking and dark mode adaptive.
julioromano · Mar 15, 2023 · 0cc6eae · 0cc6eae
1 parent 2e71507
commit 0cc6eae
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/movie/src/main/kotlin/net/marcoromano/mooviez/movie/widgets/Movie.kt b/movie/src/main/kotlin/net/marcoromano/mooviez/movie/widgets/Movie.kt
@@ -1,6 +1,5 @@
 package net.marcoromano.mooviez.movie.widgets
 
-import android.graphics.Color
 import android.graphics.drawable.ColorDrawable
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Arrangement
@@ -22,6 +21,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
@@ -70,7 +70,7 @@ internal fun Movie(
           model = ImageRequest.Builder(LocalContext.current)
             .data("https://image.tmdb.org/t/p/w1280/${movie.backdropPath}")
             .size(width = 1280, height = 720)
-            .placeholder(ColorDrawable(Color.YELLOW)) // TODO: Make it better looking.
+            .placeholder(ColorDrawable(MaterialTheme.colorScheme.surfaceVariant.toArgb()))
             .error(android.R.drawable.ic_dialog_alert) // TODO: Can be better looking.
             .crossfade(true)
             .build(),
@@ -88,7 +88,7 @@ internal fun Movie(
           model = ImageRequest.Builder(LocalContext.current)
             .data("https://image.tmdb.org/t/p/w780/${movie.posterPath}")
             .size(width = 780, height = 1170)
-            .placeholder(ColorDrawable(Color.BLUE)) // TODO: Make it better looking.
+            .placeholder(ColorDrawable(MaterialTheme.colorScheme.onSurfaceVariant.toArgb()))
             .error(android.R.drawable.ic_dialog_alert) // TODO: Can be better looking.
             .crossfade(true)
             .build(),

diff --git a/...main/kotlin/net/marcoromano/mooviez/trending/widgets/trending/TrendingLazyVerticalGrid.kt b/...main/kotlin/net/marcoromano/mooviez/trending/widgets/trending/TrendingLazyVerticalGrid.kt
@@ -1,6 +1,5 @@
 package net.marcoromano.mooviez.trending.widgets.trending
 
-import android.graphics.Color
 import android.graphics.drawable.ColorDrawable
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
@@ -18,12 +17,14 @@ import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Error
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.text.font.FontWeight
@@ -101,7 +102,7 @@ private fun Movie(
             model = ImageRequest.Builder(LocalContext.current)
               .data("https://image.tmdb.org/t/p/w500/${movie.poster_path}")
               .size(width = 500, height = 750)
-              .placeholder(ColorDrawable(Color.BLUE)) // TODO: Make it better looking.
+              .placeholder(ColorDrawable(MaterialTheme.colorScheme.onSurfaceVariant.toArgb()))
               .error(android.R.drawable.ic_dialog_alert) // TODO: Can be better looking.
               .crossfade(true)
               .build(),