Narzędzia open source do stanu i animacji dla React i React Native. Trzy wyspecjalizowane pakiety, które działają od pierwszego importu i rosną tylko tak bardzo, jak potrzebujesz.
Udostępnij jednym hookiem.Zapisz, kiedy zdecydujesz.
Komponenty odczytują tę samą wartość bez Providera, akcji i reducerów. Renderują się ponownie tylko wtedy, gdy zmienia się ich wybór, a zapis i przywracanie dzieją się dokładnie wtedy, gdy powiesz.
Naciśnij przycisk po dowolnej stronie. Oba panele odczytują tę samą wartość restate() i zmieniają się razem; plakietka wysyłki słucha tylko jednego wyboru.
Używaj w React DOM znanych z React Native Animated timing, spring i interpolate. Jedna wartość steruje stylem wielu elementów bez renderu React w każdej klatce.
Suwak zmienia jedno Value. Pozycja, obrót, rozmiar i narożniki wszystkich dwunastu kształtów wynikają z niego. Naciśnij sprężynę, a potem złap suwak w połowie ruchu.
Przewijane liczby, wędrujące wyróżnienie, listy, które przesuwają tylko to, co się zmieniło, arkusze i akcje przesunięciem. Przekaż swoje dane — bez providera i wywołań konfiguracji — w React i React Native.
Liczby, karty, listy i arkusze
Ten sam import w sieci i w aplikacjach natywnych
Nowe dane wejściowe kontynuują od tego, co na ekranie
Wybierz okres: MotionHighlight przesuwa się do niego, MotionNumber się przewija, ProgressRing się wypełnia, a MotionList przesuwa tylko zmienione wiersze.
DziśTen tydzieńTen miesiąc
Odwiedziny
1,284
Start
Cennik
Docs
Blog
Przykładowe dane
02 · Zespół
Jedno uderzenie.Wszystko w ruchu.
Ta scena jest zbudowana z Animated. Jedno Value z postępem przewijania dyryguje naraz pozycją, obrotem, skalą i przezroczystością 48 kształtów.
01
Dźwięk
Rozproszone punkty zbierają się w pierścienie gongu.
02
Podział
Pierścień dzieli się na trzy i przyjmuje kolor każdego narzędzia.
03
Kształt
Stają się połączeniami stanu, trajektorią ruchu i filarami chóru.
04
Rytm
Wszystko się ustawia i trafia w to samo uderzenie.
progress
03 · Zasady
Małyod początku do końca.
Zacznij od jednego importu
Żadnego otaczającego providera ani globalnej konfiguracji na start. Dodawaj możliwości dopiero, gdy aplikacja ich potrzebuje.
Tylko to, co trzeba
Aktualizowane są tylko komponenty, których wybór się zmienił, elementy używające wartości i wiersze, które się przesunęły.
Odpowiedzialny do końca
Przerwany ruch kontynuuje od tego, co na ekranie, a subskrypcje i animacje są zwalniane, gdy znika ich właściciel.
Typowany i udokumentowany
Każdy pakiet zawiera deklaracje TypeScript, a dokumentacja jest dostępna w 39 językach.
04 · Nazwa
Kkwaenggwari —gong, który prowadzi zespół.
Wymawia się „kkwen-gwa-ri”. W koreańskim pungmul prowadzący gracz na kkwaenggwari (꽹과리) wyznacza rytm całemu zespołowi. Nasze narzędzia dążą do tego samego: małe, ale wyraźne, by cała aplikacja grała w jednym rytmie.
kkwaenggwariNazwa Kkwaenggwari pochodzi od kkwaenggwari (꽹과리) — małego koreańskiego gongu, w który uderza się pałką. Jego jasny, czysty dźwięk podsunął nazwę tym małym narzędziom open source.