Lottie-nézegető
Ingyenes online Lottie-lejátszó. Nyisson meg bármilyen Lottie JSON animációt, játssza le, léptessen képkockánként, módosítsa a sebességet, kapcsolja a hurkolást és ellenőrizze átlátszó sakktábla-háttéren — teljesen a böngészőben.
Mi az a Lottie fájl?
A Lottie fájl egy vektoros animáció JSON-exportja, amelyet általában After Effectsben készítenek a Bodymovin beépülővel vagy LottieFiles-szerű eszközökkel. Az appok és weboldalak könnyű rendererrel játsszák le videó helyett: a fájl pici, és minden méretben tökéletes marad.
Hogyan nézhetek meg itt egy Lottie animációt?
Kattintson a feltöltő területre, vagy húzza rá a .json fájlját. Az animáció azonnal betölt és elindul. A példa gombbal beépített mintán is kipróbálhatja a lejátszót.
Feltöltésre kerül az animációm szerverre?
Nem. A fájl teljesen a böngésző fülön belül olvasódik és renderelődik. Semmi nem kerül továbbításra, így közzé nem tett ügyfelmunkákhoz és bizalmas anyagokhoz is biztonságos.
Milyen lejátszásvezérlők vannak?
Lejátszás és szünet, újraindító gomb, ismétlés be/ki, húzható képkocka-csúszka és 0,25x–2x sebességválasztó. A kijelzés mutatja az aktuális képkockát, az összesítőt és az animáció képkockasebességét.
Miért van sakktábla-háttér?
A sakktábla az átlátszóságot jelzi, akárcsak a tervezőeszközökben. Ezzel ellenőrizheti, hogy az animáción nincs-e nem kívánt háttér; fehérre vagy feketére váltva világos és sötét felületen nézheti meg az éleket, ragyogást és árnyékokat.
Melyik Lottie-verziók támogatottak?
A lejátszó a lottie-web renderert használja, amely a 4. verziótól támogatja a Bodymovin JSON-t: alakrétegek, maszkok, matték, trim path-ok és a legtöbb exportkor beégetett kifejezés.
Működik mobilon?
Igen. Az elrendezés reszponzív, és a renderelés ugyanazzal az SVG-motorral történik, így iOS- és Android-böngészőben is fut. A vezérlők érintőbarát méretűek.
Mi a különbség a .json és a .lottie között?
A .lottie (dotLottie) tömörített zip, amely a JSON-t együtt tartalmazhatja erőforrásokkal. Ez a nézegető a szabványos Lottie .json exportot nyitja meg közvetlenül; dotLottie fájlnál előbb csomagolja ki belőle a .json-t.
Miért lassú az animációm, vagy hibásan jelenik meg?
A sok réteget, képet vagy kifejezést tartalmazó animációk renderelése nehéz. Ellenőrizze, hogy a képek nem külön exportálódtak-e, egyszerűsítse a kompozíciót vagy csökkentse a sebességet — az FPS-kijelzés az animáció tervezett sebességét mutatja.
A(z) Lottie-nézegető használata
Ez a Lottie-nézegető a lottie-web renderelővel teljesen a böngészőjében játssza le a Bodymovin JSON animációkat. Töltsön be egy fájlt vagy húzza bele, képkockánként vezérelje a lejátszást, és átlátszó, fehér vagy fekete háttéren nézze meg — semmi nem kerül feltöltésre.
- Kattintson a feltöltési területre, vagy húzzon rá egy Lottie .json fájlt; az animáció betöltődik és azonnal elindul.
- A lejátszást a nagy lejátszás/szünet gombbal és az újraindítás gombbal vezérelheti.
- Húzza a képkocka-csúszkát, hogy bármelyik képkockára ugorjon; a kijelző az aktuális képkockát, az összesített számot és az FPS-t mutatja.
- Válasszon 0,25x és 2x közötti sebességet, és a hurkolás gombbal állítsa be a folyamatos ismétlést.
- Váltsa a hátteret átlátszó sakktábla, fehér és fekete között, hogy ellenőrizze az éleket, fényudvarokat és árnyékokat.
Saját animáció betöltése előtt nyomja meg a példa gombot, és nézze meg, hogyan viselkedik a lejátszó — hasznos, ha egy ügyfél JSON-t küld és gyors ellenőrzés kell.
Kapcsolódó eszközök
- SVG Megtekintő és Szerkesztő SVG fájlok előnézete, szerkesztése és optimalizálása online. Élő előnézet, kódszerkesztés és optimalizáló eszközök.
- JSON fa nézegető A JSON adatokat interaktív, összecsukható faként vizualizálja. Keressen kulcsokat és értékeket, kövesse a JSONPath-et az egér felülvitelével, és kezelje a nagy fájlokat lusta betöltéssel. Támogatja a .json fájlok húzd-és-ejtsd funkcióját.
- Sprite Sheet Generátor Egyesítse a képeket sprite sheet-té húzással való átrendezéssel, rács elrendezéssel, kitöltéssel, méretezési módokkal. Exportálja PNG/WebP/JPG-ként JSON atlas adatokkal játékmotorokhoz és CSS-hez.
- Kép Base64-be Képek konvertálása Base64 karakterláncokká és Base64 dekódolása vissza képekké. Támogatja a PNG, JPG, GIF, WebP, SVG, BMP, ICO formátumokat. 100% böngészőben, nincs feltöltés.
- GIF Képkocka Bontás Egyedi képkockák kinyerése és letöltése GIF animációkból PNG vagy sprite lapként. Ingyenes online eszköz előnézettel és ZIP exportálással.
- GIF Visszafelé GIF animáció lejátszási sorrendjének megfordítása ingyen online. Töltsön fel, előnézzen és töltsön le azonnal.
- GIF Sebességváltó Változtassa meg a GIF animáció sebességét online. Gyorsítsa fel vagy lassítsa le a GIF fájlokat azonnal.
- Videó GIF-be Alakítson át videót animált GIF-be online. Állítsa be a minőséget, képkockasebességet és felbontást közvetlenül a böngészőben, feltöltés nélkül.