[Android] View를 돌아다니게 하는 애니메이션 만들기

뷰가 화면 내에서 자유롭게 움직이는 것을 상상해보세요. 마치 화면 속의 작은 생명체가 돌아다니는 것 같죠? 이런 효과는 사용자 인터페이스에 생동감을 더해줍니다. 그럼, 어떻게 이런 애니메이션을 구현할 수 있을까요?

기본 설정

먼저, 안드로이드 스튜디오 프로젝트에 필요한 뷰를 준비합니다. 여기서는 FrameLayout을 사용하며, 이 내부에 움직일 ImageView나 ConstraintLayout 등을 배치합니다.

<!-- activity_main.xml -->
<FrameLayout
    android:id="@+id/rootLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/movingView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_your_image"/>
</FrameLayout>

 

애니메이션 로직 구현

다음으로, Activity 또는 Fragment에서 애니메이션 로직을 구현합니다. 기본적으로 뷰의 위치를 주기적으로 변경하여 움직임을 만들어냅니다.

 

class MainActivity : AppCompatActivity() {
    private lateinit var movingView: View
    private lateinit var rootLayout: FrameLayout
    private var directionX = 1
    private var directionY = 1
    private val speed = 5
    private val handler = Handler(Looper.getMainLooper())

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        movingView = findViewById(R.id.movingView)
        rootLayout = findViewById(R.id.rootLayout)

        moveView()
    }

    private fun moveView() {
        handler.postDelayed({
            // 현재 위치를 계산합니다.
            var newX = movingView.x + directionX * speed
            var newY = movingView.y + directionY * speed

            // 경계 검사 및 방향 전환
            if (newX <= 0 || newX >= rootLayout.width - movingView.width) {
                directionX *= -1
            }
            if (newY <= 0 || newY >= rootLayout.height - movingView.height) {
                directionY *= -1
            }

            // 뷰의 위치를 업데이트합니다.
            movingView.x = newX
            movingView.y = newY

            moveView()
        }, 30)
    }
}

이 코드는 Handler를 사용하여 주기적으로 ImageView의 위치를 업데이트합니다. directionX와 directionY 변수는 뷰의 이동 방향을 결정하며, speed 변수는 이동 속도를 조절합니다.

마무리

이렇게 하면, 뷰가 화면 내에서 마치 살아있는 듯이 움직이게 됩니다. 사용자들은 이런 독특한 애니메이션을 보며 즐거움을 느낄 것입니다. 이번 포스트가 안드로이드 개발의 재미있는 한 부분을 탐험하는 데 도움이 되었기를 바랍니다.