Open-source tools voor state en beweging in React en React Native. Drie gerichte pakketten die werken vanaf de eerste import en alleen zo ver groeien als jij nodig hebt.
Deel het met één hook.Sla het op wanneer jij besluit.
Componenten lezen dezelfde waarde zonder Provider, actions of reducers. Ze renderen alleen opnieuw als hun selectie verandert, en opslaan of terugzetten gebeurt precies wanneer jij het zegt.
Druk aan een van beide kanten op een knop. Beide panelen lezen dezelfde restate()-waarde en veranderen samen; het verzendlabel luistert alleen naar één selectie.
Gebruik in React DOM de timing, spring en interpolate die je kent van React Native Animated. Eén waarde stuurt de stijl van veel elementen aan, zonder React-render per frame.
De schuifregelaar verandert één Value. Positie, draaiing, grootte en hoeken van alle twaalf vormen volgen daaruit. Druk op de veer en pak dan midden in de beweging de schuifregelaar.
Rollende getallen, een markering die meeverhuist, lijsten die alleen bewegen wat veranderde, sheets en veegacties. Geef je data mee — geen provider of setup-aanroep — in React en React Native.
Getallen, tabs, lijsten en sheets
Dezelfde import op web en native
Nieuwe invoer gaat verder vanaf wat op het scherm staat
Kies een periode: MotionHighlight verhuist ernaartoe, MotionNumber rolt, ProgressRing vult zich en MotionList beweegt alleen de rijen die veranderden.
VandaagDeze weekDeze maand
Bezoeken
1,284
Home
Prijzen
Docs
Blog
Voorbeelddata
02 · Ensemble
Eén slag.Alles beweegt.
Dit podium is gebouwd met Animated. Eén Value met je scrollvoortgang dirigeert tegelijk de positie, draaiing, schaal en dekking van 48 vormen.
01
Klinken
Verspreide punten komen samen in de ringen van een gong.
02
Splitsen
De ring splitst zich in drieën en neemt de kleur van elke tool aan.
03
Vormen
Ze worden de verbindingen van state, de baan van beweging en de pilaren van het koor.
04
Maat
Alles lijnt uit en valt op dezelfde tel.
progress
03 · Principes
Klein,van begin tot eind.
Begin met één import
Geen omhullende provider of globale setup vooraf. Voeg mogelijkheden pas toe als je app erom vraagt.
Alleen wat nodig is
Alleen componenten waarvan de selectie veranderde, elementen die een waarde gebruiken en rijen die verschoven, worden bijgewerkt.
Verantwoordelijk tot het eind
Onderbroken beweging gaat verder vanaf wat op het scherm staat, en abonnementen en animaties worden vrijgegeven als hun eigenaar verdwijnt.
Getypeerd en gedocumenteerd
Elk pakket bevat TypeScript-declaraties, en de documentatie is beschikbaar in 39 talen.
04 · De naam
Kkwaenggwari,de gong die de band aanvoert.
Spreek het uit als „kweng-gwa-rie”. In de Koreaanse pungmul geeft de leidende kkwaenggwari-speler (꽹과리) de maat aan voor het hele ensemble. Onze tools streven hetzelfde na: klein maar helder, zodat je hele app op één maat loopt.
kkwaenggwariKkwaenggwari dankt zijn naam aan de kkwaenggwari (꽹과리), een kleine Koreaanse gong die je met een stokje bespeelt. Zijn heldere, felle klank inspireerde de naam van deze kleine open-source tools.