Dark Theme

Author: fourcels

app/build.gradle

@@ -49,6 +49,7 @@ android {
 
 dependencies {
     implementation("io.coil-kt:coil-compose:2.2.2")
+    implementation "com.google.accompanist:accompanist-systemuicontroller:$accompanist_version"
     implementation "com.google.accompanist:accompanist-flowlayout:$accompanist_version"
     implementation "com.google.accompanist:accompanist-pager:$accompanist_version"
     implementation "com.google.accompanist:accompanist-pager-indicators:$accompanist_version"

app/src/main/java/com/example/doubanmovie/ui/movie/MovieScreen.kt

@@ -46,8 +46,7 @@ import com.example.doubanmovie.data.MovieComment
 import com.example.doubanmovie.data.MovieItem
 import com.example.doubanmovie.ui.components.RatingBar
 import com.example.doubanmovie.ui.theme.DoubanMovieTheme
-import com.example.doubanmovie.ui.theme.Grey100
-import com.example.doubanmovie.ui.theme.Grey200
+import com.example.doubanmovie.ui.theme.LightGrey
 import com.google.accompanist.flowlayout.FlowRow
 import com.google.accompanist.pager.ExperimentalPagerApi
 import com.google.accompanist.pager.HorizontalPager
@@ -394,10 +393,9 @@ fun MovieRank() {
         }
         item {
             Surface(
-                color = Color.LightGray.copy(alpha = 0.2f),
-                contentColor = Color.Gray,
                 modifier = Modifier.fillMaxHeight(),
-                shape = RoundedCornerShape(10.dp),
+                color = LightGrey,
+                shape = MaterialTheme.shapes.medium,
             ) {
                 Column(
                     modifier = Modifier.padding(16.dp),
@@ -479,7 +477,8 @@ fun SearchMovieBody(onFilterItemClick: () -> Unit = {}) {
                 }
                 items(tagList) { item ->
                     Surface(
-                        color = Grey100,
+                        modifier = Modifier.fillMaxHeight(),
+                        color = Color.LightGray.copy(0.2f),
                         shape = MaterialTheme.shapes.small,
                     ) {
                         Text(
@@ -573,10 +572,10 @@ fun FilterItem(
                             contentPadding = PaddingValues(12.dp)
                         ) {
                             items(data.items) { item ->
-                                Card(
+                                Surface(
                                     modifier = Modifier.padding(4.dp),
-                                    backgroundColor = Color.LightGray.copy(alpha = 0.2f),
-                                    elevation = 0.dp,
+                                    color = LightGrey,
+                                    shape = MaterialTheme.shapes.small
                                 ) {
                                     Text(
                                         item,
@@ -739,7 +738,7 @@ fun MovieFavorite(favorite: Boolean = false) {
 fun MovieTags(tags: List<String>) {
     FlowRow(mainAxisSpacing = 8.dp, crossAxisSpacing = 8.dp) {
         tags.forEach { item ->
-            Surface(color = Grey200, shape = RoundedCornerShape(4.dp)) {
+            Surface(color = LightGrey, shape = MaterialTheme.shapes.small) {
                 Row(
                     modifier = Modifier.padding(4.dp),
                     verticalAlignment = Alignment.CenterVertically
@@ -1018,11 +1017,6 @@ private val movieList = listOf(
         "https://img2.doubanio.com/view/photo/m_ratio_poster/public/p2879301401.webp",
         rating = 7.6f
     ),
-    MovieItem(
-        "妈妈！",
-        "https://img2.doubanio.com/view/photo/m_ratio_poster/public/p2879572001.webp",
-        rating = 7.4f
-    ),
     MovieItem(
         "平凡英雄",
         "https://img3.doubanio.com/view/photo/m_ratio_poster/public/p2880994870.webp",

app/src/main/java/com/example/doubanmovie/ui/theme/Color.kt

@@ -2,14 +2,8 @@ package com.example.doubanmovie.ui.theme
 
 import androidx.compose.ui.graphics.Color
 
-val Purple200 = Color(0xFFBB86FC)
-val Purple500 = Color(0xFF6200EE)
 val Purple700 = Color(0xFF3700B3)
-val Teal200 = Color(0xFF03DAC5)
 
 val Green200 = Color(0xFF01B62C)
 val Orange200 = Color(0xFFFF8C0E)
-
-val Grey50 = Color(0xFFFAFAFA)
-val Grey100 = Color(0xFFF5F5F5)
-val Grey200 = Color(0xFFEEEEEE)
+val LightGrey = Color.LightGray.copy(0.2f)

app/src/main/java/com/example/doubanmovie/ui/theme/Theme.kt

@@ -5,11 +5,12 @@ import androidx.compose.material.MaterialTheme
 import androidx.compose.material.darkColors
 import androidx.compose.material.lightColors
 import androidx.compose.runtime.Composable
+import com.google.accompanist.systemuicontroller.rememberSystemUiController
 
 private val DarkColorPalette = darkColors(
-    primary = Purple200,
+    primary = Green200,
     primaryVariant = Purple700,
-    secondary = Teal200
+    secondary = Orange200
 )
 
 private val LightColorPalette = lightColors(
@@ -34,6 +35,11 @@ fun DoubanMovieTheme(darkTheme: Boolean = isSystemInDarkTheme(), content: @Compo
     } else {
         LightColorPalette
     }
+    val systemUiController = rememberSystemUiController()
+    systemUiController.setSystemBarsColor(
+        color = colors.background
+    )
+
 
     MaterialTheme(
         colors = colors,