我正在做这个练习来构建一个骰子应用程序。
它有效,但我感到困惑的是: 根据我的理解,每次单击滚动按钮时,它都会触发重组。
当我点击滚动按钮时,它会随机选择 1 到 6 之间的一个数字。然后这个数字被记住,然后整个屏幕被重新组合?
那就是根据之前重构记住的结果来选择 imageResource 的时候?
然后通过图像渲染?
我的理解对吗?
@Composable
fun DiceWithButtonAndImage(modifier: Modifier = Modifier) {
var result by remember {mutableStateOf(1)}
val imageResource = when (result) {
1 -> R.drawable.dice_1
2 -> R.drawable.dice_2
3 -> R.drawable.dice_3
4 -> R.drawable.dice_4
5 -> R.drawable.dice_5
else -> R.drawable.dice_6
}
Column( modifier = modifier,
horizontalAlignment = Alignment.CenterHorizontally
) {
Image(
painter = painterResource(imageResource),
contentDescription = result.toString())
Spacer(modifier = Modifier.height(16.dp))
Button(onClick = { result = (1..6).random()}) {
Text(stringResource(R.string.roll))
}
}
}
您的整体理解是正确的。然而,稍微但更深入地理解这个概念可能会很有用:
Button
,新的随机值将分配给 result
变量。result
声明了
mutableStateOf()
变量。这允许 Jetpack Compose 检测您何时为变量分配新值并触发重组。result
变量的可组合函数将使用新的 result
值进行重组。result
变量的可组合函数将
remember()
result
声明了 remember()
变量。这确保了在重组过程中结果变量的值不会被重置。
@Composable
fun MyComposable() {
var result by remember { mutableStateOf(1) }
Column(
horizontalAlignment = Alignment.CenterHorizontally
) {
Button(
onClick = {
Log.d("MyComposable", "Dices are rolling...")
result = (1..6).random()
}
) {
Text("ROLL")
}
Spacer(modifier = Modifier.weight(1f))
// Composable depends on result variable
// will recompose when result variable is updated
Text(text = "result: $result")
// Composable does not depend on result variable, but has unstable parameter
// will recompose whenever parent Composable recomposes
Text(text = "randomResult: ${(7..12).random()}")
// Composable does not depend on the result variable and has stable parameter
// will not recompose when parent Composable recomposes
Text(text = "some constant text")
// normal Kotlin function
// will be re-executed whenever parent Composable recomposes
Log.d("MyComposable", "Dices are done")
}
}
每个
onClick
后的Logcat输出如下:
2024-04-29 10:38:29.122 10618-10618 MyComposable D Dices are rolling...
2024-04-29 10:38:29.137 10618-10618 MyComposable D Dices are done