Android 그래픽 및 애니메이션

아티클
02/16/2018

Android는 2D 그래픽 및 애니메이션을 지원하기 위한 매우 풍부하고 다양한 프레임워크를 제공합니다. 이 항목에서는 이러한 프레임워크를 소개하고 Xamarin.Android 애플리케이션에서 사용할 사용자 지정 그래픽 및 애니메이션을 만드는 방법을 설명합니다.

개요

일반적으로 제한된 성능의 디바이스에서 실행되더라도 가장 높은 등급의 모바일 애플리케이션에는 직관적이고 반응성이 뛰어난 동적 느낌을 제공하는 고품질 그래픽 및 애니메이션이 포함된 정교한 UX(사용자 환경)가 있는 경우가 많습니다. 모바일 애플리케이션이 점점 더 정교해짐에 따라 사용자는 애플리케이션에서 점점 더 많은 것을 기대하기 시작했습니다.

다행히 최신 모바일 플랫폼은 사용 편의성을 유지하면서 정교한 애니메이션 및 사용자 지정 그래픽을 만들기 위한 매우 강력한 프레임워크를 보유하고 있습니다. 이를 통해 개발자는 거의 노력하지 않은 채 풍부한 대화형 작업을 추가할 수 있습니다.

Android의 UI API 프레임워크는 대략 그래픽과 애니메이션의 두 가지 범주로 분할될 수 있습니다.

그래픽은 2D 및 3D 그래픽을 수행하기 위한 다양한 방법으로 더 분할됩니다. 3D 그래픽은 OpenGL ES(OpenGL의 모바일 특정 버전) 및 MonoGame(XNA 도구 키트와 호환되는 플랫폼 간 도구 키트)과 같은 타사 프레임워크와 같은 다양한 기본 제공 프레임워크를 통해 사용할 수 있습니다. 3D 그래픽은 이 문서의 범위에 속하지 않지만 기본 제공 2D 그리기 기술을 살펴보겠습니다.

Android는 2D 그래픽을 만들기 위한 두 가지 API를 제공합니다. 하나는 높은 수준의 선언적 접근 방식이고 다른 하나는 프로그래밍 방식의 하위 수준 API입니다.

그리기 가능한 리소스 – XML 파일에 그리기 지침을 포함하여 프로그래밍 방식으로 또는 (더 일반적으로) 사용자 지정 그래픽을 만드는 데 사용됩니다. 그리기 가능한 리소스는 일반적으로 Android에서 2D 그래픽을 렌더링하기 위한 명령이나 작업이 포함된 XML 파일로 정의됩니다.
Canvas – 기본 비트맵에 직접 그리기를 포함하는 하위 수준 API입니다. 표시되는 내용을 매우 세밀하게 제어할 수 있습니다.

Android는 이러한 2D 그래픽 기술 외에도 애니메이션을 만드는 여러 가지 방법을 제공합니다.

그리기 가능한 애니메이션 – Android는 그리기 가능한 애니메이션이라고 하는 프레임별 애니메이션도 지원합니다. 가장 간단한 애니메이션 API입니다. Android는 그리기 가능한 리소스를 순차적으로 로드하고 표시합니다(만화와 유사).
보기 애니메이션 – 보기 애니메이션 은 Android의 원래 애니메이션 API이며 모든 버전의 Android에서 사용할 수 있습니다. 이 API는 View 개체에서만 작동하며 해당 뷰에서 간단한 변환만 수행할 수 있다는 측면에서 제한됩니다. 보기 애니메이션은 일반적으로 폴더에 있는 XML 파일에 /Resources/anim 정의됩니다.
속성 애니메이션 – Android 3.0은 속성 애니메이션이라고 하는 새로운 애니메이션 API 집합을 도입했습니다. 이러한 새로운 API는 뷰 개체뿐만 아니라 모든 개체의 속성에 애니메이션 효과를 주는 데 사용할 수 있는 확장 가능하고 유연한 시스템을 도입했습니다. 이러한 유연성을 통해 애니메이션을 고유 클래스에 캡슐화하여 코드 공유를 더 쉽게 수행할 수 있습니다.

보기 애니메이션은 이전 Android 3.0 API(API 수준 11)를 지원해야 하는 애플리케이션에 더 적합합니다. 그렇지 않은 경우 애플리케이션은 위에서 멘션 이유로 최신 속성 애니메이션 API를 사용해야 합니다.

