spring() 및 tweened() 저장소

Svelte는 동작을 지원하는 스토어를 제공합니다. tweened는 시간 기반이고 spring은 물리 기반입니다.

svelte/motion에서 가져옵니다.

초기 값과 duration, easing 같은 옵션을 전달합니다.

set() 또는 update()를 호출하면 스토어가 값 사이를 자동으로 애니메이션 처리합니다.

spring 스토어에는 물리 동작을 위한 stiffness 및 damping 옵션이 있습니다.

구성 요소에서 다른 스토어와 동일한 방식으로 사용합니다.

두 스토어 모두 숫자와 중첩된 숫자 속성을 포함하는 형태를 보간합니다.

색상처럼 숫자가 아닌 값을 처리하려면 사용자 지정 interpolate 함수를 전달합니다.

애니메이션 없이 즉시 이동하려면 spring.set(value, { hard: true })를 호출합니다.

마우스 추적, 드래그, 스크롤 기반 사용자 인터페이스, 게이지, 진행률 표시줄에 사용할 수 있습니다.

부드러운 동작을 위해 애니메이션 값을 style="transform: ..."에 적용합니다.

물리적인 동작을 제공하는 스토어는 무엇입니까?

svelte/motion의 tweened와 spring은 숫자 값을 부드럽게 애니메이션 처리합니다.