Animation QML Type (Uncreatable)

모든 QML 애니메이션의 기초가 됩니다. 더 보기...

참고: 이 타입은 생성할 수 없습니다. QML에서 인스턴스화할 수 없습니다.

• 상속된 멤버를 포함한 모든 멤버 목록

속성

• alwaysRunToEnd : bool
• loops : int
• paused : bool
• running : bool

신호

• finished()
• started()
• stopped()

방법

• void complete()
• void pause()
• void restart()
• void resume()
• void start()
• void stop()

상세 설명

Animation 타입은 QML 파일에서 직접 사용할 수 없습니다. 이 타입은 이를 상속받는 다른 모든 애니메이션 타입에서 사용할 수 있는 공통 속성과 메서드 집합을 제공하기 위해 존재합니다. Animation 타입을 직접 사용하려고 하면 오류가 발생합니다.

속성 설명

alwaysRunToEnd : bool

이 속성은 애니메이션이 중지되었을 때 애니메이션이 끝까지 실행되어야 하는지 여부를 결정합니다.

이 값이 true인 경우, 애니메이션은 running 속성을 false로 설정하거나 stop() 메서드를 호출하여 중지되더라도 현재 반복을 완료합니다. complete() 메서드는 이 값의 영향을 받지 않습니다.

이 동작은 loops 속성이 설정된 경우 가장 유용하며, 이 경우 애니메이션은 정상적으로 재생이 완료되지만 다시 시작되지는 않습니다.

기본적으로 alwaysRunToEnd 속성은 설정되어 있지 않습니다.

loops : int

이 속성은 애니메이션이 재생될 횟수를 지정합니다.

기본적으로 ` loops `는 1로 설정되어 있어, 애니메이션이 한 번 재생된 후 중지됩니다.

Animation.Infinite로 설정하면, running 속성을 false로 설정하거나 stop() 메서드를 호출하여 명시적으로 중지할 때까지 애니메이션이 계속 반복됩니다.

다음 예제에서 사각형은 무한히 회전합니다.

Rectangle {
    width: 100; height: 100; color: "green"
    RotationAnimation on rotation {
        loops: Animation.Infinite
        from: 0
        to: 360
    }
}

paused : bool

이 속성은 애니메이션이 현재 일시 정지되어 있는지 여부를 나타냅니다.

paused 속성을 설정하여 애니메이션이 일시 정지되어 있는지 여부를 선언적으로 제어할 수 있습니다.

또한 JavaScript에서 ` pause() ` 및 ` resume() ` 메서드를 사용하여 애니메이션의 일시 중지 및 재개를 명령형 방식으로 제어할 수도 있습니다.

기본적으로 애니메이션은 일시 정지되지 않습니다.

running : bool

이 속성은 애니메이션이 현재 실행 중인지 여부를 나타냅니다.

running 속성을 설정하여 애니메이션 실행 여부를 선언적으로 제어할 수 있습니다. 다음 예제에서는 MouseArea 키가 눌릴 때마다 사각형에 애니메이션이 적용됩니다.

Rectangle {
    width: 100; height: 100
    NumberAnimation on x {
        running: myMouse.pressed
        from: 0; to: 100
    }
    MouseArea { id: myMouse }
}

마찬가지로, ` running ` 속성을 읽어 애니메이션이 실행 중인지 확인할 수 있습니다. 다음 예제에서는 `Text` 항목이 애니메이션이 실행 중인지 여부를 표시합니다.

NumberAnimation { id: myAnimation }
Text { text: myAnimation.running ? "Animation is running" : "Animation is not running" }

또한 start() 및 stop() 메서드를 사용하여 JavaScript에서 애니메이션의 시작 및 중지를 명령형 방식으로 제어할 수 있습니다.

기본적으로 애니메이션은 실행 중이 아닙니다. 하지만 ‘on’ 구문을 사용하여 애니메이션이 속성의 값 소스로 지정되면, 기본적으로 실행 상태로 설정됩니다.

Signal 문서

finished()

이 신호는 애니메이션이 자연스럽게 종료되었을 때 발생합니다.

