避免意外点击/触摸Jetpack Compose Slider，该滑块位于可滚动列中

Question

我有一个Slider，它位于可滚动的Column中。当我滚动组件时，有时滑块值会因为意外触摸而意外更改。我该如何避免这种情况？

1. 我应该禁用滑块上的点击吗？如果是，我该怎么做？

2. 有没有像嵌套滚动而不是列这样的替代方法可以防止这种情况发生？

   @Composable
   fun ColumnScope.FilterRange(
   title: String,
   range: ClosedFloatingPointRange<Float>,
   rangeText: String,
   valueRange: ClosedFloatingPointRange<Float>,
   onValueChange: (ClosedFloatingPointRange<Float>) -> Unit,
   ) {
   Spacer(modifier = Modifier.height(Size_Regular))
   Text(
   text = title,
   style = MaterialTheme.typography.h6
   )
   Spacer(modifier = Modifier.height(Size_X_Small))
   Text(
   text = rangeText,
   style = MaterialTheme.typography.subtitle1
   )
   RangeSlider(
   modifier = Modifier.fillMaxWidth(),
   values = range,
   valueRange = valueRange,
   onValueChange = {
   onValueChange(it)
   })
   Spacer(modifier = Modifier.height(Size_Small))
   Divider(thickness = DividerSize)
   }
   

Answer 1

我会禁用RangeSlider，只有当你点击它时才会启用它。你可以通过点击列中的其他位置来禁用它。这是一种类似的行为，用来模仿失去注意力。这里有一个例子：

class MainActivity : ComponentActivity() {
@ExperimentalMaterialApi
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
startActivity(intent)
setContent {
var rangeEndabled by remember { mutableStateOf(false)}.apply { this.value }
var sliderPosition by remember { mutableStateOf(0f..100f) }
Text(text = sliderPosition.toString())
Column(modifier = Modifier
.fillMaxSize()
.verticalScroll(rememberScrollState())
.pointerInput(Unit) {
detectTapGestures(
onTap = {
rangeEndabled = false
}
)
}) {

repeat(30) {
Text(it.toString())
}
RangeSlider(
enabled = rangeEndabled,
values = sliderPosition,
onValueChange = { sliderPosition = it },
valueRange = 0f..100f,
onValueChangeFinished = {
// launch some business logic update with the state you hold
// viewModel.updateSelectedSliderValue(sliderPosition)
},
modifier = Modifier.pointerInput(Unit) {
detectTapGestures(
onTap = {
rangeEndabled = true
}
)
}
)
repeat(30) {
Text(it.toString())
}
}
}
}
}