Mets Perijs no Framer un es ieskatāmies React animācijas bibliotēkā Framer Motion.
Pirmkārt, mēs aplūkojam, cik vienkārša ir API. Jūs visu ļoti kontrolējat, izmantojot sava JSX elementu rekvizītus. Animācijas vadīšana šajā slānī ir ļoti intuitīva un jēgpilnā veidā savienota ar lietotāja interfeisu un stāvokli.
Katrs mūsu aplūkotais piemērs ir reālāks un ietver vairāk iezīmju, ko Framer Motion spēj. React izstrādātājiem patiks tā visa sintakse, un visiem pārējiem patiks neticami veiktspējīgi un vienmērīgi rezultāti.
Mēs beidzam aplūkot pašu Framer, kurš iekšēji izmanto šo precīzo bibliotēku, lai veiktu visas animācijas darbības, ko Framer dara. Vai jūs interesē Framer? Lejupielādējiet Framer X.
1. demonstrācija: Pamata sintakse
2. demonstrācija: varianti
3. demonstrācija: AnimatePresence un layoutTransition
Bonuss: pārbaudiet attēla uznirstošajā funkcijā “ritināt, lai noraidītu”.