lottietoqml 예제

이 예에서는 lottietoqml 도구를 사용하여 로티 파일을 QML로 변환한 다음 애플리케이션에서 이를 사용하는 방법을 보여줍니다.

개요

이 예제는 lottietoqml을 사용하여 변환된 9개의 벡터 애니메이션으로 구성되어 있습니다. 애니메이션은 전체 화면 애플리케이션 창에 그리드 형태로 표시됩니다.

사용자가 애니메이션 이미지 중 하나를 클릭하면 해당 이미지가 확대되어 화면을 가득 채웁니다. 이미지는 벡터 기반이므로 스케일링 아티팩트 없이 선명하게 유지됩니다.

로티에토큐ML은.SVG 파일에 대해 svgtoqml이 하는 것과 동일한 작업을 수행합니다. 원본 벡터 이미지와 애니메이션을 가능한 한 많이 변환하여 Qt Quick Shapes 및 기타 Qt Quick 컴포넌트로 변환합니다. 그 결과 완전히 확장 가능한 하드웨어 가속 애니메이션 렌더링이 생성됩니다.

편의를 위해 VectorImage 컴포넌트를 통해 런타임에 로티 파일을 로드할 수도 있습니다. 그러나 일반적으로 QML 파일을 미리 생성하는 것이 더 빠른 로딩을 위해 QML 씬을 사전 처리할 수 있으므로 선호됩니다.

자산

이 예시에는 무료 애니메이션의 Lottiefiles 목록에서 다운로드한 애니메이션 벡터 이미지가 포함되어 있습니다. 모든 이미지는 로티 심플 라이선스에 따라 라이선스가 부여됩니다.

• Solitudinem의 "지문 아이콘"
• Jeffrey Christopher의 "Google 아이콘"
• Natalia Świerz의 "해피 스타"
• Sarpreet Kalyan의 "하트비트 | 의료"
• Hizen의 "놀란 소년"
• 마리나 트라즈코브스카의 "외곽선이 파란색인 미국 지도"
• 마헨드라 분왈의 "사용자 상호작용"
• 바시르 아마드의 "사용자 인터페이스"
• 무사 아다누르의 "사용자 인증"

예제 프로젝트 @ code.qt.io