running 가 false 로 설정된 경우나, loops 속성이 Animation.Infinite 로 설정된 애니메이션의 경우에는 이 신호가 발생하지 않습니다.

또한, 이 신호는 최상위 수준의 독립형 애니메이션에 대해서만 발생합니다. Behavior나 Transition 내의 애니메이션, 또는 애니메이션 그룹의 일부인 애니메이션에 대해서는 발생하지 않습니다.

alwaysRunToEnd 가 true인 경우, 애니메이션이 현재 반복을 완료할 때까지 이 신호는 발생하지 않습니다.

stopped(), started() 및 running도 참조하십시오 .

started()

이 신호는 애니메이션이 시작될 때 발생합니다.

이 신호는 최상위 수준의 독립형 애니메이션에서만 트리거됩니다. Behaviour나 Transition 내의 애니메이션, 또는 애니메이션 그룹에 속한 애니메이션에서는 트리거되지 않습니다.

stopped()

이 신호는 애니메이션이 끝날 때 발생합니다.

애니메이션이 수동으로 중지되었거나, 끝까지 실행되었을 수 있습니다.

이 신호는 최상위 수준의 독립형 애니메이션에서만 트리거됩니다. Behavior나 Transition 내의 애니메이션, 또는 애니메이션 그룹에 속한 애니메이션에서는 트리거되지 않습니다.

alwaysRunToEnd 가 true인 경우, 애니메이션이 현재 반복을 완료할 때까지 이 신호는 방출되지 않습니다.

메서드 문서

void complete()

애니메이션을 중지하고 최종 속성 값으로 바로 이동합니다.

애니메이션이 실행 중이 아닌 경우, 이 메서드를 호출해도 아무런 효과가 없습니다. ` complete()`를 호출하면 ` running ` 속성은 `false`가 됩니다.

stop() 와 달리, complete() 는 애니메이션을 즉시 끝까지 건너뜁니다. 다음 예제에서,

Rectangle {
    NumberAnimation on x { from: 0; to: 100; duration: 500 }
}

250ms 시점에 stop() 를 호출하면 x 속성의 값이 50이 되는 반면, complete() 를 호출하면 마치 애니메이션이 끝까지 재생된 것처럼 x 속성이 100으로 설정됩니다.

void pause()

애니메이션을 일시 중지합니다.

애니메이션이 이미 일시 정지된 상태이거나 ` running`가 아닌 경우, 이 메서드를 호출해도 아무런 효과가 없습니다. ` pause()`를 호출한 후에는 ` paused ` 속성이 `true`가 됩니다.

void restart()

애니메이션을 다시 시작합니다.

이 메서드는 편의 메서드이며, ` stop() `를 호출한 다음 ` start()`를 호출하는 것과 동일합니다.

void resume()

일시 중지된 애니메이션을 다시 시작합니다.

애니메이션이 일시 정지 상태가 아니거나 ` running` 상태가 아닌 경우, 이 메서드를 호출해도 아무런 효과가 없습니다. ` resume()`를 호출한 후에는 ` paused ` 속성이 `false`가 됩니다.

void start()

애니메이션을 시작합니다.

애니메이션이 이미 실행 중인 경우, 이 메서드를 호출해도 아무런 효과가 없습니다. ` start()`를 호출한 후에는 ` running ` 속성이 `true`가 됩니다.

void stop()

애니메이션을 중지합니다.

애니메이션이 실행 중이 아닌 경우, 이 메서드를 호출해도 아무런 효과가 없습니다. ` stop()`를 호출하면 ` running ` 및 ` paused ` 속성 모두 `false`가 됩니다.

일반적으로 stop() 은 애니메이션을 즉시 중지하며, 애니메이션은 더 이상 속성 값에 영향을 미치지 않습니다. 이 예제에서 애니메이션이

Rectangle {
    NumberAnimation on x { from: 0; to: 100; duration: 500 }
}

이 250ms 시점에 중지되었으므로, x 속성의 값은 50이 됩니다.

그러나 ` alwaysRunToEnd ` 속성이 설정되어 있는 경우, 애니메이션은 완료될 때까지 계속 실행된 후 중지됩니다. 이때 ` running ` 속성은 여전히 즉시 `false`가 됩니다.