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

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

플링 기반 애니메이션은 객체의 속도에 비례하는 마찰력을 사용합니다. 이 마찰력을 사용하여 객체의 속성을 애니메이션화하고 애니메이션을 점차적으로 종료합니다. 초기 운동량은 대부분 동작 속도에서 받으며 점차 속도가 느려집니다. 애니메이션의 속도가 낮아서 기기 화면에 눈에 띄는 변화가 없으면 애니메이션이 종료됩니다.

그림 1. 플링 애니메이션

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

AndroidX 라이브러리 추가

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

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

    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.OnGestureListenerVelocityTracker 클래스를 사용하여 각각 터치 동작의 속도를 검색하고 계산합니다.

애니메이션 값 범위 설정

속성 값을 특정 범위로 제한하려면 최소 및 최대 애니메이션 값을 설정할 수 있습니다. 이 범위 제어는 알파 (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_XROTATION_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픽셀입니다.