플링 애니메이션을 사용하여 보기 이동

Compose 방식 사용해 보기
Jetpack Compose는 Android용으로 권장되는 UI 도구 키트입니다. Compose에서 애니메이션을 사용하는 방법을 알아봅니다.

플링 기반 애니메이션은 객체의 속도에 비례하는 마찰력을 사용합니다. 객체의 속성에 애니메이션을 적용하고 애니메이션을 점진적으로 종료하는 데 사용합니다. 초기 모멘텀이 있으며, 이는 대부분 동작 속도에서 수신되고 점차 느려집니다. 애니메이션 속도가 기기 화면에 눈에 띄는 변화를 주지 않을 정도로 느려지면 애니메이션이 종료됩니다.

그림 1. 플링 애니메이션

관련 주제에 대해 알아보려면 다음 가이드를 참고하세요.

AndroidX 라이브러리 추가

물리학 기반 애니메이션을 사용하려면 다음과 같이 AndroidX 라이브러리를 프로젝트에 추가해야 합니다.

  1. 앱 모듈의 build.gradle 파일 열기
  2. dependencies 섹션에 AndroidX 라이브러리를 추가합니다.

    Groovy

            dependencies {
                implementation 'androidx.dynamicanimation:dynamicanimation:1.0.0'
            }
            

    Kotlin

            dependencies {
                implementation("androidx.dynamicanimation:dynamicanimation:1.0.0")
            }
            

플링 애니메이션 만들기

FlingAnimation 클래스를 사용하면 객체의 플링 애니메이션을 만들 수 있습니다. 플링 애니메이션을 빌드하려면 FlingAnimation 클래스의 인스턴스를 만들고 애니메이션을 적용할 객체와 객체의 속성을 제공합니다.

Kotlin

val fling = FlingAnimation(view, DynamicAnimation.SCROLL_X)

자바

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);

속도 설정

시작 속도는 애니메이션 시작 시 애니메이션 속성이 변경되는 속도를 정의합니다. 기본 시작 속도는 초당 0픽셀로 설정됩니다. 따라서 애니메이션이 바로 끝나지 않도록 시작 속도를 정의해야 합니다.

고정 값을 시작 속도로 사용하거나 터치 동작의 속도를 기반으로 할 수 있습니다. 고정 값을 제공하려면 초당 dp 단위로 값을 정의한 다음 초당 픽셀 단위로 변환해야 합니다. 초당 dp 단위로 값을 정의하면 속도가 기기의 밀도 및 폼 팩터와 무관할 수 있습니다. 시작 속도를 초당 픽셀로 변환하는 방법에 관한 자세한 내용은 스프링 애니메이션의 초당 dp를 초당 픽셀로 변환 섹션을 참고하세요.

속도를 설정하려면 setStartVelocity() 메서드를 호출하고 초당 픽셀 단위로 속도를 전달합니다. 이 메서드는 속도가 설정된 플링 객체를 반환합니다.

참고: GestureDetector.OnGestureListener 및 VelocityTracker 클래스를 사용하여 터치 동작의 속도를 각각 가져오고 계산합니다.

애니메이션 값 범위 설정

속성 값을 특정 범위로 제한하려면 애니메이션 최솟값과 최댓값을 설정하면 됩니다. 이 범위 제어는 알파 (0~1)와 같이 고유한 범위가 있는 속성에 애니메이션을 적용할 때 특히 유용합니다.

참고: 플링 애니메이션 값이 최솟값 또는 최댓값에 도달하면 애니메이션이 종료됩니다.

최솟값과 최댓값을 설정하려면 각각 setMinValue() 및 setMaxValue() 메서드를 호출합니다. 두 메서드 모두 사용자가 값을 설정한 애니메이션 객체를 반환합니다.

마찰 설정

setFriction() 메서드를 사용하면 애니메이션의 마찰을 변경할 수 있습니다. 애니메이션에서 속도가 얼마나 빨리 감소하는지를 정의합니다.

참고: 애니메이션 시작 시 마찰을 설정하지 않으면 애니메이션은 기본 마찰 값 1을 사용합니다.

이 메서드는 제공된 마찰 값을 애니메이션에서 사용하는 객체를 반환합니다.

샘플 코드

아래 예에서는 가로 플링을 보여줍니다. 속도 추적기에서 캡처된 속도는 velocityX이고 스크롤 경계는 0과 maxScroll로 설정됩니다. 마찰은 1.1로 설정됩니다.

Kotlin

FlingAnimation(view, DynamicAnimation.SCROLL_X).apply {
    setStartVelocity(-velocityX)
    setMinValue(0f)
    setMaxValue(maxScroll)
    friction = 1.1f
    start()
}

자바

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);
fling.setStartVelocity(-velocityX)
        .setMinValue(0)
        .setMaxValue(maxScroll)
        .setFriction(1.1f)
        .start();

최소 표시 변경 설정

픽셀로 정의되지 않은 맞춤 속성에 애니메이션을 적용할 때는 사용자에게 표시되는 애니메이션 값의 최소 변경사항을 설정해야 합니다. 애니메이션을 종료하기 위한 합리적인 기준점을 결정합니다.

DynamicAnimation.ViewProperty에 애니메이션을 적용할 때는 이 메서드를 호출할 필요가 없습니다. 최소 가시적 변경이 속성에서 파생되기 때문입니다. 예를 들면 다음과 같습니다.

  • 기본 최소 가시적 변경 값은 TRANSLATION_X, TRANSLATION_Y, TRANSLATION_Z, SCROLL_X, SCROLL_Y와 같은 뷰 속성의 경우 1픽셀입니다.
  • ROTATION, ROTATION_X, ROTATION_Y과 같이 회전을 사용하는 애니메이션의 경우 눈에 띄는 최소 변화는 MIN_VISIBLE_CHANGE_ROTATION_DEGREES 또는 1/10픽셀입니다.
  • 불투명도를 사용하는 애니메이션의 경우 최소 가시적 변화는 MIN_VISIBLE_CHANGE_ALPHA 또는 1/256입니다.

애니메이션의 최소 가시적 변화를 설정하려면 setMinimumVisibleChange() 메서드를 호출하고 최소 가시적 상수 중 하나 또는 맞춤 속성에 계산해야 하는 값을 전달합니다. 이 값을 계산하는 방법에 관한 자세한 내용은 최소 가시적 변경 값 계산 섹션을 참고하세요.

Kotlin

anim.minimumVisibleChange = DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE

자바

anim.setMinimumVisibleChange(DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE);

참고: 픽셀로 정의되지 않은 맞춤 속성에 애니메이션을 적용하는 경우에만 값을 전달해야 합니다.

최소 표시 변경 값 계산

맞춤 속성의 최소 가시적 변경 값을 계산하려면 다음 수식을 사용합니다.

최소 가시적 변화 = 맞춤 속성 값의 범위 / 애니메이션 범위(픽셀)

예를 들어 애니메이션을 적용하려는 속성이 0에서 100으로 진행됩니다. 이는 200픽셀 변경에 해당합니다. 공식에 따라 표시되는 최소 변경 값은 100 / 200, 즉 0.5픽셀입니다.