Android(Kotlin)

Compose에서 Tap, Gesture 감지하기

E.I.T.U 2023. 6. 29. 18:13
@Composable
fun App() {
	//줌(스케일)
	var scale by remember { mutableStateOf(1f) }
    //뷰 이동
    var offset by remember { mutableStateOf(Offset.Zero) }
    //루트에서 현재 뷰의 상대 위치
    var rootOffset by remember { mutableStateOf(Offset.Zero) }
    //State로써 변화를 저장
    val state = rememberTransformableState { zoomChange, offsetChange, rotationChange ->
        scale *= zoomChange
        offset += offsetChange
    }
    
    Box(
    	modifier = Modifier
                .fillMaxSize()
                //줌, 이동을 뷰에 반영
                .graphicsLayer(
                    scaleX = scale,
                    scaleY = scale,
                    translationX = offset.x,
                    translationY = offset.y
                )
                //멀티터치 이벤트를 받기 위해 transformable을 설정
                .transformable(state = state)
                //onTapGesture를 위해 pointerInput을 설정
                .pointerInput(Unit) {
                    detectTapGestures(
                        onTap = {
                            markers.add(Offset(it.x - 12.dp.value, it.y - 12.dp.value))
                        }
                    )
                }
                //루트뷰에서 현재 뷰의 상대 위치를 알기 위해 설정
                .onGloballyPositioned {
                    rootOffset = it.positionInRoot()
                    Log.d("position", "${it.positionInRoot()}")
                }
	) {
    	Image(
        	painter = painterResource(id = R.drawable.img_sample),
            contentDescription = "SampleImage",
            modifier = Modifider.fillMaxWidth()
        )
    }
}