https://kotlinlang.org logo
Title
s

Steve C

10/09/2021, 5:10 AM
Clicking/dragging doesn't seem to work when I offset a composable within the scope of another composable. It seems the click rectangle for the composable is where the composable would be if it wasn't offset. In other words, the click rectangle doesn't get moved by the offset. Here's a simple example where I want the nested boxes to be moved with the parent when the parent is dragged, but the nested boxes can also be dragged independently too. This works as long as you don't move the red or green boxes outside of the blue one. Am I doing something wrong, or missing something here?
data class MyBox(val index: Int, val color: Color)

@Composable
fun DraggingTest() {
    val boxes = mutableListOf<MyBox>()
    boxes.add(MyBox(0, Color.Blue))
    boxes.add(MyBox(1, Color.Red))
    boxes.add(MyBox(2, Color.Green))

    ConstraintLayout(modifier = Modifier
        .fillMaxSize()
        .background(Brush.verticalGradient(listOf(Color.Black, Color.Transparent)))
    ) {
        if(boxes.isNotEmpty()) {
            DraggableBox(index = boxes[0].index, color = boxes[0].color, boxes.takeLast(boxes.size-1))
        }
    }
}

@Composable
fun DraggableBox(index: Int, color: Color, boxes: List<MyBox>) {
    val initialYOffset = if(index == 0) 0f else 100f
    Box(modifier = Modifier.fillMaxSize())
    {
        val offsetX = remember { mutableStateOf(0f) }
        val offsetY = remember { mutableStateOf(initialYOffset) }
        Box(modifier = Modifier
            .offset { IntOffset(offsetX.value.roundToInt(), offsetY.value.roundToInt()) }
            .size(150.dp).background(color)
            .pointerInput(Unit) {
                detectDragGestures { change, dragAmount ->
                    change.consumeAllChanges()
                    offsetX.value = (offsetX.value + dragAmount.x)
                    offsetY.value = (offsetY.value + dragAmount.y)
                }
            }
        ) {
            Text("Box $index", modifier = Modifier.align(Alignment.BottomCenter)
                .offset(0.dp, 20.dp))

            if(boxes.isNotEmpty()) {
                DraggableBox(index = boxes[0].index, color = boxes[0].color, boxes.takeLast(boxes.size-1))
            }
        }
    }
}
🧵 3
z

Zach Klippenstein (he/him) [MOD]

10/12/2021, 2:08 AM
I think that should work, can you file a bug?
s

Steve C

10/12/2021, 2:22 AM
Whoops, sorry about not posting the code in a comment, I will try to remember that going forward.
🙏🏻 1
Yep, I will look into filing a bug. Thanks for the response, Zach.
👍🏻 1