. .. : Swf.hu 1.0 archívum : Swf.hu főoldal >>> : .. .




 
 
SEGÉDLETEK Effektus-trükk

Realisztikus hóesés effekt - DuplicateMovieClip-el
  feltöltve: 2003.12.01 | szerző: Dodon | olvasva: 13076 alkalommal

 

Tudom hogy kövületnek számítok, mert amit meg lehet írni flash4-ben, arra nem pazarolom az MX-et, hogy ne kopjon. Ezért ezt a tutorialissimót is négyesben írtam meg, természetesen 5-ös és 6-os is megeszi rendesen, és mivel nem túl bonyi, sokat azokban sem lehet spórolni sem méretben, sem futási sebességben...

Valaki keresett a fórumon példát a hóesésre, hát gondoltam, csinálok egy kis flasht, ami igyekszik az általában használt scriptektől eltérően, egy kicsit realisztikusabban ábrázolni eme égi áldást. A hópelyhek ugyanis elég aprók, ezért ha stilizáltra vesszük a figurát, és megrajzoljuk a pehely szerkezetét, akkor biza dinnyenagyságúra kell megálmodnunk a kis pihéket, ami lehet szép, de nem biztos, hogy mindenütt megállja a helyét. Az apró hópihe-pontok alkalmazása azonban egy komoloy probléma elé állítja a téli örömökre pályázó animátort: nagyon sok kell belőlük hogy az effekt szép legyen, és ez esetben - ismervén a flash processzor igényét - le kell mondanunk arról, hogy minden pihét script segítségével vezéreljünk.

A megoldás azonban kézenfekvő. A flash ugyanis nem csak AS, hanem animáló eszköz, bár hajlamosak vagyunk erről megfeletkezni. Sok esetben a legegyszerűbb megoldásokhoz kell visszatérnünk ahhoz, hogy az eredmény megfelelő legyen, hagyni kell a programot, hogy megcsinálja ami a dolga, engedjük csak szépen had' törje ő a buksiját, s ne akarjunk mindent paraméterezetten leprogramozva a hatalmunk alá vonni.
Ez a hóesés effekt is úgy van összerakva, hogy a munka nehezebb részét egy motion guide-ra illesztett MC mozgása végzi, amihez sem scriptet, sem más okosságot nem kellett írni, csak rajzolni kellett egy elegáns görbe vonalat...

De nézzük az elején:

- A timeline három framet és négy layert tartalmaz.
- A legalsó layeren található a tetszőleges háttér.
- Felette van a hóember, és a felirat.

E két layer nem játszik szerepet a továbbiakban, helyükre bármi berakható. A felső két layer viszont fontos:

- A legfelső a vezérlés (ezen található a három csodaframe), és
- alatta helyezkedik el az a layer amire a duplikálandó hópehelyanim, és a draggolt MC került.

Az első Keyframe valójában elegendő is lenne, a másik kettő csak arra szolgál hogy a hóesés irányát meghatározó "vektor", és a nagyítás mértékéért felelős "alapmeret" változók értékét asszerint módosítsa, ahogy változik az egeret kiskutyusként követő "hogolyo" nevű MC "X" és "Y" pozíciója. A változás mértékét az alábbi fügék írják le:

vektor = -(GetProperty ( "hogolyo", _x)-300)/6

alapmeret = (GetProperty ( "hogolyo", _y))/10

Itt kell megjegyezni, hogy a -300 nem légbőlkapott érték. Mivel a movie 420 pixel széles, logikusnak a -210 tűnne, hiszen az egér középen akkor adna 0 foknyi dőlésszöget, azaz függőleges hóesést (mert ugye a lefelé animálódó pihék elfordulását szabályozza ez a változó). Ám ha belekukkantunk az animációba, láthatjuk hogy az nem egyenes vonalon, hanem egy "S" alakú motion guiden fut, s ezért eleinte jobbra tart. Ezt hivatott kompenzálni a -300 és a -210 közötti különbség. A"/6" és a "/10" viszont szinte tetszőleges értékek, velük a változások nagyságát írjuk le. Minnél nagyobb osztót alkalmazunk, az egérmozgásra annál kisebb mérvű változás fog bekövetkezni. A harmadik keyframe csak elegánsan visszlöki az előzőre a moviet, hogy szakadatlanul birizgálja az egeret :-)

Mielőtt az első keyframe funkcióját áttekintenénk, nézzük meg, mitől lesz élethű egy hóesés anim:

1. Ami közelebb van az nagyobb, s a látszólagos mozgása gyorsabb.
2. A hópelyhek különböző méretűek egy határértéken belül, azaz NEM minden hópihe egyforma gyorsan mozog, ami egyforma nagy.
3. A hópihék kavarognak, és az apró légáramlatok miatt egyenként, és csoportosan is irányt változtatgatnak, de ez az irányváltoztatás nem szakaszos, hanem "lágy".
4. Az egyes hópihék nem katonák, nem sorakoznak fel, nem csinálnak egyszerre "balraátot", hanem eléggé kaotikusan szeretnek alápotyogni.

Ezen kívül azt is vizsgáljuk meg, hogy milyen lehetőségeink és korlátaink vannak a falshben:

1. Tudjuk egy lehulló pelyheket tartalmazó MC-nket nagyítani és kicsinyíteni, így már eleve megoldódik a közelebbi=nagyobb=gyorsabb - távolabbi=kisebb=lassabb probléma, hiszen a képernyőn megtett út (látszólagos sebesség) pont a méretnek megfelelő lesz mindig.