이러한 모든 프레임워크는 실행 가능한 옵션이지만 가능한 경우 작업할 수 있는 보다 유연한 API이므로 속성 애니메이션에 기본 설정을 지정해야 합니다. 속성 애니메이션을 사용하면 코드 공유를 더 쉽게 만들고 코드 기본 테넌스를 간소화하는 고유한 클래스에 애니메이션 논리를 캡슐화할 수 있습니다.

접근성

그래픽 및 애니메이션은 Android 앱을 매력적이고 재미있게 사용할 수 있도록 도와줍니다. 그러나 일부 상호 작용은 화면 읽기 프로그램, 대체 입력 디바이스 또는 보조 확대/축소를 통해 발생한다는 점을 기억해야 합니다. 또한 오디오 기능 없이 일부 상호 작용이 발생할 수 있습니다.

앱은 사용자 인터페이스에서 힌트 및 탐색 지원을 제공하고 UI의 그림 요소에 대한 텍스트 콘텐츠 또는 설명이 있는지 확인하는 등 접근성을 염두에 두고 디자인된 경우 이러한 상황에서 더 사용할 수 있습니다.

Android의 접근성 API를 활용하는 방법에 대한 자세한 내용은 Google의 접근성 가이드를 참조하세요.

2D 그래픽

그리기 가능한 리소스는 Android 애플리케이션에서 널리 사용되는 기술입니다. 다른 리소스와 마찬가지로 그리기 가능한 리소스는 선언적입니다. XML 파일에 정의되어 있습니다. 이 방법을 사용하면 리소스에서 코드를 클린 분리할 수 있습니다. 이렇게 하면 Android 애플리케이션에서 그래픽을 업데이트하거나 변경하기 위해 코드를 변경할 필요가 없으므로 개발 및 기본 테넌트를 간소화할 수 있습니다. 그러나 그리기 가능한 리소스는 많은 간단하고 일반적인 그래픽 요구 사항에 유용하지만 Canvas API의 성능과 제어가 부족합니다.

Canvas 개체를 사용하는 다른 기술은 System.Drawing 또는 iOS의 코어 드로잉과 같은 다른 기존 API 프레임워크와 매우 유사합니다. Canvas 개체를 사용하면 2D 그래픽을 만드는 방법을 가장 많이 제어할 수 있습니다. 그리기 가능한 자원이 작동하지 않거나 작업하기 어려운 상황에 적합합니다. 예를 들어 슬라이더 값과 관련된 계산에 따라 모양이 변경되는 사용자 지정 슬라이더 컨트롤을 그려야 할 수 있습니다.

먼저 그리기 가능한 리소스를 살펴보겠습니다. 더 간단하고 가장 일반적인 사용자 지정 그리기 사례를 다룹니다.

그리기 가능한 리소스

그리기 가능한 리소스는 디렉터리의 XML 파일에 정의됩니다 /Resources/drawable. PNG 또는 JPEG 포함과 달리 밀도별 드로어블 리소스 버전을 제공할 필요는 없습니다. 런타임에 Android 애플리케이션은 이러한 리소스를 로드하고 이러한 XML 파일에 포함된 지침을 사용하여 2D 그래픽을 만듭니다. Android는 다음과 같은 여러 가지 유형의 그리기 가능한 리소스를 정의합니다.

