27. Compose快速点击防抖

很多场景都会处理快速点击事件的多次响应问题

@Composable
fun DebouncedClickable(navCtrl: NavHostController, title: String) {

    val clicked = remember {
        mutableStateOf(false)
    }

    CommonToolbar(navCtrl, title) {
        Box(
            modifier = Modifier
                .fillMaxSize()
                .background(color = if (clicked.value) Color.Blue else Color.Red),
        ) {
            Box(modifier = Modifier.fillMaxSize().debouncedClickable(
                enabled = true,
                onClick = {
                    clicked.value = !clicked.value
                },
//               delay = 10L,
               delay = 1000L,
            )) {
                Text(
                    text = if (clicked.value) "蓝色" else "红色",
                    color = Color.White,
                    fontSize = 30.sp,
                    fontWeight = FontWeight.SemiBold
                )
            }
        }
    }
}

//Modifier 的扩展方法处理如下
fun Modifier.debouncedClickable(enabled: Boolean, onClick: () -> Unit, delay: Long = 300) =
    composed {
        var clicked by remember {
            mutableStateOf(!enabled)
        }
        LaunchedEffect(key1 = clicked, block = {
            if (clicked) {
                delay(delay)
                clicked = !clicked
            }
        })

        Modifier.clickable(if (enabled) !clicked else false) {
            clicked = !clicked
            onClick()
        }
    }