Vytvořte přehled pohyblivých symbolů nebo atlas textur a exportujte animace pro mobilní aplikace a herní moduly. Pomocí zásuvného modulu importujte atlas textur do modulu Unity nebo do jiného vašeho oblíbeného herního modulu.

Přehled

Animate CC umožňuje vytvořit přehled pohyblivých symbolů nebo atlas textur a exportovat je pro mobilní aplikace a herní moduly. 

Přehled pohyblivých symbolů

Přehled pohyblivých symbolů je soubor bitmapových obrazů, který obsahuje několik menších obrázků uspořádaných jako dlaždice. Kompilací několika grafických souborů do jednoho souboru umožníte aplikaci Animate a dalším používat tuto grafiku, aniž by bylo nutné načítat víc než jeden soubor. Tento efektivní způsob načítání je užitečný v situacích, jako je vývoj her, kdy je kladen zvláštní důraz na rychlost.

Přehled pohyblivých symbolů
Přehled pohyblivých symbolů obsahuje pohyblivé symboly v animaci jednotlivých rámců vedle sebe.

Přehled pohyblivých symbolů můžete vytvořit z výběru libovolné kombinace filmových klipů, symbolů tlačítka, grafických symbolů nebo bitmap. Položky můžete vybírat na panelu Knihovna nebo na ploše, ne však na obou. Každá bitmapa a každý snímek vybraných symbolů se v přehledu pohyblivých symbolů zobrazuje jako samostatný obrázek. Při exportu z plochy zůstanou v obrazovém výstupu zachovány všechny transformace (škálování, zkosení atd.), které jste použili u instance symbolu.

Atlas textur

Atlas textur je kolekce textur ve formátu jednoho velkého obrázku. Atlas textur slouží k optimalizaci her. 

V aplikaci Animate můžete atlas textur vytvořit ze symbolů, jako jsou například filmové klipy, grafické prvky nebo tlačítka. Položky můžete vybírat na panelu Knihovna nebo na ploše, ne však na obou. Každý vektor a každý klíčový snímek vybraných symbolů se v atlasu textur zobrazují jako samostatné bitmapy. Při exportu z plochy zůstanou v obrazovém výstupu zachovány všechny transformace (škálování, zkosení atd.), které jste použili u instance symbolu.

Rozdíl mezi přehledem pohyblivých symbolů a atlasem textur

V závislosti na vašich potřebách můžete ve svých mobilních aplikacích použít přehled pohyblivých symbolů nebo atlas textur. V následující tabulce naleznete některé z klíčových rozdílů mezi přehledem pohyblivých symbolů a atlasem textur. 

Funkce Přehled pohyblivých symbolů Atlas textur
Výkon v mobilních aplikacích Nízký Vysoký
Efektivita v načítání aplikace Vysoká, nejsou potřeba žádné výpočty Nízká, jsou prováděny výpočty souboru JSON
Velikost Zabírá více místa Zabírá méně místa
Kvalita animace Střední Vysoká
Počet generovaných souborů Dvou soubory: jedna bitmapa a jeden soubor json Tři soubory: jedna bitmapa a dva soubory json
Počet generovaných bitmap Podle počtu snímků použitých v přehledu pohyblivých symbolů; počet bitmapových souborů se může zvýšit, což má za následek vyšší velikost přehledu pohyblivých symbolů V pohyblivém symbolu jsou generovány pouze jedinečné bitmapy, čímž se snižuje celková velikost

Vytvoření přehledu pohyblivých symbolů

Chcete-li vytvořit přehled pohyblivých symbolů, proveďte následující kroky:

  1. Vyberte jeden nebo více symbolů na panelu Knihovna nebo instancí symbolů na ploše. Výběr může obsahovat také bitmapy.

  2. Klikněte pravým tlačítkem na výběr a vyberte příkaz Vytvořit přehled pohyblivých symbolů.

    generate-spritesheet
  3. V dialogovém okně Vytvořit přehled pohyblivých symbolů vyberte požadované možnosti a klikněte na tlačítko Exportovat.

    Možnost exportu Popis
    Rozměr obrázku Celková velikost přehledu pohyblivých symbolů (v obrazových bodech) Výchozí nastavení je Automatická velikost, kdy se mění velikost přehledu, aby obsáhl všechny přidávané pohyblivé symboly.
    Formát obrázku Formát souboru exportovaného přehledu pohyblivých symbolů. 8bitový soubor PNG a 32bitový soubor PNG podporují použití průhledného pozadí (alfa kanál). 24bitový PNG a JPG nepodporují průhledné pozadí. Celkový vizuální rozdíl mezi 8bitovým a 32bitovým souborem PNG je malý. 32bitové soubory PNG jsou čtyřikrát větší než 8bitové soubory PNG.
    Odsazení okraje Odsazení kolem okrajů přehledu pohyblivých symbolů (v obrazových bodech).
    Odsazení tvaru Odsazení mezi jednotlivými obrázky v přehledu pohyblivých symbolů (v obrazových bodech)
    Algoritmus

    Postup používaný k zabalení snímků do přehledu pohyblivých symbolů. K dispozici jsou dvě možnosti:

    • Základní (výchozí)
    • MaxRects
    Formát dat Interní formát používaný k zobrazení dat. Vyberte formát, který nejvíce vyhovuje vašemu zamýšlenému pracovnímu postupu pro přehled pohyblivých symbolů po exportu.
    Otočit Otočí pohyblivé symboly o 90 stupňů. Tato možnost je dostupná jenom pro některé formáty dat.
    Oříznout Tato možnost ušetří místo v přehledu pohyblivých symbolů tím, že z každého snímku symbolů, který je součástí přehledu, ořízne nepoužívané obrazové body.
    Vrstvit snímky Výběrem této možnosti zabráníte tomu, aby se duplicitní snímky uvnitř vybraných symbolů duplikovaly i ve výsledném přehledu pohyblivý symbolů.

