퓨즈[Fusetools] 문서[Docs] 번역

  1. Home
  2. 퓨즈[Fusetools] 문서[Docs] 번역
  3. 트리거와 애니메이션
  4. 애니메이터[Animators]

애니메이터[Animators]

Animator 클래스

애니메이터는 트리거가 트리거될 때 요소가 애니메이션으로 표시되는 방식과 방법을 지정하는 데 사용됩니다. 애니메이션의 정확한 결과를 제어하는 데 중요한 세 쌍의 속성이 있습니다.

예제

애니메이터 타입의 예제는 다음 예제에서 사용된 변경(Change) 및 이동(Move)입니다:

1
2
3
4
5
6
<Panel ux:Name="panel1" Color="Blue">
    <WhilePressed>
        <Change panel1.Color="#0f0" Duration="1" />
        <Move X="100" Delay="1" Duration="1" />
    </WhilePressed>
</Panel>

패널에서 포인터를 누를 때 위의 WhilePressed 트리거가 활성화되면 애니메이터는 지연(Delays) 및 기타 속성에 따라 재생됩니다.

Duration/DurationBack

애니메이터는 활성화되는 트리거에 응답하여 요소 및 속성을 애니메이션화하는 데 사용됩니다. 선택할 수 있는 많은 애니메이터가 있으며, 모두 다른 용도로 사용됩니다. 일반적인 애니메이터에는 Move, Rotate, Scale 및 Change가 있습니다. 이 애니메이터는 활성화될 때 앞으로 움직이고 비활성화되면 뒤로 움직이는 반면, Spin 및 Cycle과 같은 일부 애니메이터는 활성화된 상태에서 계속 반복되는 애니메이션을 만듭니다.

Delay/DelayBack

Delay 속성을 설정하면 실제 애니메이션이 그 초만큼 지연됩니다. DelayBack은 역방향 애니메이션에 다른 지연을 설정하는 데 사용됩니다. 애니메이션의 총 재생 시간은 지연 + 재생 시간이 됩니다. 다음 변경 애니메이터의 총 지속 시간은 7 초입니다. 그것은 활성화된 후 5초를 기다린 다음 대상 요소를 2초 이상 움직입니다:

1
<Change Delay="5" Duration="2" someElement.Height="100"/>

Easing/EasingBack

퓨즈에는 미리 정의된 easing 곡선의 표준 세트가 제공됩니다. easing 곡선은 애니메이션이 시간 경과에 따라 어떻게 진행되는지 제어하는 데 사용됩니다. 기본 easing 값은 Linear로 설정됩니다. Linear easing을 사용하면 애니메이션이 전체 시간 동안 동일한 속도로 진행됩니다. 이것은 대개 아주 부자연스럽고 페이크처럼 보입니다. 보다 자연스러운 느낌을 얻기 위해 다음과 같이 QuadraticInOut으로 easing을 변경할 수 있습니다:

1
<Change Easing="QuadraticInOut" Duration="2" someElement.Property="SomeValue"/>

이 애니메이터는 처음에는 천천히, 중간에서는 더 빠르게, 그리고 마지막에는 느리게 진행됩니다.

애니메이터 추적

TrackAnimator 클래스에는 Duration과 정의된 대상 값이 있습니다. easing 곡선 또는 사용자 정의 키 프레임(Keyframes)을 사용하여 애니메이션을 추가로 조정할 수 있습니다.

링크로 대신합니다: https://www.fusetools.com/docs/fuse/animations/animator#track-animators

Open / looping 애니메이터

OpenAnimators 클래스는 무한한 지속 시간을 가지며 일반적으로 활성 상태일 때 반복하거나 영원히 반복합니다.

링크로 대신합니다: https://www.fusetools.com/docs/fuse/animations/animator#open-looping-animators

Animator의 인터페이스

링크로 대신합니다: https://www.fusetools.com/docs/fuse/animations/animator#section-table-of-contents

Was this article helpful to you? Yes No

How can we help?