Documentation

에셋 — Lottie·비디오·오디오

이미지·Lottie 애니메이션·비디오·오디오를 프로젝트에 담아 사용하기

3 min read

Assets 탭은 앱이 사용하는 모든 리소스의 보관함입니다. 이미지에 더해 Lottie 애니메이션 · 비디오 · 오디오를 가져오고, 목록에서 바로 미리보기/재생해 볼 수 있습니다. 한 번 가져온 에셋은 프로젝트 어디에서든 사용할 수 있습니다.

가져오기

  • Assets 탭의 + 메뉴 또는 파일 드래그 & 드롭으로 추가합니다.
  • 지원 형식 — 이미지(PNG·JPEG·GIF 등), Lottie(JSON), 비디오(MP4 등), 오디오(M4A 등). GIF 는 원본 형식 그대로 보존됩니다.
  • 에셋은 문서 패키지 안에 저장되어, 프로젝트를 공유하면 함께 이동합니다.

Lottie

Lottie 컴포넌트는 벡터 애니메이션을 재생합니다. 자동 재생·반복을 설정하고, Action FlowLottie Control 액션으로 재생/정지/소스 변경을 제어합니다.

비디오

Video 컴포넌트는 커스텀 재생 컨트롤 오버레이를 갖춘 플레이어입니다.

  • 자동 재생 · 반복 · 음소거 · 컨트롤 표시를 설정할 수 있습니다.
  • 소스는 프로젝트 에셋 또는 원격 URL — URL 문자열 데이터를 바인딩하면 데이터에 따라 다른 영상을 재생합니다(이미지와 동일한 방식).
  • Video Control 액션으로 재생/일시정지/정지/소스 변경을 제어합니다.

소리가 나는 재생을 시작할 때만 오디오 세션을 사용하므로, 편집 중에는 듣고 있던 음악이 끊기지 않습니다.

오디오

오디오 에셋은 Action Flow 에서 재생해 효과음이나 배경 사운드로 사용합니다.

비디오·Lottie 의 소스를 데이터에 바인딩하면, API 응답에 담긴 미디어 URL 을 그대로 재생하는 화면을 만들 수 있습니다. 템플릿 갤러리의 Media Search 가 이 패턴의 완성 예제입니다.