Lottie

Lottie 是 Airbnb 开源的一套跨平台的完整的动画效果解决方案,设计师可以使用 Adobe After Effects 设计出漂亮的动画之后,使用 Lottic 提供的 Bodymovin 插件将设计好的动画导出成 JSON 格式,就可以直接运用在 iOS、Android、Web 和 React Native之上,无需其他额外操作。

点击查看详细

注意: QuickTVUI lottie 暂时只支持 json 格式动画文件。

API

Attributes

NameDescriptionTypeDefault
rawResourcestring-
fileNamestring-
localResourcestring-
urlstring-
fallbackResourcestring-
autoPlayboolean-
loopboolean-
repeatModenumber-
repeatCountnumber0
speedstring-
clipToCompositionBoundsbooleanfalse
defaultFontFileExtensionstring-
imageAssetsFolderstring-
progressstring-
enableMergePathsForKitKatAndAbovebooleanfalse
colorFilterstring-
renderModenumber0
asyncUpdatesnumber0
ignoreDisabledSystemAnimationsbooleanfalse
useCompositionFrameRatebooleanfalse
cacheCompositionbooleanfalse
animationListenerStatebooleanfalse
animationUpdateStatebooleanfalse

Events

NameDescriptionType
onAnimationEnd动画结束事件Function
onAnimationCancel动画取消事件Function
onAnimationStart动画开始事件Function
onAnimationRepeat动画重复执行事件Function
onAnimationPause动画暂停事件Function
onAnimationResume动画恢复事件Function
onAnimationUpdate动画更新事件Function

Slots

NameDescription
default自定义默认内容

Exposes

NameDescriptionType
loadRawFunction
loadFileFunction
loadUrlFunction
loadCacheUrlFunction
setFallbackResourceFunction
setAutoPlayFunction
setLottieLoopFunction
setRepeatModeFunction
setRepeatCountFunction
setSpeedFunction
setClipToCompositionBoundsFunction
setDefaultFontFileExtensionFunction
setImageAssetsFolderFunction
setProgressFunction
enableMergePathsForKitKatAndAboveFunction
setColorFilterFunction
setRenderModeFunction
setAsyncUpdateFunction
setIgnoreDisabledSystemAnimationsFunction
setUseCompositionFrameRateFunction
playAnimationFunction
resumeAnimationFunction
pauseAnimationFunction
cancelAnimationFunction
cacheCompositionFunction
removeAllListenerFunction

Source

Docs