Export animace přehledu pohyblivých symbolů pro mobilní aplikace

Export animace přehledu pohyblivých symbolů pro mobilní aplikace
Train Simple - Matthew Pizzi

Vytvoření atlasu textur

Vývojáři her mohou aplikaci Animate použít k uspořádání animací a jejich exportu v podobě atlasu textur do herního modulu Unity nebo do jiných oblíbených herních platforem. 

Proces generování atlasu textur v aplikaci Animate a jeho import do Unity znázorňuje následující diagram:

flow-diagram-Texture-Atlas
Obrázek zachycující pracovní postup pro generování atlasu textur a jeho import do Unity.

Chcete-li pro animaci vytvořit atlas textur, proveďte následující kroky:

  1. V Animate můžete atlas textur vytvořit pro symbol vybraný na panelu Knihovna nebo pro instanci symbolu na ploše. 

  2. Klikněte na něj pravým tlačítkem myši a z nabídky vyberte Generovat atlas textur. Zobrazí se okno Generovat atlas textur.

    generate-texture-atlas (2)
    Generovat atlas textur
  3. Vyberte požadované možnosti exportu atlasu textur. 

    Možnost exportu Popis
    Rozměr obrázku Celková velikost atlasu textur (v obrazových bodech) Výchozí nastavení je Automatická velikost, kdy se mění velikost přehledu, aby obsáhl všechny přidávané obrázky.
    Formát obrázku Formát souboru exportovaného přehledu pohyblivých symbolů. 8bitový soubor PNG a 32bitový soubor PNG podporují použití průhledného pozadí (alfa kanál). Celkový vizuální rozdíl mezi 8bitovým a 32bitovým souborem PNG je malý. 32bitové soubory PNG jsou čtyřikrát větší než 8bitové soubory PNG.
    Odsazení okraje Odsazení kolem okrajů atlasu textu (v obrazových bodech)
    Odsazení tvaru Odsazení mezi jednotlivými obrazy v atlasu textu (v obrazových bodech)
    Algoritmus

    Postup používaný k zabalení snímků do atlasu textur. K dispozici jsou dvě možnosti:

    • Základní (výchozí)
    • MaxRects
    Formát dat Interní formát používaný k zobrazení dat. Výchozí formát je JSON.
    Otočit Otočí obrázky o 90 °. Tato možnost je dostupná pouze pro některé formáty dat.
    Sloučit zkosené objekty do bitmapy Tuto možnost vyberte, pokud pro objekty používáte zkosené transformace. Animate převede tyto objekty na bitmapové obrázky, protože některé herní moduly nedokáží odpovídajícím způsobem interpretovat zkosené transformace. 
  4. Chcete-li zobrazit výstup v podobě náhledu atlasu textur, klikněte na kartu Náhled.

    texture-atlas-preview
    Náhled vytvořeného atlasu textur
  5. Klikněte na tlačítko Procházet a vyberte pro výstupní soubor cílovou cestu na počítači nebo zadejte cestu do textového pole a klikněte na tlačítko Exportovat

Vygenerovaná výstupní složka atlasu textur obsahuje následující soubory:

Animation.json

Tento soubor obsahuje informace o animaci. 

spritemap.json

Tento soubor obsahuje informace o souboru spritesheet.png.

spritemap.png

U exportovaného symbolu obsahuje tento soubor bitmapovou podobu všech minimálně jedinečných textur potřebných k rekonstrukci animace.

Vygenerovaný atlas textur můžete použít v libovolném herním modulu, jako je Unity, pokud má vhodný zásuvný modul pro import.

Import atlasu textur do modulu Unity

Soubory atlasu textur generované v aplikaci Animate můžete importovat do vašich oblíbených herních modulů. Pokud chcete soubory atlasu textur importovat, můžete si vytvořit zásuvné moduly, které odpovídají herním modulům. Vzorový zásuvný modul pro import je určený pro nástroj Unity. 

