Verktyg med öppen källkod för state och rörelse i React och React Native. Tre fokuserade paket som fungerar från första importen och bara växer så långt du behöver.
Komponenter läser samma värde utan Provider, actions eller reducers. De renderas om bara när deras urval ändras, och sparande och återställning sker precis när du säger till.
Använd timing, spring och interpolate som du känner från React Native Animated i React DOM. Ett värde styr stilen på många element, utan React-rendering per bildruta.
Reglaget ändrar ett enda Value. Position, vridning, storlek och hörn för alla tolv former härleds från det. Tryck på fjädern och ta sedan tag i reglaget mitt i rörelsen.
Rullande siffror, en markering som flyttar sig, listor som bara rör det som ändrats, sheets och svepåtgärder. Skicka in din data — ingen provider eller setup-anrop — i React och React Native.
Siffror, flikar, listor och sheets
Samma import på webb och native
Ny inmatning fortsätter från det som syns på skärmen
Välj en period: MotionHighlight flyttar dit, MotionNumber rullar, ProgressRing fylls och MotionList flyttar bara de rader som ändrats.
IdagDen här veckanDen här månaden
Besök
1,284
Start
Priser
Docs
Blogg
Exempeldata
02 · Ensemble
Ett slag.Allt rör sig.
Den här scenen är byggd med Animated. Ett enda Value med scrollförloppet dirigerar samtidigt position, vridning, skala och opacitet för 48 former.
01
Klinga
Utspridda punkter samlas till en gongs ringar.
02
Dela
Ringen delar sig i tre och får varje verktygs färg.
03
Forma
De blir länkarna i state, rörelsens bana och körens pelare.
04
Takt
Allt ställer upp sig och landar på samma slag.
progress
03 · Principer
Liten,hela vägen.
Börja med en import
Ingen omslutande provider eller global setup i förväg. Lägg till förmågor först när appen ber om dem.
Bara det som behövs
Bara komponenter vars urval ändrats, element som använder ett värde och rader som flyttats uppdateras.
Ansvarsfull till slutet
Avbruten rörelse fortsätter från det som syns på skärmen, och prenumerationer och animationer släpps när deras ägare försvinner.
Typat och dokumenterat
Varje paket levereras med TypeScript-deklarationer, och dokumentationen finns på 39 språk.
04 · Namnet
Kkwaenggwari,gongen som leder bandet.
Uttalas ”kveng-gwa-ri”. I koreansk pungmul anger den ledande kkwaenggwari-spelaren (꽹과리) takten för hela ensemblen. Våra verktyg strävar efter samma sak: små men tydliga, så att hela din app går i samma takt.
kkwaenggwariKkwaenggwari har fått sitt namn efter kkwaenggwari (꽹과리), en liten koreansk gong som man slår med en klubba. Dess klara, ljusa klang gav namnet åt de här små verktygen med öppen källkod.