플러터에서 Lottie 애니메이션을 사용하면 앱에 멋진 동적 요소를 추가할 수 있습니다. 하지만 기본적으로 Lottie 애니메이션은 한 번만 재생됩니다. 이번 글에서는 플러터에서 Lottie 애니메이션을 반복해서 재생하는 방법을 알아보겠습니다.
1. Lottie 애니메이션 패키지 추가하기
먼저, pubspec.yaml 파일에 Lottie 애니메이션을 사용하기 위한 패키지를 추가해야 합니다. lottie
패키지를 사용하겠습니다. 아래와 같이 dependencies
섹션에 패키지를 추가해주세요.
dependencies:
flutter:
sdk: flutter
lottie: ^1.1.0
설정이 완료되면 패키지를 가져와서 사용할 수 있습니다. 다음과 같이 main.dart
파일 상단에 lottie
패키지를 가져옵니다.
import 'package:flutter/material.dart';
import 'package:lottie/lottie.dart';
2. 반복 설정하기
Lottie 애니메이션을 반복해서 재생하기 위해서는 Lottie.asset
위젯의 repeat
속성을 사용해야 합니다. 이 속성을 true
로 설정하면 애니메이션이 무한히 반복됩니다.
아래는 예시 코드입니다.
class LottieAnimation extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Lottie.asset(
'assets/animations/loading.json',
repeat: true, // 반복 설정
width: 200,
height: 200,
);
}
}
위 코드에서 Lottie.asset
위젯의 repeat
속성을 true
로 설정하면 해당 Lottie 애니메이션이 무한히 반복하여 재생됩니다. 필요에 따라 애니메이션의 크기를 조정할 수도 있습니다.
3. 결과 확인하기
위의 코드를 작성하고 실행하면 Lottie 애니메이션이 계속해서 반복되어 재생됩니다. 이제 앱에서 Lottie 애니메이션을 원하는대로 반복하여 사용할 수 있습니다.
결론
플러터에서 Lottie 애니메이션을 반복해서 재생하기 위해서는 Lottie.asset
위젯의 repeat
속성을 true
로 설정하면 됩니다. 이를 통해 앱에 동적이고 반복적인 애니메이션 요소를 쉽게 추가할 수 있습니다.