Android Jetpack Compose修改UI State（二维列表）不触发重组问题

核心原因 #

问题出在嵌套可变集合的浅拷贝上：你的代码中board.toList()仅将外层MutableList转为List，但内层的每个MutableList还是原引用。StateFlow和Compose的重组依赖对象相等性判断，当更新BoardUiState时，新的board与旧board的内层列表引用完全一致，浅比较会认为状态未变化，因此不会触发重组。

解决方案 #

方案1：深拷贝嵌套集合（最小改动）

保留现有可变board的逻辑，但更新状态时对嵌套集合做深拷贝，确保整个board结构都是全新的引用：

class BoardViewModel : ViewModel() {
    private var board = mutableListOf<MutableList<Piece?>>()
    private val _uiState = MutableStateFlow(BoardUiState(board.map { it.toList() }))
    val uiState: StateFlow<BoardUiState> = _uiState.asStateFlow()
    private var selectedPos: Pair<Int, Int>? = null

    init{
        reset()
    }

    private fun reset(){
        board = mutableListOf()
        // 初始化board的逻辑（比如创建行列）
        // 重置状态时也做深拷贝
        _uiState.value = BoardUiState(board.map { it.toList() })
    }

    fun onCellClicked(r: Int, c: Int){
        if(selectedPos != null) {
            move(selectedPos!!.first, selectedPos!!.second, r, c)
            selectedPos = null
        }
        else if(board[r][c] != null){
            selectedPos = r to c
        }
    }

    private fun move(sr: Int, sc: Int, dr: Int, dc: Int){
        val temp = board[sr][sc]
        board[sr][sc] = null
        board[dr][dc] = temp
        // 关键：对每个内层列表也执行toList()，生成全新的嵌套不可变集合
        val newBoard = board.map { row -> row.toList() }
        _uiState.update { currentState ->
            currentState.copy(board = newBoard)
        }
    }
}

// 确保BoardUiState的board是不可变类型
data class BoardUiState(val board: List<List<Piece?>>)

方案2：使用全不可变集合（推荐）

彻底抛弃可变集合，每次状态变更都生成全新的不可变集合，更符合Compose状态管理的不可变原则：

class BoardViewModel : ViewModel() {
    private var board: List<List<Piece?>> = emptyList()
    private val _uiState = MutableStateFlow(BoardUiState(board))
    val uiState: StateFlow<BoardUiState> = _uiState.asStateFlow()
    private var selectedPos: Pair<Int, Int>? = null

    init{
        reset()
    }

    private fun reset(){
        // 生成全新的不可变嵌套列表（示例：假设是8x8棋盘）
        board = List(8) { List(8) { null } }
        _uiState.value = BoardUiState(board)
    }

    fun onCellClicked(r: Int, c: Int){
        if(selectedPos != null) {
            move(selectedPos!!.first, selectedPos!!.second, r, c)
            selectedPos = null
        }
        else if(board[r][c] != null){
            selectedPos = r to c
        }
    }

    private fun move(sr: Int, sc: Int, dr: Int, dc: Int){
        // 生成新的不可变board，不修改原集合
        board = board.mapIndexed { rowIndex, row ->
            when(rowIndex) {
                sr -> row.mapIndexed { colIndex, piece ->
                    if(colIndex == sc) null else piece
                }
                dr -> row.mapIndexed { colIndex, piece ->
                    if(colIndex == dc) board[sr][sc] else piece
                }
                else -> row
            }
        }
        _uiState.update { it.copy(board = board) }
    }
}

data class BoardUiState(val board: List<List<Piece?>>)

原理补充 #

Compose的重组触发条件是State值发生可检测的变化，StateFlow默认使用equals()判断新旧值是否相等。对于嵌套集合，浅比较只会检查外层集合的引用和元素引用，只有当整个嵌套结构的引用都发生变化时，才会被判定为状态更新。

内容的提问来源于stack exchange，提问作者Vigneswar