2. nem duplikálhatunk túl sok objektumot, mert azok mozgatása bevágja villásreggelire egy mezei juzer gépének processzorát, és hóesés helyett pislákoló csillagos éjszakát, és lehalt egeret kapunk.
Ezért jó lenne lehetőleg kevés objektummal megúszni, azaz egy objektumnak több hópelyhet kell tartalmaznia.

3. Hála a magasságosnak, nem csak egyetlen hopehely zúghat alá egy ilyen MC-ben, hanem megoldhatjuk azt is, hogy 4-8 pelyhecske mozogjon egyszerre. Hogy ne "ismétlődjön" a motívum, a hópehelycsoportokat tartalmazó belső MC-t random 360 fokkal elforgatjuk. Sasszem legyen a talpán, aki a különböző nagyságú, különböző helyen, különböző esési szögben, és különböző sebességgel aláhulló, valamint random 360 fokos szögben elfordított csoportok között felfedezni véli a "hasonlóságot" :-)

4. A Flash van annyira okos, hogy a motion guide nevű varázslattal megoldhatjuk hogy az aláhullás szép ívelt görbe mentén történjen, nem szükséges szögfügvényes vezérlést írnunk hozzá... 5. Aranyos, hogy a duplikálást követően az MC-ket nem az első kockára ugrasszuk - bár kockázatos :-). Nagyszerűen megoldható vele, hogy a hopelyhek mind különböző magasságból induljanak indításkor, és az egyébként azonos hosszúságú ciklusaik esetenként más és más időpontban iduljanak ujra. Ha még azt a turpisságot is elkövetjük (és mi akadályozna meg ebben bennünket? :-) hogy az első kockára érve, az egér alapján változó értékek szabta határok közt új, random esési szöget és új random méretet adjunk nekik, azt is megoldottuk, hogy az egérmozgásra bekövetkező változások nem egyszerre, hanem "puhán", kis eltolódásokkal érvényesüljenek a kis bitang pelyhecskék életében.

Nézzük akkor a konkrét megoldást. Ime az első keyframe:

Set Variable: "csoportszam" = 150

// meghatározza a pehelycsoportok számát

Set Variable: "vektor" = 40

// megadja a kiinduló esési szög középértékét

Set Variable: "alapmeret" = 10

// megadja a pelyhek nagyítási faktorának alapértékét

Set Property ("hopehely", Visibility) = 0

// az alapcsoportot (amit duplikálunk) kivonja a forgalomból
// itt indul a duplikálási ciklus

Set Variable:"n" = 1
Loop While (n<csoportszam)
Set Variable: "meret"=random(alapmeret*2+20)+alapmeret+10

// ha nem ovális pelyheket akarunk, akkor az xscale, és az y scale ugyanannyi kell hogy legyen. ezt a "meret" változó adja meg. A random tartomány mérete is az "alapmeret" változó mértékétől függ. A két konstans (a 20 és a 10) változtatásával a szórás mértéke állítható.

Duplicate Movie Clip ("hopehely", "hopehely"&n, n)

// duplikálgatunk, duplikálgatunk. Tiszta unalom :-)

Set Property ("hopehely"&n, X Position) = random(420)

// a pihék az x tengelyen, a movie 420 pixelének bármelyikéről indulhatnak. Más movie méretnél ezt át kell állítani.

Set Property ("hopehely"&n, X Scale) = meret
Set Property ("hopehely"&n, Y Scale) = meret

// beállítottuk a nagyságukat is...

Set Property ("hopehely"&n&"/pelyhek/csoport", Rotation) = random(360)

// elforgattuk a duplikált aláhullós MC-ben lefelé futó animban a pehelycsoportot

Begin Tell Target ("hopehely"&n)
Go to and Play (random(400)+1)
End Tell Target

// elküldjük az MC-t a 400 frame hosszú timeline egy véletlenszerű pontjára, és azt mondjuk neki, hogy tedd a dolgod :-)

Set Variable: "n" = 1+n
End Loop
Start Drag ("hogolyo", lockcenter)

// kikötjük az ebet a karóhoz, a hogolyot az egérhez, vagy valami ilyesmi... Ami még hátra van, az a leduplikált MC-nk belseje:

Sok AC nincs benne, csak az első keyframen található ez az alábbi rusnyaság:

Set Variable: "meret" = random(../:alapmeret*2+20)+../:alapmeret+10
Set Property ("", X Position) = random(420)
Set Property ("", X Scale) = meret
Set Property ("", Y Scale) = meret
Set Property ("", Rotation) = random(10)+../:vektor-5

Az uccsó sorig ugyanaz mint kint a répában (azaz gyökérben), az utolsó viszont az esésszöget módosítja.
A többi meg egyszerű objektum animáció egy motion twinen, ahol a 0,0 pozíciótól a 0,2000 pozícióig, 400 framen át, egy görbe mentén lehuppan a pelyhek nevű MC, amiben a csoport van:

Hóembert viszont úgy rajzoljunk, hogy megfogjuk az egeret a jobbkezünkben (ha nem balkezesek vagyunk) és... :-)       

 
 
 

© Devnet.hu. A segédletek semmilyen formában nem másolhatók, publikálhatók a Devnet.hu és a szerzők közös írásos engedélye nélkül.
 
. .. : Swf.hu 1.0 archívum : Swf.hu főoldal >>> : .. .