如何在Android Jetpack Compose中向任何方向创建拖动手势

Question

我想检测 @Composable 中的手势，这将允许我沿任何方向在屏幕上拖动一个元素。

我尝试使用 LongPressDragObserver ，但是拖动了一段时间后，它会捕捉到一个 Orientation （ Horizo​​ntalally 或 Vertically < / em>）和 Offset 对于其他 Orientation 都不会改变（它始终等于0）

我要实现的示例功能：
长按FAB并将其拖动到屏幕周围，以便其位置始终位于用户的手指下。

我正在使用Compose 1.0.0-alpha04

仅向一个方向拖动（感谢Rafsanjani）的示例代码

.dragGestureFilter(dragObserver = object : DragObserver { 
  override fun onDrag(dragDistance: Offset): Offset { 
    val newX = dragDistance.x + verticalOffset.value 
    val newY = dragDistance.y + horizontalOffset.value 
    verticalOffset.value = newX 
    horizontalOffset.value = newY 
    return dragDistance 
  } 
})

Answer 1

您可以将 Modifier.pointerInput 与 detectDragGestures 结合使用，以达到您想要的效果。

示例：

   @Composable
fun Drag2DGestures() {
    var size by remember { mutableStateOf(400.dp) }
    val offsetX = remember { mutableStateOf(0f) }
    val offsetY = remember { mutableStateOf(0f) }
    Box(modifier = Modifier.size(size)){
        Box(
                Modifier
                        .offset { IntOffset(offsetX.value.roundToInt(), offsetY.value.roundToInt()) }
                        .background(Color.Blue)
                        .size(50.dp)
                        .pointerInput(Unit) {
                            detectDragGestures { change, dragAmount ->
                                change.consumeAllChanges()
                                offsetX.value = (offsetX.value + dragAmount.x)
                                        .coerceIn(0f, size.width.toFloat() - 50.dp.toPx())

                                offsetY.value = (offsetY.value + dragAmount.y)
                                        .coerceIn(0f, size.height.toFloat() - 50.dp.toPx())
                            }
                        }
        )
        Text("Drag the box around", Modifier.align(Alignment.Center))
    }
}

会产生这样的结果：

ٍٍٍ抱歉，卡顿/掉帧，内置模拟器录像机无法流畅录制60fps

撰写版本：alpha-11