drag-with-rotation.txt

@androidx.compose.runtime.Composable
fun TestScreen() {
    var dragOffset by remember { mutableStateOf(Offset.Zero) }
    val density = LocalDensity.current

    val angle by remember {
        derivedStateOf {
            if (dragOffset.y == 0f || dragOffset.y == 0f) return@derivedStateOf 0f
            val angleInRadian = atan(dragOffset.x / -dragOffset.y)
            val angleInDegree = (angleInRadian * 180f / Math.PI).toFloat()
            Log.i(
                TAG,
                "TestScreen: angle dragOffset $dragOffset angleInDegree $angleInDegree "
            )
            if (!angleInDegree.isNaN()) {
                angleInDegree.coerceIn(-16f, 16f)
            } else {
                0f
            }
        }
    }


    Column(
        modifier = Modifier.fillMaxSize()
    ) {
        Box(
            modifier = Modifier
                .fillMaxWidth()
                .fillMaxHeight(0.9f)
                .drawWithContent {
                    drawContent()
                    drawLine(
                        color = Color.Red,
                        start = Offset(this.center.x, 0f),
                        end = Offset(this.center.x, this.size.height)
                    )
                    drawLine(
                        color = Color.Red,
                        start = Offset(0f, this.center.y),
                        end = Offset(this.size.width, this.center.y)
                    )
                }
                .background(color = Color.Black, shape = RoundedCornerShape(16.dp)),
            contentAlignment = Alignment.Center
        ) {
            Box(
                modifier = Modifier
                    .graphicsLayer {
                        rotationZ = angle
                    }
                    .offset {
                        IntOffset(dragOffset.x.roundToInt(), dragOffset.y.roundToInt())
                    }
                    .width(200.dp)
                    .aspectRatio(0.5625f)
                    .background(color = Color.Blue, shape = RoundedCornerShape(16.dp))
                    .pointerInput(true) {
                        detectDragGestures() { change, dragAmount ->
                            Log.i(TAG, "TestScreen: detectDragGestures  dragAmount $dragAmount")
                            change.consume()
                            dragOffset = Offset(
                                dragOffset.x + dragAmount.x.roundToInt(),
                                dragOffset.y + dragAmount.y.roundToInt()
                            )
                        }
                    }
            ) {
                Box(
                    modifier = Modifier
                        .align(Alignment.TopStart)
                        .size(10.dp)
                        .clip(CircleShape)
                        .background(Color.Red)

                )
                Box(
                    modifier = Modifier
                        .align(Alignment.TopEnd)
                        .size(10.dp)
                        .clip(CircleShape)
                        .background(Color.Green)

                )
                Box(
                    modifier = Modifier
                        .align(Alignment.Center)
                        .size(10.dp)
                        .clip(CircleShape)
                        .background(Color.Yellow)

                )
            }
        }
        Row(
            modifier = Modifier.fillMaxSize(),
            horizontalArrangement = Arrangement.Center,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Button(
                onClick = {
                    dragOffset = Offset.Zero
                }
            ) {
                Text(text = "Reset")
            }

            Button(
                onClick = {
                    dragOffset = dragOffset.copy(
                        x = dragOffset.x + 1,
                        y = dragOffset.y + 1
                    )
                }
            ) {
                Text(text = "Start")
            }
        }
    }
}