ShapeDrawable – 기본 기하 도형을 그리고 해당 셰이프에 제한된 그래픽 효과 집합을 적용하는 그리기 가능한 개체입니다. 단추 사용자 지정 또는 TextView의 배경 설정과 같은 작업에 매우 유용합니다. 이 문서의 뒷부분에서 사용하는 ShapeDrawable 방법의 예를 살펴보겠습니다.
StateListDrawable – 위젯/컨트롤의 상태에 따라 모양을 변경하는 그리기 가능한 리소스입니다. 예를 들어 단추는 누름 여부에 따라 모양이 변경될 수 있습니다.
LayerDrawable – 다른 여러 드로블을 다른 드로블 위에 쌓을 수 있는 이 그리기 가능한 리소스입니다. LayerDrawable의 예는 다음 스크린샷에 나와 있습니다.
TransitionDrawable – LayerDrawable 이지만 한 가지 차이점이 있습니다 . TransitionDrawable은 한 레이어가 다른 레이어 위에 표시되는 애니메이션 효과를 줄 수 있습니다.
LevelListDrawable – 특정 조건에 따라 이미지를 표시한다는 측면에서 StateListDrawable과 매우 유사합니다. 그러나 StateListDrawable과 달리 LevelListDrawable은 정수 값을 기반으로 이미지를 표시합니다. LevelListDrawable의 예는 WiFi 신호의 강도를 표시하는 것입니다. WiFi 신호의 강도가 변경되면 표시되는 드로블이 그에 따라 변경됩니다.
ScaleDrawable /ClipDrawable – 이름에서 알 수 있듯이 이러한 Drawable은 크기 조정 및 클리핑 기능을 모두 제공합니다. ScaleDrawable은 다른 그리기 가능 개체의 크기를 조정하고, ClipDrawable은 다른 Drawable을 클리핑합니다.
InsetDrawable – 이 그리기 가능 항목은 다른 Drawable 리소스의 측면에 인셋을 적용합니다. 보기에 보기의 실제 범위보다 작은 배경이 필요할 때 사용됩니다.
XML BitmapDrawable – 이 파일은 실제 비트맵에서 수행할 XML의 지침 집합입니다. Android에서 수행할 수 있는 몇 가지 작업은 타일링, 디더링 및 앤티앨리어싱입니다. 이 작업의 일반적인 용도 중 하나는 레이아웃의 배경에 비트맵을 타일하는 것입니다.

그리기 가능한 예제

를 사용하여 2D 그래픽을 만드는 방법에 대한 빠른 예제를 ShapeDrawable살펴보겠습니다. A는 ShapeDrawable 사각형, 타원, 선 및 링의 네 가지 기본 셰이프 중 하나를 정의할 수 있습니다. 그라데이션, 색상 및 크기와 같은 기본 효과를 적용할 수도 있습니다. 다음 XML은 ShapeDrawable AnimationsDemo 도우미 프로젝트(파일Resources/drawable/shape_rounded_blue_rect.xml)에서 찾을 수 있는 XML입니다. 보라색 그라데이션 배경과 둥근 모서리가 있는 사각형을 정의합니다.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<!-- Specify a gradient for the background -->
<gradient android:angle="45"
          android:startColor="#55000066"
          android:centerColor="#00000000"
          android:endColor="#00000000"
          android:centerX="0.75" />

<padding android:left="5dp"
          android:right="5dp"
          android:top="5dp"
          android:bottom="5dp" />

<corners android:topLeftRadius="10dp"
          android:topRightRadius="10dp"
          android:bottomLeftRadius="10dp"
          android:bottomRightRadius="10dp" />
</shape>

다음 XML과 같이 레이아웃 또는 다른 그리기 가능 항목에서 선언적으로 이 그리기 가능한 리소스를 참조할 수 있습니다.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#33000000">
    <TextView android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_centerInParent="true"
              android:background="@drawable/shape_rounded_blue_rect"
              android:text="@string/message_shapedrawable" />
</RelativeLayout>

그리기 가능한 리소스를 프로그래밍 방식으로 적용할 수도 있습니다. 다음 코드 조각은 TextView의 배경을 프로그래밍 방식으로 설정하는 방법을 보여 줍니다.

TextView tv = FindViewById<TextView>(Resource.Id.shapeDrawableTextView);
tv.SetBackgroundResource(Resource.Drawable.shape_rounded_blue_rect);

이 모양을 확인하려면 AnimationsDemo 프로젝트를 실행하고 기본 메뉴에서 도형 그리기 가능 항목을 선택합니다. 다음 스크린샷과 비슷한 내용이 표시됩니다.

XML 요소 및 그리기 가능한 리소스 구문에 대한 자세한 내용은 Google 설명서를 참조하세요.

캔버스 그리기 API 사용

드로블은 강력하지만 제한 사항이 있습니다. 특정 항목은 불가능하거나 매우 복잡합니다(예: 디바이스의 카메라에서 찍은 사진에 필터 적용). 그리기 가능한 리소스를 사용하여 적목 현상 감소를 적용하는 것은 매우 어려울 것입니다. 대신 Canvas API를 사용하면 애플리케이션이 그림의 특정 부분에서 색을 선택적으로 변경할 수 있도록 매우 세분화된 컨트롤을 가질 수 있습니다.

Canvas에서 일반적으로 사용되는 클래스 중 하나는 그림판 클래스입니다. 이 클래스는 그리는 방법에 대한 색상 및 스타일 정보를 보유합니다. 색과 투명도를 제공하는 데 사용됩니다.

