Compose中嵌套pointerInput修饰符行为不符合预期的问题

核心问题是场景缩放后，紫色Box的拖拽手势坐标未对应缩放比例转换，同时父容器的变换手势与子View拖拽手势存在事件优先级冲突，导致拖拽时而有效时而失效。

当场景放大（zoom > 1）时，触摸事件坐标会被graphicsLayer的缩放放大，传递给子View的dragAmount是缩放后的数值，直接用该值更新offsetX/Y会导致移动距离被放大，且系统触摸阈值也会受缩放影响，造成拖拽触发困难。

修改子View的拖拽逻辑，将dragAmount除以当前zoom值还原为原始坐标空间的移动量；同时调整Modifier顺序确保子View触摸事件优先处理：

@Composable
fun App() {
    val containerWidth = 302f
    val containerHeight = 358f
    val pieceWidth = 50f
    val pieceHeight = 123f
    var offset by remember { mutableStateOf(Offset.Zero) }
    var zoom by remember { mutableStateOf(1f) }
    
    // 预计算像素尺寸，避免重组时重复转换
    val containerWidthPx = remember(containerWidth) { containerWidth.dp.toPx() }
    val containerHeightPx = remember(containerHeight) { containerHeight.dp.toPx() }
    val pieceWidthPx = remember(pieceWidth) { pieceWidth.dp.toPx() }
    val pieceHeightPx = remember(pieceHeight) { pieceHeight.dp.toPx() }
    val maxOffsetX = remember { containerWidthPx - pieceWidthPx }
    val maxOffsetY = remember { containerHeightPx - pieceHeightPx }

    Box(
        modifier = Modifier
            .fillMaxSize()
            .pointerInput(Unit) {
                detectTransformGestures(
                    onGesture = { centroid, pan, gestureZoom, _ ->
                        val oldScale = zoom
                        val newScale = zoom * gestureZoom
                        offset = (offset + centroid / oldScale) - (centroid / newScale + pan / oldScale)
                        zoom = newScale
                    }
                )
            }
            .graphicsLayer {
                translationX = -offset.x * zoom
                translationY = -offset.y * zoom
                scaleX = zoom
                scaleY = zoom
                transformOrigin = TransformOrigin(0f, 0f)
            },
        contentAlignment = Alignment.Center
    ) {
        Box(modifier = Modifier.size(containerWidth.dp, containerHeight.dp).background(Color(0xFF979797))) {
            var offsetX by remember { mutableStateOf(0f) }
            var offsetY by remember { mutableStateOf(0f) }
            Box(
                Modifier
                    .offset { IntOffset(offsetX.roundToInt(), offsetY.roundToInt()) }
                    .size(pieceWidth.dp, pieceHeight.dp)
                    .background(Color(0xFFFF00FF))
                    .pointerInput(zoom) {
                        detectDragGestures(
                            // 动态调整拖拽触发阈值，适配缩放场景
                            dragThreshold = 1.dp.toPx() / zoom
                        ) { change, dragAmount ->
                            change.consume()
                            // 将缩放后的拖拽量转换为原始坐标空间的移动值
                            val adjustedDragX = dragAmount.x / zoom
                            val adjustedDragY = dragAmount.y / zoom
                            offsetX = (offsetX + adjustedDragX).coerceIn(0f..maxOffsetX)
                            offsetY = (offsetY + adjustedDragY).coerceIn(0f..maxOffsetY)
                        }
                    }
            )
        }
    }
}

• 坐标转换：将dragAmount除以当前zoom值，把缩放后的触摸坐标还原为原始容器空间的移动距离，保证拖拽速度与视觉表现一致。
• 动态阈值：通过dragThreshold = 1.dp.toPx() / zoom调整拖拽触发阈值，缩放后阈值同步缩小，避免放大后难以触发拖拽。
• 事件拦截：调用change.consume()确保子View拖拽事件优先处理，不会被父容器的变换手势拦截。
• Modifier顺序：将pointerInput放在size和background之后，确保触摸检测区域匹配紫色Box的实际显示范围。
• 性能优化：预计算并缓存dp转px的结果，减少重组时的重复计算开销。

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