[android] ConstraintLayout에서의 아이템 이동 애니메이션 설정

안드로이드 앱을 개발하다보면 화면 전환 혹은 사용자 상호작용에 따라 레이아웃의 아이템이 움직이는 애니메이션을 구현해야 하는 경우가 있습니다. ConstraintLayout을 사용하는 경우, 아이템의 이동 애니메이션을 설정하는 방법에 대해 알아보겠습니다.

1. 애니메이션 리소스 파일 생성

가장 먼저 res/anim 디렉토리에 아이템 이동에 사용할 애니메이션 리소스 파일을 생성합니다.

<!-- move_right.xml -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0"
        android:toXDelta="100%p"
        android:duration="500"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator" />
</set>

<!-- move_up.xml -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="0"
        android:toYDelta="-100%p"
        android:duration="500"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator" />
</set>

애니메이션 리소스 파일을 생성하여 아이템의 이동 방향과 속도를 정의합니다. 위 예시에서는 오른쪽으로 이동하는 move_right.xml과 위로 이동하는 move_up.xml을 정의하였습니다.

2. ConstraintLayout을 이용한 애니메이션 적용

이제 ConstraintLayout에서 정의한 애니메이션 리소스 파일을 적용하여 아이템의 이동 애니메이션을 설정할 수 있습니다.

// Kotlin 코드
val constraintSet = ConstraintSet()
constraintSet.clone(constraintLayout)

// 아이템을 오른쪽으로 이동하는 애니메이션 설정
TransitionManager.beginDelayedTransition(constraintLayout)
constraintSet.setHorizontalBias(R.id.item_view, 1.0f)
constraintSet.applyTo(constraintLayout)

// 아이템을 위로 이동하는 애니메이션 설정
TransitionManager.beginDelayedTransition(constraintLayout)
constraintSet.setVerticalBias(R.id.item_view, 0.0f)
constraintSet.applyTo(constraintLayout)

위 코드에서는 Kotlin을 사용하여 ConstraintSet을 생성한 뒤, setHorizontalBias()setVerticalBias() 메서드를 사용하여 아이템의 위치를 변경하여 이동 애니메이션을 설정합니다.

이제 ConstraintLayout을 사용하여 아이템의 이동 애니메이션을 적용할 수 있습니다. 애니메이션 리소스 파일을 정의하고 ConstraintSet을 사용하여 아이템의 위치를 변경하는 방법을 통해 다양한 애니메이션 효과를 적용할 수 있습니다.

참고 자료:

이제 ConstraintLayout에서 아이템 이동 애니메이션을 설정하는 방법에 대해 알아보았습니다. 본 포스트가 도움이 되었기를 바라며, 더 많은 기능을 탐구하여 안드로이드 앱을 더욱 풍부하고 다이나믹하게 만들어보시기 바랍니다.