Canvas API는 화가의 모델을 사용하여 2D 그래픽을 그립니다. 연산은 서로 위에 있는 연속 계층에 적용됩니다. 각 작업은 기본 비트맵의 일부 영역을 다룹니다. 영역이 이전에 칠해진 영역과 겹치면 새 페인트가 이전 영역을 부분적으로 또는 완전히 가립니다. System.Drawing 및 iOS의 핵심 그래픽과 같은 다른 많은 그리기 API가 작동하는 것과 동일합니다.

개체를 가져오는 방법에는 두 가지가 있습니다 Canvas . 첫 번째 방법은 Bitmap 개체를 정의한 다음 개체를 Canvas 인스턴스화하는 것입니다. 예를 들어 다음 코드 조각은 기본 비트맵을 사용하여 새 캔버스를 만듭니다.

Bitmap bitmap = Bitmap.CreateBitmap(100, 100, Bitmap.Config.Argb8888);
Canvas canvas = new Canvas(b);

개체를 가져오는 Canvas 다른 방법은 View 기본 클래스를 제공하는 OnDraw 콜백 메서드를 사용하는 것입니다. Android는 뷰를 직접 그릴 필요가 있다고 판단하고 뷰가 작동할 개체를 전달하는 경우 이 메서드를 호출합니다 Canvas .

Canvas 클래스는 프로그래밍 방식으로 그리기 지침을 제공하는 메서드를 노출합니다. 예시:

Canvas.Draw그림판 – 전체 캔버스의 비트맵을 지정된 페인트로 채웁니다.
Canvas.DrawPath – 지정된 페인트를 사용하여 지정된 기하 도형을 그립니다.
Canvas.DrawText – 캔버스의 텍스트를 지정된 색으로 그립니다. 텍스트는 위치에 x,y 그려집니다.

Canvas API를 사용하여 그리기

다음은 작동 중인 Canvas API의 예입니다. 다음 코드 조각은 뷰를 그리는 방법을 보여 있습니다.

public class MyView : View
{
    protected override void OnDraw(Canvas canvas)
    {
        base.OnDraw(canvas);
        Paint green = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0x99, 0xcc, 0),
        };
        green.SetStyle(Paint.Style.FillAndStroke);

        Paint red = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0xff, 0x44, 0x44)
        };
        red.SetStyle(Paint.Style.FillAndStroke);

        float middle = canvas.Width * 0.25f;
        canvas.DrawPaint(red);
        canvas.DrawRect(0, 0, middle, canvas.Height, green);
    }
}

위의 이 코드는 먼저 빨간색 페인트와 녹색 페인트 개체를 만듭니다. 캔버스의 내용을 빨간색으로 채운 다음 캔버스 너비의 25%인 녹색 사각형을 그리도록 캔버스에 지시합니다. 이 예제는 이 문서의 소스 코드에 포함된 프로젝트에서 확인할 AnimationsDemo 수 있습니다. 애플리케이션을 시작하고 기본 메뉴에서 그리기 항목을 선택하면 다음과 유사한 화면이 표시됩니다.

애니메이션

사용자는 애플리케이션에서 이동하는 항목을 좋아합니다. 애니메이션은 애플리케이션의 사용자 환경을 개선하고 눈에 띄는 데 도움이 되는 좋은 방법입니다. 가장 좋은 애니메이션은 자연스러워서 사용자가 알아채지 못하는 애니메이션입니다. Android는 애니메이션에 대해 다음 세 가지 API를 제공합니다.

애니메이션 보기 – 원래 API입니다. 이러한 애니메이션은 특정 보기에 연결되며 보기 내용에 대해 간단한 변환을 수행할 수 있습니다. 이 API는 단순하기 때문에 알파 애니메이션, 회전 등과 같은 작업에 여전히 유용합니다.
속성 애니메이션 – 속성 애니메이션은 Android 3.0에서 도입되었습니다. 애플리케이션이 거의 모든 것에 애니메이션 효과를 주는 데 사용할 수 있습니다. 개체가 화면에 표시되지 않더라도 속성 애니메이션을 사용하여 개체의 속성을 변경할 수 있습니다.
그리기 가능한 애니메이션 – 레이아웃에 매우 간단한 애니메이션 효과를 적용하는 데 사용되는 특수 그리기 가능한 리소스입니다.

일반적으로 속성 애니메이션은 더 유연하고 더 많은 기능을 제공하므로 사용하기에 선호되는 시스템입니다.

