当 CircularProgressIndicator 处于活动状态时如何禁用交互？

Question

当进度条处于活动状态时禁用后台交互的正确方法/方法是什么。

  Box(
    modifier = Modifier.fillMaxSize(),
    contentAlignment = Alignment.Center
  ) {
    // Some content (when anyState is true, disable screen interaction)
    if(anyState){
       MaterialCircularProgressIndicator()
    }
  }

Answer 1

您需要另一个框，您可以用半透明背景填充它（我更喜欢这样做，以便用户理解为什么他的触摸不起作用），并且您可以使用 中断触摸pointerInput。这与 Compose用于阻止Surface.

if(anyState){
    Box(
        Modifier
            .fillMaxSize()
            .background(Color.Black.copy(alpha = 0.3f))
            .pointerInput(Unit) {}
    )
    CircularProgressIndicator()
}

Answer 2

这对我来说很有效。

    if (anyState) {
        Box(modifier = Modifier
            .fillMaxSize()
            .clickable(
                indication = null, // disable ripple effect
                interactionSource = remember { MutableInteractionSource() },
                onClick = { }
            ),
            contentAlignment = Alignment.Center
        ) {
            CircularProgressIndicator()
        }
    }