Atlas textur můžete exportovat do Unity provedením následujících kroků: 

  1. V nástroji Unity vytvořte v určitém umístění projekt. V tomto umístění se vytvoří složka s podsložkou Assets (Datové zdroje).

  2. Ve složce Assets vytvořte dvě podsložky:Resources (Zdroje) a Editor.

  3. Klikněte sem a stáhněte si ukázkový zásuvný modul pro import určený pro platformu Unity. Na kartě Downloads (Soubory ke stažení) zvolte Unity Plugin (Zásuvný modul Unity) a vyberte číslo verze, kterou chcete stáhnout.

    Komprimovaný soubor unity-plugin.zip obsahuje soubory Plugin.cs, WrapperPlugin.cs, AnimateEditor.cs a Effect.shader.

    Stažením ukázkového zásuvného modulu vyjadřujete souhlas s podmínkami používání a online zásadami ochrany osobních údajů. 

  4. Přesuňte soubory atlasu textur, jako jsou Animation.json, spritemap.json a spritemap.png, a soubory zásuvného modulu Unity, jako Plugin.cs a Effect.shader, do složky Assets > Resources.

  5. Přesuňte soubory AnimateEditor.cs a Wrapperplugin.cs do složky Assets

  6. V nástroji Unity klikněte na soubor AnimateEditor.cs a přetáhněte ho do složky Main Camera (Hlavní kamera).

  7. Přehrajte projekt. Při přehrávání je mapa pohyblivých souborů rozdělena na různé pohyblivé symboly.

  8. Přesuňte soubor AnimateEditor.cs do složky Editor.

  9. V nástroji Unity klikněte na soubor Wrapperplugin.cs a přetáhněte ho do složky Main Camera (Hlavní kamera).Také zrušte výběr nebo odstraňte soubor AnimateEditor.cs ze složky Main Camera.

  10. Podle vašich požadavků přehrajte nebo publikujte výstup. 

Zásuvný modul si můžete přizpůsobit svým požadavkům úpravou souboru Wrapperplugin.cs.

Zásuvný modul Unity podporuje barevné efekty pro soubory atlasu textur generované v aplikaci Animate a také podporuje maskování pomocí vrstev. Funkce maskování se týká pouze platformy Unity počínaje verzí 2017. 

Publikování textur

Animátoři mohou vytvářet obsah ve vektorovém formátu a poté exportovat vektorový nebo bitmapový obsah pro platformy podporující HTML 5. V nastavení publikování byla také přidána možnost exportovat animace jako atlas textur, což umožňuje zvýšit výkon animací.

Klikněte na Soubor > Nastavení publikování. Pokud je na kartě Základní zaškrtnuto políčko Exportovat dokument jako texturu, zobrazí se na kartě Nastavení snímku volba Možnosti publikování textury. Ve výchozím nastavení jsou při publikování do textury zahrnuty všechny symboly. Chcete-li pro textury vybrat jen některé symboly, klikněte na ikonu nastavení.

Ačkoli tato možnost může zvýšit velikost datových zdrojů, zvyšuje výkon. Můžete také 2x nebo 3x zvýšit původní rozlišení obrázků, pokud chcete textury publikovat pro displeje HiDPI. Chcete-li změnit nastavení rozlišení, klikněte na ikonu klíče vedle políčka Exportovat dokument jako texturu, jak je znázorněno na následujícím snímku obrazovky. Nastavte číslo v poli Rozlišení na násobek 2x nebo 3x.

Výchozí rozlišení při exportu textur je nastaveno na hodnotu 2x. Rozlišení můžete nastavit v rozsahu 0,3 až 3x.

Poznámka:

Publikování textury lze použít pouze pro dokument ve formátu HTML5 Canvas. 

Exportovat dokument jako texturu
Exportovat dokument jako texturu

Výběr vektorového nebo bitmapového souboru je jako volba mezi velikostí souboru a výkonem. Platformy HTML5 jsou optimalizovány pro bitmapový obsah. U některých složitých tvarů je proto lepší předem převést vektorové obrázky na bitmapové. Pro základní obsah můžete stále používat vektory. Animate vám tuto možnost nabízí prostřednictvím dialogového okna pro částečný výběr symbolů. Tento výběr vám umožňuje zvolit symboly, které chcete převést na bitmapy, přičemž zbývající symboly zůstanou vektorové.

Chcete-li provést částečný výběr symbolů, klikněte na tlačítko Změnit v dialogovém okněNastavení publikování a v seznamu vyberte symboly. Ve výchozím nastavení jsou vybrány všechny symboly.

Změna částečného výběru symbolů
Změna částečného výběru symbolů

Vyberte požadované symboly v seznamu. 

Částečný výběr symbolů
Částečný výběr symbolů

Výuková lekce o publikování textur

Výuková lekce o publikování textur
Zjistěte, jak můžete vytvářet podklady pomocí vektorových kreseb nabízejících flexibilitu a věrnost a poté je publikovat jako bitmapové textury.

Tato práce podléhá licenci Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.  Na příspěvky ze služeb Twitter™ a Facebook se nevztahují podmínky licence Creative Commons.

Právní upozornění   |   Zásady ochrany osobních údajů online