애니메이션 보기

보기 애니메이션은 보기로 제한되며 시작점 및 끝점, 크기, 회전 및 투명도와 같은 값에 대해서만 애니메이션을 수행할 수 있습니다. 이러한 유형의 애니메이션은 일반적으로 트윈 애니메이션이라고 합니다. 보기 애니메이션은 프로그래밍 방식으로 또는 XML 파일을 사용하여 두 가지 방법으로 정의할 수 있습니다. XML 파일은 보기 애니메이션을 더 읽기 쉽고 쉽게 기본 선언하는 기본 방법입니다.

애니메이션 XML 파일은 Xamarin.Android 프로젝트의 디렉터리에 저장 /Resources/anim 됩니다. 이 파일에는 루트 요소로 다음 요소 중 하나가 있어야 합니다.

alpha – 페이드 인 또는 페이드 아웃 애니메이션.
rotate – 회전 애니메이션입니다.
scale – 크기 조정 애니메이션입니다.
translate – 가로 및/또는 세로 동작입니다.
set – 하나 이상의 다른 애니메이션 요소를 보유할 수 있는 컨테이너입니다.

기본적으로 XML 파일의 모든 애니메이션이 동시에 적용됩니다. 애니메이션이 순차적으로 수행되도록 하려면 위에서 정의한 android:startOffset 요소 중 하나에 특성을 설정합니다.

보간기를 사용하여 애니메이션의 변경 속도에 영향을 줄 수 있습니다. 보간기를 사용하면 애니메이션 효과를 가속, 반복 또는 감속할 수 있습니다. Android 프레임워크는 다음과 같은 몇 가지 보간기를 기본으로 제공합니다(이에 국한되지 않음).

AccelerateInterpolator / DecelerateInterpolator – 이러한 보간기는 애니메이션의 변경 속도를 늘리거나 줄입니다.
BounceInterpolator – 변경 내용이 마지막에 반송됩니다.
LinearInterpolator – 변경 속도가 일정합니다.

다음 XML에서는 이러한 요소 중 일부를 결합하는 애니메이션 파일의 예를 보여 줍니다.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android=http://schemas.android.com/apk/res/android
     android:shareInterpolator="false">

    <scale android:interpolator="@android:anim/accelerate_decelerate_interpolator"
           android:fromXScale="1.0"
           android:toXScale="1.4"
           android:fromYScale="1.0"
           android:toYScale="0.6"
           android:pivotX="50%"
           android:pivotY="50%"
           android:fillEnabled="true"
           android:fillAfter="false"
           android:duration="700" />

    <set android:interpolator="@android:anim/accelerate_interpolator">
        <scale android:fromXScale="1.4"
               android:toXScale="0.0"
               android:fromYScale="0.6"
               android:toYScale="0.0"
               android:pivotX="50%"
               android:pivotY="50%"
               android:fillEnabled="true"
               android:fillBefore="false"
               android:fillAfter="true"
               android:startOffset="700"
               android:duration="400" />

        <rotate android:fromDegrees="0"
                android:toDegrees="-45"
                android:toYScale="0.0"
                android:pivotX="50%"
                android:pivotY="50%"
                android:fillEnabled="true"
                android:fillBefore="false"
                android:fillAfter="true"
                android:startOffset="700"
                android:duration="400" />
    </set>
</set>

이 애니메이션은 모든 애니메이션을 동시에 수행합니다. 첫 번째 배율 애니메이션은 이미지를 가로로 확장하고 세로로 축소한 다음 이미지를 시계 반대 방향으로 45도 회전하고 축소하여 화면에서 사라집니다.

애니메이션을 확장한 다음 보기에 적용하여 프로그래밍 방식으로 뷰에 적용할 수 있습니다. Android는 애니메이션 리소스를 부풀리고 인스턴스Android.Views.Animations.Animation를 반환하는 도우미 클래스 Android.Views.Animations.AnimationUtils 를 제공합니다. 이 개체는 개체를 호출 StartAnimation 하고 전달하여 View에 적용됩니다 Animation . 다음 코드 조각은 이 예제를 보여줍니다.

Animation myAnimation = AnimationUtils.LoadAnimation(Resource.Animation.MyAnimation);
ImageView myImage = FindViewById<ImageView>(Resource.Id.imageView1);
myImage.StartAnimation(myAnimation);

