profile image

L o a d i n g . . .

반응형

안드로이드 코틀린 MotionLayout setTransitionListener

 Android Kotlin MotionLayout setTransitionListener

 

안드로이드 개발을 하면서 여러가지 애니메이션 효과를 넣어야 한다. 이 때마다 일일이 코드로 구현하느라 간단하 애니메이션을 쓰더라도 코드량이 많아지는 경험이 분명 있을 것이다.

이에따라 구글에서 MotionLayout을 제공하는데 나온것에 비해 나도 이제 처음 써본다.

 

MotionLayout은 따로 implementation없이 constraintLayout에 포함되어 있다.

 

이 중 각각 액티비티에 만들어진 MotionLayot을 붙여야 하는 경우가 있는데 이 때 setTransitionListener을 사용하면 된다.

이 전에 각각 motionlayout에는 애니메이션이 지정되어 있어야 한다.

 

sampleView.playerMotionLayout.setTransitionListener(object : MotionLayout.TransitionListener {
            override fun onTransitionTrigger(p0: MotionLayout?, p1: Int, p2: Boolean, p3: Float) {d
            }

            override fun onTransitionStarted(p0: MotionLayout?, p1: Int, p2: Int) {

            }

            override fun onTransitionChange(motionLayout: MotionLayout?, startId: Int, endId: Int, progress: Float) {
                
            }

            override fun onTransitionCompleted(p0: MotionLayout?, p1: Int) {

            }

        })

리스너를 제대로 구현을 했다면 위와 같이 4개의 override가 있을 것이다.

함수명이 직관적이라 어떤 기능을 하는 것인지는 다 알 것이다. 이중 나는 3번째 onTransitionChange 함수를 사용하여 두개의 motionLayout을 붙일 것이다

sampleView.playerMotionLayout.setTransitionListener(object : MotionLayout.TransitionListener {
            override fun onTransitionTrigger(p0: MotionLayout?, p1: Int, p2: Boolean, p3: Float) {d
            }

            override fun onTransitionStarted(p0: MotionLayout?, p1: Int, p2: Int) {

            }

            override fun onTransitionChange(motionLayout: MotionLayout?, startId: Int, endId: Int, progress: Float) {
                sampleView.let {
                    (activity as MainActivity).also {
                        it.findViewById<MotionLayout>(R.id.mainMotionLayout).progress = abs(progress)
                    }
                }
            }

            override fun onTransitionCompleted(p0: MotionLayout?, p1: Int) {

            }

        })

위 액티비티에서 motionLayout의 이벤트가 발생할 때 MainActivity의 motionLayout도 그에 따라 동작을 하게 하였다.

 

반응형
복사했습니다!