(page) REDIGERET 13 October 2011 • by admin

MovieClips Playback

Animationer i movieClips

Edited 13 October 2011 • admin TOCbe the first to comment

Dette er første del af en øvlsesserie. Anden del er Playback af movieClips

Formålet er at undersøge de forskellige animationstekniker opstillet i animation teknikker – samt at anvende dem hver især i deres eget movieclip for derigennem at kunne håndtere flere symbolers tidslinier og lag.

De 3 Movieclips

Oprettelse af nye movieclips

I eksemplet nedenfor, er der oprettet nye movieclips ved at klikke på nyt symbol – knappen nederst i Library-panelet.

Animerede movieclips

Indeni deres respektive tidslinier ligger der 3 forskellige animationer: en motiontween med rotation, en shapetween, og en frame by frame animation.
Vær opmærksom på motiontween’en, som nødvendigvis kræver endnu et nyt symbol til at “motiontweene” med, da det kun kan foregå med et instancieret symbol. Også når det skal foregå inden i et symbol. En nem måde er at konvertere grafik til symbol direkte med højreklik eller F8.

Instanciering af movieclips

De 3 movieclips er instancieret på scenen: trukket ud fra Library, mens man står på scenen. Hvis scenen er tom, vil en test med CTRL+Enter/Command+Enter ingenting vise, selvom movieclipsene er nok så færdige og animeret.

Eksempel

anim.gif

Download eksempel

Brug højrekliksmenuen for at downloade den færdige løsning, hvis du vil kigge i mine movieclips.
anim.fla (eksempel ovenfor)

Playback af MovieClips

Edited 13 October 2011 • admin TOCbe the first to comment

Dette er anden del af en øvlsesserie. Første del er Animationer i movieClips
Formålet er at lave knapper og kontrolere hvert movieclips tidslinie, med simple knapfunktioner i actionscript3.
.

Knapper

Der oprettes nye symboler af typen “button” (i eksemplet er der lavet 2: en kaldt “play” , en kaldt “stop”).
I eksemplet genbruges samme knap-symboler for hvert movieclip, men der må også gerne laves flere, hvis de skal se forskellige ud.

Knappers tidslinie er begrænset til det strængt nødvendige: det umiddelbare udseende. Knappers funktionalitet, scripter man sig til.
Knappers frames er fordelt på up-, over- og down-stadier. Hit-stadiet bruges kun til at aftegne det “musefølsomme” areal med en shape, som ikke vil kunne ses.
Den ønskede grafik placeres på de relevante stadier i keyframes.
Grafik kan også på knapper, med fordel opbygges i lag – særligt hvis grafiken er kompliceret.

Alle play og stop knapper skal derefter arrangeres ud på hovedscenen – på deres eget lag: knapper.
Selvom der endnu ikke er scriptet noget funktionalitet, kan der med fordel testes, og man vil kunne se at man med musen får en “hånd” over knappen, med den grafik man indsatte på en keyframe i over-stadiet.

Instance navne

Skal man kunne nævne knap- eller movieclip-instances i sit script, og det skal man for at kunne igangsætte hver handling med et klik, så skal de have unikke navne.

Marker på hovedscenen hvert movieclip-instans og hver knap-instans individuelt – og navngiv det fra property-panelet.
De kan i princippet hedde hvad du vil, bare overhold web-navngivnings-konventionerne.

Det er smart at have et navngivnings system, som du – og andre – kan gennemskue.
Prøv at se om du kan gennemskue dette system:

anim_playback1.gif

Actions

Stil dig på hovedscenens eneste frame på et nyt lag øverst oppe, som du passende har døbt actions.
Actions panelet åbnes (find det i window-menuen, eller tryk f9, eller højreklik.) – og der tastes.

NB: Vær opmærksom på, at alle kommandoer skrives på samme linie indtil tuborgklammer eller afsluttende semikolon!

anim_playback2.gif

Knap funktioner – og fejlmeldinger

Får du en fejlmelding i et output vindue, så læs den og ret den. Det er ligesom med validering bare værre: Intet virker.
Her kommer et par hurtige tips til de mest ofte-forekommende forseelser:

Hver knap har sit eget instance-navn (chek det).
Hver funktion knappen kalder, har også sit eget navn (chek det).
Hver movieclip-instance, hvis tidslinie kontrolleres i funktionen har også sit eget navn (chek også det).
Navne i actionscript skal selvfølgelig staves præcis ligesom objekternes “døber” har skrevet dem i property-panelet.

 
knapNavn.addEventListener(MouseEvent.CLICK, FUNKTIONSNAVN);
function FUNKTIONSNAVN(e:MouseEvent){
	movieClipNavn.play();
}

Her er funktionernes navn stavet med store bogstaver, for at vi nemmere kan se forskel på objekter og funktioner.
MOTIONPLAY refererer til den funktions faktiske gerning: motion_mc’s tidslinie sættes i gang, MOTIONSTOP får samme tidslinie til at stoppe.
Funktionerne for at kontrollere shape_mc’s tidslinie kan du kalde hvad du vil, men det vil være konsekvent at kalde dem for SHAPEPLAY, osv., osv.