이제 보기 애니메이션의 작동 방식을 근본적으로 이해했으므로 속성 애니메이션으로 이동할 수 있습니다.

속성 애니메이션

속성 애니메이터는 Android 3.0에서 도입된 새로운 API입니다. 개체의 모든 속성에 애니메이션 효과를 주는 데 사용할 수 있는 확장 가능한 API를 제공합니다.

모든 속성 애니메이션은 Animator 하위 클래스의 인스턴스에 의해 생성됩니다. 애플리케이션은 이 클래스를 직접 사용하지 않고 서브클래스 중 하나를 사용합니다.

ValueAnimator – 이 클래스는 전체 속성 애니메이션 API에서 가장 중요한 클래스입니다. 변경해야 하는 속성의 값을 계산합니다. 이러한 값은 ViewAnimator 직접 업데이트하지 않습니다. 대신 애니메이션 개체를 업데이트하는 데 사용할 수 있는 이벤트가 발생합니다.
ObjectAnimator – 이 클래스는 의 ValueAnimator 하위 클래스입니다. 업데이트할 대상 개체 및 속성을 수락하여 개체에 애니메이션 효과를 주는 프로세스를 간소화하기 위한 것입니다.
AnimationSet – 이 클래스는 애니메이션이 서로 관련되어 실행되는 방식을 오케스트레이션합니다. 애니메이션은 동시에, 순차적으로 또는 애니메이션 간에 지정된 지연으로 실행될 수 있습니다.

계산기는 애니메이션 중에 애니메이터가 새 값을 계산하는 데 사용하는 특수 클래스입니다. Android는 다음과 같은 평가자를 제공합니다.

IntEvaluator – 정수 속성의 값을 계산합니다.
FloatEvaluator – float 속성의 값을 계산합니다.
ArgbEvaluator – 색 속성 값을 계산합니다.

애니메이션 효과를 주는 속성이 색이 아닌 floatint 경우 애플리케이션은 인터페이스를 구현하여 ITypeEvaluator 자체 계산기를 만들 수 있습니다. (사용자 지정 평가자 구현은 이 항목의 범위를 벗어나집니다.)

ValueAnimator 사용

애니메이션에는 애니메이션 값을 계산한 다음 일부 개체의 속성에서 해당 값을 설정하는 두 부분이 있습니다. ValueAnimator 는 값만 계산하지만 개체에서 직접 작동하지는 않습니다. 대신 애니메이션 수명 동안 호출되는 이벤트 처리기 내에서 개체가 업데이트됩니다. 이 디자인을 사용하면 애니메이션된 값 하나에서 여러 속성을 업데이트할 수 있습니다.

다음 팩터리 메서드 중 하나를 호출하여 인스턴스 ValueAnimator 를 가져옵니다.

ValueAnimator.OfInt
ValueAnimator.OfFloat
ValueAnimator.OfObject

이 작업이 완료되면 인스턴스의 ValueAnimator 기간이 설정되어야 하며, 그런 다음 시작할 수 있습니다. 다음 예제에서는 1000밀리초 동안 0에서 1까지의 값에 애니메이션 효과를 적용하는 방법을 보여 줍니다.

ValueAnimator animator = ValueAnimator.OfInt(0, 100);
animator.SetDuration(1000);
animator.Start();

하지만 위의 코드 조각은 그다지 유용하지 않습니다. 애니메이터가 실행되지만 업데이트된 값에 대한 대상은 없습니다. 클래스는 Animator 수신기에 새 값을 알릴 필요가 있다고 결정할 때 Update 이벤트를 발생합니다. 애플리케이션은 다음 코드 조각과 같이 이 이벤트에 응답하는 이벤트 처리기를 제공할 수 있습니다.

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

animator.Update += (object sender, ValueAnimator.AnimatorUpdateEventArgs e) =>
{
    int newValue = (int) e.Animation.AnimatedValue;
    // Apply this new value to the object being animated.
    myObj.SomeIntegerValue = newValue;
};

이제 이해했으므로 ValueAnimator.에 대해 자세히 알아보겠습니다 ObjectAnimator.

ObjectAnimator 사용

ObjectAnimator는 이벤트 처리기를 연결하는 데 필요한 논리와 타이밍 엔진 및 값 계산 ValueAnimator 을 결합하는 하위 클래스 ViewAnimator 입니다. ValueAnimator 애플리케이션이 이벤트 처리기를 ObjectAnimator 명시적으로 연결해야 합니다. 이 단계를 처리합니다.

