Android Jetpack Compose：如何保持加载视图直至新页面打开？

问题根源 #

当前代码中，操作完成后进入LOADED状态，该状态会触发界面显示按钮（when分支仅对LOADING显示加载视图），同时立刻重置状态为IDLE，导致新页面启动延迟期间按钮重新出现。

实现方案 #

通过新增状态区分导航时机，确保加载视图保持到新页面打开，并在返回时重置状态：

修改后的MainViewModel

class MainViewModel : ViewModel() {
    val stateStream = MutableStateFlow(State.IDLE)

    fun doAction() {
        viewModelScope.launch {
            stateStream.value = State.LOADING
            delay(1000) // 模拟耗时操作
            stateStream.value = State.NAVIGATE_TO_SECOND
        }
    }

    fun resetState() {
        stateStream.value = State.IDLE
    }

    enum class State {
        IDLE, LOADING, NAVIGATE_TO_SECOND
    }
}

修改后的MainActivity

class MainActivity : ComponentActivity() {
    private val viewModel by viewModels<MainViewModel>()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            val state by viewModel.stateStream.collectAsState()

            // 触发新页面跳转
            if (state == MainViewModel.State.NAVIGATE_TO_SECOND) {
                SideEffect {
                    startActivity(Intent(this, SecondActivity::class.java))
                }
            }

            Scaffold {
                Box(
                    modifier = Modifier.fillMaxSize(),
                    contentAlignment = Alignment.Center
                ) {
                    // LOADING和导航状态都显示加载视图
                    when (state) {
                        MainViewModel.State.LOADING,
                        MainViewModel.State.NAVIGATE_TO_SECOND -> CircularProgressIndicator()
                        else -> Button(onClick = viewModel::doAction) { Text("Do action") }
                    }
                }
            }
        }
    }

    override fun onResume() {
        super.onResume()
        // 从新页面返回时重置状态为初始状态
        viewModel.resetState()
    }
}

核心逻辑说明 #

1. 新增导航状态：添加NAVIGATE_TO_SECOND状态，标记需要启动新页面的时机，同时该状态下仍显示加载视图，避免按钮提前出现
2. 延迟状态重置：不在跳转时立刻重置状态，而是在onResume方法中重置——只有从新页面返回时，MainActivity才会触发onResume，此时回到初始的按钮显示状态
3. 避免重复跳转：仅在NAVIGATE_TO_SECOND状态时触发跳转逻辑，不会因界面重组重复启动新页面

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