Open Source

Kkwaenggwari · Open source

Majhen po velikosti.Močan po zvenu.

Odprtokodna orodja za stanje in gibanje v Reactu in React Nativu. Trije osredotočeni paketi, ki delujejo od prvega uvoza in rastejo le toliko, kolikor potrebujete.

Raziščite orodja GitHub
  • 3 paketi
  • React · React Native
  • Deklaracije TypeScript
  • Licenca ISC

Udarite na gong. Vsako orodje se na zven odzove po svoje.

01 · Orodja

Trije instrumenti.En ritem.

Vsako opravi eno nalogo do konca. Uporabljajte jih posamič ali skupaj — narejena so, da se ujemajo.

restate

StanjeReact + React Native

Delite ga z enim hookom.Shranite ga, ko se odločite.

Komponente berejo isto vrednost brez Providerja, actionov in reducerjev. Znova se upodobijo le, ko se spremeni njihov izbor, shranjevanje in obnova pa potekata natanko takrat, ko rečete.

  • Skupno brez Providerja
  • Naročnina le na izbrani del
  • Izrecno shranjevanje v IndexedDB ali MMKV
Namestitev
npm install @kkwaenggwari/restate
Odpri spletno mesto Oglejte si izvorno kodo

V živo

Dve komponenti, en store

Pritisnite gumb na kateri koli strani. Obe plošči bereta isto vrednost restate() in se spreminjata skupaj; oznaka dostave posluša le en izbor.

Glava

2 v košarici

Seznam izdelkov

2 v košarici

Animated

Pogon gibanjaReact DOM

Ena vrednostdirigira celemu zaslonu.

V React DOM uporabljajte timing, spring in interpolate, ki jih poznate iz React Native Animated. Ena vrednost upravlja slog številnih elementov brez upodabljanja Reacta v vsaki sličici.

  • React Native Animated API, ki ga poznate
  • Prekinitve ohranijo položaj in hitrost
  • Pospravi za sabo, ko lastnik izgine
Namestitev
npm install @kkwaenggwari/animated
Odpri spletno mesto Oglejte si izvorno kodo

V živo

Ena Value, dvanajst oblik

Drsnik spremeni eno samo Value. Položaj, zasuk, velikost in vogali vseh dvanajstih oblik izhajajo iz nje. Pritisnite vzmet, nato pa sredi gibanja primite drsnik.

Animated Chorus

Pripravljene komponenteReact · React Native

Zahtevne interakcije,že pripravljene.

Vrteča se števila, poudarek, ki potuje, seznami, ki premaknejo le spremenjeno, sheeti in dejanja s potegom. Podajte svoje podatke — brez providerja in klica za nastavitev — v Reactu in React Nativu.

  • Števila, zavihki, seznami in sheeti
  • Isti uvoz na spletu in v domorodnih aplikacijah
  • Nov vnos nadaljuje od tistega, kar je na zaslonu
Namestitev
npm install @kkwaenggwari/animated-chorus @kkwaenggwari/animated
Odpri spletno mesto Oglejte si izvorno kodo

V živo

Nadzorna plošča, ki potrebuje le podatke

Izberite obdobje: MotionHighlight se premakne nanj, MotionNumber se zavrti, ProgressRing se napolni, MotionList pa premakne le vrstice, ki so se spremenile.

DanesTa tedenTa mesec

Obiski

1,284

  1. Domov
  2. Cene
  3. Docs
  4. Blog

Vzorčni podatki

02 · Ansambel

En udarec.Vse se premika.

Ta prizor je zgrajen z Animated. Ena sama Value z napredkom drsenja hkrati dirigira položaju, zasuku, merilu in prosojnosti 48 oblik.

  1. 01
    Zven

    Razpršene točke se zberejo v obroče gonga.

  2. 02
    Razcep

    Obroč se razdeli na tri in prevzame barvo vsakega orodja.

  3. 03
    Oblika

    Postanejo povezave stanja, tir gibanja in stebri zbora.

  4. 04
    Ritem

    Vse se poravna in pade na isti udarec.

progress1.00

03 · Načela

Majhenod začetka do konca.

Začnite z enim uvozom

Brez ovijajočega providerja in globalne nastavitve vnaprej. Zmožnosti dodajte šele, ko jih aplikacija zahteva.

Le tisto, kar je potrebno

Posodobijo se le komponente, katerih izbor se je spremenil, elementi, ki uporabljajo vrednost, in vrstice, ki so se premaknile.

Odgovoren do konca

Prekinjeno gibanje nadaljuje od tistega, kar je na zaslonu, naročnine in animacije pa se sprostijo, ko njihov lastnik izgine.

Tipiziran in dokumentiran

Vsak paket vsebuje deklaracije TypeScript, dokumentacija pa je na voljo v 39 jezikih.

04 · Ime

Kkwaenggwari,gong, ki vodi zasedbo.

Izgovori se »kveng-gva-ri«. V korejskem pungmulu vodilni igralec kkwaenggwarija (꽹과리) določa ritem vsemu ansamblu. Naša orodja si prizadevajo za isto: majhna, a jasna, da vsa vaša aplikacija teče v enem ritmu.

kkwaenggwariKkwaenggwari je dobil ime po kkwaenggwariju (꽹과리), majhnem korejskem gongu, v katerega se udarja s tolkalom. Njegov jasen, svetel zven je dal ime tem majhnim odprtokodnim orodjem.