如何使用可组合元素在应用程序中动态切换明暗主题

Question

您如何通过在应用内按一个按钮来动态切换主题的调色板

到目前为止，这是我正在做的，但是仅当我将Android主题切换为暗或亮模式时，该选项才有效

AppTheme.Kt

@Model
object ThemeState {
    var isLight: Boolean = true
}


@Composable
fun MyAppTheme(
    children: @Composable() () -> Unit
) {
    MaterialTheme(colors = if (ThemeState.isLight) themeColorsLight else themColorDark) {
            children()
    }
}

MainActivity.kt

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MyAppTheme(children = {
                Surface {
                    Greetings(name = "Android")
                }

            })

        }
    }
}

@Composable
fun Greetings(name: String) {

    Column(modifier = Modifier.fillMaxHeight()) {
        Column(modifier = Modifier.weight(1f)) {
            Text(
                text = "Hello $name", modifier = Modifier.padding(24.dp),
                style = MaterialTheme.typography.h1
            )
        }

        Button(onClick = { ThemeState.isLight = !ThemeState.isLight }) {
            Text(text = "Change Theme IsLight:${ThemeState.isLight}")
        }
    }
}

Answer 1

目前我还不知道为什么您的代码不起作用，我将在找到答案后更新此答案。

但不是将if用作else参数，而是将其用于整个MaterialTheme，如下所示：

colors

更新：似乎是Jetpack Compose dev11中的错误，我在dev12中尝试过，并且在那里工作。