# Animációs mód

> Az animációs mód: kész animációk az Alapok módban, részletes vezérlés a Haladó módban, animációs célpontok, kulcsképkockák és sávok szétválasztása.

Az animációs módban animációkat adhatsz a rétegeidhez, és módosíthatod őket.

## Az animációs mód bekapcsolása

A jobb oldalsáv tetején a középső (lejátszás ikonos) fül kapcsolja be az animációs módot. A színpad fölött ilyenkor az **Animációs mód** címke áll. A mód bekapcsolása magától megnyitja az [idővonalat](https://hub.hellowp.io/hu/plugins/revslider/szerkeszto/#idővonal) is, és fordítva.

![Animációs mód: jobbra az animációs célpontok és a kulcsképkockák, alul az idővonal](./kepek/szerkeszto-bejaras-animacios-halado.webp)

*Animációs mód: jobbra az animációs célpontok és a kulcsképkockák, alul az idővonal* (https://minta-bolt.hu/wp-admin/admin.php?page=revslider&view=editor&module=1&slide=1)

Animációs módban mindig ezen dolgozol:

- az éppen aktív jelenet (scene) az idővonalon (a képen a **Bejövő animáció**),
- a kijelölt sáv,
- a kijelölt kulcsképkocka.

Mielőtt animálni kezdesz, ellenőrizd az idővonal jelenetváltóját, valamint a kijelölt sávot és kulcsképkockát: biztosan azt animálod-e, amit akarsz.

Az animációs módnak két almódja van:

- **Alapok**: kész animációkat alkalmazhatsz egy nagy gyűjteményből.
- **Haladó**: saját animációkat hozhatsz létre, vagy a kész animációkat módosíthatod.

Az oldalsáv alján az **Alapok** és a **Haladó** gombbal válthatsz közöttük.

Az Alapok mód előbeállításait részletesen a [Be és Ki animációk](https://hub.hellowp.io/hu/plugins/revslider/animaciok-be-es-ki/), az [Additional animációk](https://hub.hellowp.io/hu/plugins/revslider/animaciok-tovabbi/) és a [Szöveges animációk](https://hub.hellowp.io/hu/plugins/revslider/animaciok-szoveges/) fejezet sorolja fel; a dia hátterének gyűjteményeit a [háttérátmenetek](https://hub.hellowp.io/hu/plugins/revslider/animaciok-hatter-atmenetek-felfedes/), a [pásztázás és nagyítás](https://hub.hellowp.io/hu/plugins/revslider/animaciok-hatter-pasztazas-nagyitas/) és a [szűrők](https://hub.hellowp.io/hu/plugins/revslider/animaciok-hatter-szurok/) fejezet. A szövegfelosztó célpontokról (Chars, Words, Lines) az [Animációs célpontok: szöveg felosztása](https://hub.hellowp.io/hu/plugins/revslider/animaciok-szovegfelosztas/) fejezet szól.

## Alapok mód

Az **Alapok** mód paneljén három gyűjtemény van, amelyek között a panel tetején lévő fülekkel váltasz: **Be**, **Ki** és **Additional**.

![Az Alapok mód: a Be, Ki és Additional fül, a saját előbeállítások és a kész animációk kategóriánként](./kepek/szerkeszto-bejaras-animacios-alapok.webp)

*Az Alapok mód: a Be, Ki és Additional fül, a saját előbeállítások és a kész animációk kategóriánként* (https://minta-bolt.hu/wp-admin/admin.php?page=revslider&view=editor&module=1&slide=1)

| Gyűjtemény | Mire való |
| --- | --- |
| **Be** | A réteget láthatóvá animálja (belépő animáció). |
| **Ki** | A réteget eltünteti (kilépő animáció). |
| **Additional** | Egyszeri vagy ismétlődő, figyelemfelkeltő animációk, amelyek a réteg láthatósága alatt, a belépő és a kilépő animáció között futnak. |

A **Be** vagy **Ki** fülre váltás az idővonalat is a megfelelő animációs jelenetre állítja, így a látott kulcsképkockák mindig az éppen böngészett gyűjteményhez tartoznak.

Minden gyűjteményben az előbeállítások kategóriák szerint vannak rendezve. A **Be** gyűjtemény tíz kategóriája: Basic, Cinematic, Curved Motion, Lines, Words, Letter, Kinetic Text, Movement, Rotate és Masked. A **Ki** gyűjteménynek hét kategóriája van: Basic, Lines, Words, Letter, Movement, Rotate és Masked. Az **Additional** gyűjtemény két kategóriája: One Shot és Loops.

A látható kategóriák a kijelölt réteg típusától függnek. A Lines, Words, Letter és Kinetic Text kategória a szöveget soronként, szavanként vagy betűnként animálja, ezért csak szövegrétegnél jelenik meg.

### Előbeállítás alkalmazása

1. Kattints egy előbeállítás csempéjére. Megnyílik a beállítópanelje: felül az animáció élő előnézete, alatta az előbeállítás paraméterei, legalul a hozzá hasonló előbeállítások rácsa.
2. Állítsd be a paramétereket.
3. Kattints az **Apply** gombra: az animáció a kijelölt rétegre kerül.
4. A panel tetején lévő vissza gombbal térhetsz vissza a kategóriák listájához.

A réteg animációját úgy távolíthatod el, ha a **Be** gyűjtemény Basic kategóriájából a **No Animation** előbeállítást alkalmazod. A korábban hozzáadott ismétlődő animációt a Loops kategória **No Loop** előbeállítása törli.

Ha látni szeretnéd, milyen beállításokat adott az előbeállítás, kapcsolj át **Haladó** módba.

### A dia hátterének animációi

Ha a dia háttere van kijelölve, az **Alapok** mód a szokásos három gyűjtemény helyett a sajátját mutatja:

- **Transition**: a diáról diára váltás animációi.
- **Pan & Zoom**: a háttérképet mozgásban tartó animációk, amíg a dia látszik.
- **Filter**: szűrőhatások a háttéren, például szürkeárnyalat és szépia.

A dia hátterét az idővonal alján lévő sávjára kattintva jelölheted ki (**Slide Background**).

## Haladó mód

A **Haladó** mód panelje mindig ugyanabból a négy részből áll:

1. **Animációs célpontok**: az animáció egy meghatározott típusát célozhatod meg, például a Mask, Words vagy Wrapper célpontot.
2. **Kulcsképkockák**: kulcsképkockát adhatsz hozzá, törölhetsz, és válthatsz közöttük.
3. **Időzítés és áramlás**: a Layer célpontnál, ha egy Anim To kulcsképkocka van kijelölve. Itt adhatod meg az időtartamot és a lassítási görbét.
4. **Célponti szakasz**: az éppen kijelölt animációs célpont beállításai. A szakasz a célpont nevét viseli (például Layer, Mask, Words, Wrapper).

### Animációs célpontok

Az **Animációs célpontok** szakaszban speciális célpontokat adhatsz hozzá, amelyekkel egyetlen réteg különböző részeit animálhatod egymástól függetlenül. Például ha egy szövegréteghez Lines célpontot adsz, a szöveg sorait külön-külön animálhatod.

Minden rétegnek van egy **Réteg** célpontja, amellyel az egész réteget animálod. Nyolc további célpontot adhatsz hozzá:

| Célpont | Mire jó |
| --- | --- |
| Mask | Egyszerű, téglalap alakú rétegmaszk. |
| Clip | Összetettebb, téglalap vagy kör alakú vágómaszk. |
| Chars | Szövegrétegen karakterenkénti animáció. |
| Words | Szövegrétegen szavankénti animáció. |
| Lines | Szövegrétegen soronkénti animáció. |
| PanZoom | Pozíció, méret és elforgatás animálása. |
| Filter | A réteg és a mögötte lévő tartalom szűrőinek animálása. |
| Wrapper | A réteg burkolójának animálása, például mozgáspályák követéséhez. |

Új célpont hozzáadásához kattints a **Hozzáadás** gombra, és válaszd ki a célpontot a listából. A célpont törléséhez jelöld ki, és kattints a jobb felső sarokban lévő törlés gombra. Hozzáadás után a célpont ikonjára kattintva aktiválhatod a hozzá tartozó szakaszt, és beállíthatod.

### Kulcsképkockák

A **Kulcsképkockák** szakaszban:

- egy kulcsképkockára kattintva szerkesztésre aktiválod,
- kulcsképkockát úgy adsz hozzá, hogy fölé viszed az egeret, és a + zászlóra kattintasz,
- átnevezéséhez duplán kattints a címére,
- a kulcsképkockák ismétlését (loop) a szakasz jobb felső sarkában lévő gombbal kapcsolhatod.

Az egyéni kulcsképkockát úgy törölheted, hogy kijelölöd a Réteg célpontot, és az **Időzítés és áramlás** szakasz jobb felső sarkában a **REMOVE FRAME** gombra kattintasz. Az alap kulcsképkockák neve a képen **Anim From** és **Anim To**.

### Időzítés és áramlás

Ez a szakasz akkor látszik, ha a Réteg célpont és egy Anim To kulcsképkocka van kijelölve. Itt a kulcsképkocka időtartamát és lassítási görbéjét állíthatod.

### Célponti szakasz

Minden animációs célponthoz tartozik egy szakasz a beállításaival, a célpont nevével felcímkézve. A Réteg célpont beállításai a Layer szakaszban vannak, a Mask célponté a Mask szakaszban, és így tovább.

Egyes beállításokra kattintva segédpanel nyílik. Ezek a gyakori értékek (például véletlen tartományok vagy ciklikusan váltakozó értékek) néhány kattintásos beállítására valók.

| Célpont | Mit állíthatsz be |
| --- | --- |
| **Réteg** | A kulcsképkocka átlátszatlanságát, pozícióját, méretét, dőlését (skew), 3D-s transzformációját és színeit. |
| Mask | A maszk pozícióját, azt, hogy a túlnyúló rész el legyen-e rejtve, a blokktakarás animációs irányát és a takarás színét. |
| Clip | A vágómaszk alakját, irányát és méretét. |
| Chars | Hogyan animálódjon a karakterek átlátszatlansága, pozíciója, mérete, dőlése, 3D-s transzformációja és a szűrők (elmosás, monokróm, fényerő). |
| Words | Ugyanezeket a szavakra. |
| Lines | Ugyanezeket a sorokra. |
| PanZoom | A pozíció, a méret és az elforgatás animációját. |
| Filter | A rétegen elmosást, monokróm és fényerő-szűrőt, a mögötte lévő tartalmon elmosást, monokróm, fényerő, szépia, invertálás és kontraszt szűrőt. |
| Wrapper | A burkoló pozícióját, méretét, dőlését, 3D-s transzformációját és szűrőit. |

#### Mozgáspálya a Wrapper célponttal

A Wrapper célpontnál a mozgás típusát **XYZ**-ről **Motion Path**-ra (mozgáspálya) állíthatod. Ezután kattints az **Edit Motion Path** gombra: a Wrapper panel mozgáspálya-szerkesztő módba vált. Ebben a módban vektoros mozgáspályát rajzolhatsz a színpadon, és a réteg ezen a pályán fog mozogni. A módból a **Motion Path Done** gombbal lépsz ki.

### Sávok szétválasztása

Egyes animációs célpontokat önálló sávra is szétválaszthatsz az idővonalon. Egyes célpontok egyes attribútumai is kaphatnak saját idővonal-sávot.

A szétválasztott sáv saját kulcsképkockákat ad a célpontnak vagy az attribútumnak, amelyeket egymástól függetlenül állíthatsz. Például egy réteg külön sávot kaphat a Wrapper célpontnak, alatta pedig egy másik sávot a burkoló X attribútumának.

- Ha egy célpontot szét lehet választani, a **Kulcsképkockák** szakasz jobb felső sarkában szétválasztás/egyesítés gomb látszik.
- Ha egy attribútumot szét lehet választani, a szétválasztás/egyesítés gomb a segédpanelének jobb felső sarkában látszik.