API는 API ObjectAnimator for ViewAnimator와 매우 유사하지만 업데이트할 속성의 이름과 개체를 제공해야 합니다. 다음 예제에서는 다음을 사용하는 ObjectAnimator예제를 보여줍니다.

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

ObjectAnimator animator = ObjectAnimator.OfFloat(myObj, "SomeIntegerValue", 0, 100);
animator.SetDuration(1000);
animator.Start();

이전 코드 조각 ObjectAnimator 에서 볼 수 있듯이 개체에 애니메이션 효과를 주는 데 필요한 코드를 줄이고 간소화할 수 있습니다.

그리기 가능한 애니메이션

최종 애니메이션 API는 그리기 가능한 애니메이션 API입니다. 그리기 가능한 애니메이션은 일련의 그리기 가능한 리소스를 차례로 로드하고 대칭 이동 만화와 유사하게 순차적으로 표시합니다.

그리기 가능한 리소스는 요소가 루트 요소로 있고 애니메이션의 각 프레임을 정의하는 일련의 <item> 요소가 있는 XML 파일에 <animation-list> 정의됩니다. 이 XML 파일은 애플리케이션의 /Resource/drawable 폴더에 저장됩니다. 다음 XML은 그리기 가능한 애니메이션의 예입니다.

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@drawable/asteroid01" android:duration="100" />
  <item android:drawable="@drawable/asteroid02" android:duration="100" />
  <item android:drawable="@drawable/asteroid03" android:duration="100" />
  <item android:drawable="@drawable/asteroid04" android:duration="100" />
  <item android:drawable="@drawable/asteroid05" android:duration="100" />
  <item android:drawable="@drawable/asteroid06" android:duration="100" />
</animation-list>

이 애니메이션은 6개의 프레임을 통해 실행됩니다. 이 특성은 android:duration 각 프레임이 표시되는 기간을 선언합니다. 다음 코드 조각은 그리기 가능한 애니메이션을 만들고 사용자가 화면에서 단추를 클릭할 때 시작하는 예제를 보여 줍니다.

AnimationDrawable _asteroidDrawable;

protected override void OnCreate(Bundle bundle)
{
    base.OnCreate(bundle);
    SetContentView(Resource.Layout.Main);

    _asteroidDrawable = (Android.Graphics.Drawables.AnimationDrawable)
    Resources.GetDrawable(Resource.Drawable.spinning_asteroid);

    ImageView asteroidImage = FindViewById<ImageView>(Resource.Id.imageView2);
    asteroidImage.SetImageDrawable((Android.Graphics.Drawables.Drawable) _asteroidDrawable);

    Button asteroidButton = FindViewById<Button>(Resource.Id.spinAsteroid);
    asteroidButton.Click += (sender, e) =>
    {
        _asteroidDrawable.Start();
    };
}

이 시점에서 Android 애플리케이션에서 사용할 수 있는 애니메이션 API의 기초를 다루었습니다.

요약

이 문서에서는 Android 애플리케이션에 그래픽을 추가하는 데 도움이 되는 많은 새로운 개념과 API를 소개했습니다. 먼저 다양한 2D 그래픽 API에 대해 설명하고 Android에서 Canvas 개체를 사용하여 애플리케이션이 화면에 직접 그릴 수 있도록 하는 방법을 설명했습니다. 또한 XML 파일을 사용하여 그래픽을 선언적으로 만들 수 있는 몇 가지 대체 기술도 확인했습니다. 그런 다음 Android에서 애니메이션을 만들기 위한 이전 및 새 API에 대해 논의했습니다.

다음을 통해 공유

Android 그래픽 및 애니메이션

개요

접근성

2D 그래픽

그리기 가능한 리소스

그리기 가능한 예제

캔버스 그리기 API 사용

Canvas API를 사용하여 그리기

애니메이션

애니메이션 보기

속성 애니메이션

ValueAnimator 사용

ObjectAnimator 사용

그리기 가능한 애니메이션

요약

추가 리소스

다음을 통해 공유

Android 그래픽 및 애니메이션

개요

접근성

2D 그래픽

그리기 가능한 리소스

그리기 가능한 예제

캔버스 그리기 API 사용

Canvas API를 사용하여 그리기

애니메이션

애니메이션 보기

속성 애니메이션

ValueAnimator 사용

ObjectAnimator 사용

그리기 가능한 애니메이션

요약

관련 링크

추가 리소스