Kotlin Compose中对象属性作为mutableState时UI不更新的解决方法

方案1：让Dices内部属性使用Compose State #

把Dices类的first和second改成MutableState<Int>，这样属性变化时会自动通知Compose触发重组：

class Dices(first: Int = 0, second: Int = 0) {
    var first by mutableStateOf(first)
    var second by mutableStateOf(second)

    fun rollDices() {
        first = rollDice() // 返回1-6的数值
        second = rollDice()
    }

    fun resetDices() {
        first = 0
        second = 0
    }

    fun areEqual() = first == second
}

然后gameView里直接使用game.dices即可，不需要额外的remember包装：

@Composable
fun gameView(game: Game) {
    paintBoard(game.board)
    diceView(dices = game.dices, onClick = { game.newTurn() })
}

每次调用rollDices()或resetDices()修改属性时，Compose会感知到State变化，自动更新UI。

方案2：将Dices改为不可变数据类，通过引用变化触发重组 #

把Dices改成数据类，每次操作都创建新实例，同时让Game里的dices使用MutableState：

data class Dices(val first: Int = 0, val second: Int = 0) {
    fun rollDices(): Dices {
        return copy(
            first = rollDice(),
            second = rollDice()
        )
    }

    fun resetDices(): Dices {
        return copy(first = 0, second = 0)
    }

    fun areEqual() = first == second
}

class Game(val board: Board, var player1: Player, var player2: Player) {
    var dices by mutableStateOf(Dices())
}

调用的时候，newTurn()里需要更新dices为新实例：

// Game类的newTurn示例
fun newTurn() {
    dices = dices.rollDices()
}

gameView里直接使用game.dices：

@Composable
fun gameView(game: Game) {
    paintBoard(game.board)
    diceView(dices = game.dices, onClick = { game.newTurn() })
}

这种方式利用Compose对State引用变化的感知，每次创建新的Dices实例就会触发UI重组。

方案3：使用StateFlow实现跨层状态通知 #

如果Game类需要在非Compose环境（比如ViewModel、业务逻辑层）中管理状态，可以用StateFlow：

class Dices(var first: Int = 0, var second: Int = 0) {
    fun rollDices() {
        first = rollDice()
        second = rollDice()
    }

    fun resetDices() {
        first = 0
        second = 0
    }

    fun areEqual() = first == second
}

class Game(val board: Board, var player1: Player, var player2: Player) {
    private val _dicesFlow = MutableStateFlow(Dices())
    val dicesFlow = _dicesFlow.asStateFlow()

    fun newTurn() {
        _dicesFlow.value.rollDices()
        // 修改现有实例属性后，手动发送新值触发Flow更新
        _dicesFlow.value = _dicesFlow.value
        // 或者像方案2那样创建新实例：_dicesFlow.value = _dicesFlow.value.rollDices()
    }
}

然后在Composable中收集StateFlow：

@Composable
fun gameView(game: Game) {
    paintBoard(game.board)
    val dices by game.dicesFlow.collectAsState()
    diceView(dices = dices, onClick = { game.newTurn() })
}

这种方式适合复杂的状态管理场景，能在Compose和非Compose代码间统一状态流转。

原代码失效原因 #

你之前的代码中，val dices by remember { mutableStateOf(game.dices) }只是把初始的Dices实例包装成State，但Dices本身是普通类，属性变化时State的引用没有改变，Compose无法感知到内部属性的变化，所以不会触发UI更新。上面的三种方案都是通过让Compose能感知到状态变化（要么是内部属性的State变化，要么是实例引用变化，要么是Flow的状态更新）来解决这个问题。

内容的提问来源于stack exchange，提问作者L3g3nd no chouriço