dinsdag 24 juni 2008

Les 7

Vorige week hebben we gezien hoe je een eenvoudig website in flash kunt maken.
Ook hebben we gekeken hoe we met een druk op de knop andere filmpjes kunnen laden, om zo tot een grotere applicatie(onderverdeeld in kleine filmpjes) te komen.

Vaak wordt er bij het laden van een Flash site, of een onderdeel van een flashsite een prloader getoont. Zo'n balkje wat laat zien hoeveel procent er al is geladen.

Hoe werkt dat nou?

http://www.vintagesworld.be/tutorials/ActionScript/95/

In principe is het een vrij eenvoudig verhaal:
-Je kijkt hoe groot het te laden filmpje is en stelt dat gelijk aan 100%
-Vervolgens ga je iedere keer kijken hoeveel je van het totale filmpje binnen heb en die info toon je op het scherm met behulp van een annimatie.


Mocht er nog tijd over zijn dan wil ik graag nog even naar video in flash kijken.


Verder wil vanavond ook nog even naar stickman kijken:
http://www.youtube.com/watch?v=tdEIeowMrD8

dinsdag 17 juni 2008

les 6

Vanavond gaan we kijken:

-naar een aantal flashsites
Gewoon omdat het leuk is, maar ook om te zien wat er allemaal mogelijk is en hoe sommige dingen gedaan zijn.
http://www.thefwa.com


-hoe we een ander filmpje in kunnen laden.

Dit gebeurd met het volgende AS:

on (release) {
loadMovieNum("home.swf", 1);
}

Dit stukje script kunnen we gebruiken als we bijvoorbeeld een groot project hebben, op die manier hoeft dus niet alles in 1 keer geladen te worden. Iedere keer als de gebruiker een ander onderdeel aan klikt kan er dus een nieuw filmpje geladen worden.

Het houdt de boel ook overzichtelijk, aangezien alles in kleine stukjes is opgedeeld. Als er ergens iets moet worden aangepast, pas je alleen dat filmpje aan en je hoeft niet in een heel groot project te gaan zitten zoeken, waar je ook al weer die aanpassing moest maken.

Ook kunnen we op die manier een site bouwen. Elke pagina bestaat dan uit een nieuw filmpje, welke dan iedere keer op het content gedeelte van de site kan worden geplaatst.

Een mooi uitgeschreven tutorial hierover vinden we op:
http://www.bewired.nl/beginner.php?titel=basis%20website


Mocht het echt om een hele simpele site gaan dan kan je ook alles gewoon in 1 project stoppen:
http://www.oman3d.com/tutorials/flash/simple_website/



Als we nog tijd over hebben gaan we ook nog even kijken hoe we een preloader kunnen maken.
http://www.vintagesworld.be/tutorials/ActionScript/95/






dinsdag 10 juni 2008

les5

OK, hier zoals beloofd de uitgewerkte button:


Ik ga er van uit dat je een ActionScript 2.0 file hebt gestart.


Ook heb je een kleine annimatie gemaakt, bijvoorbeeld bewegende bal


Invoegen nieuw symbool graphic ball, gr_bal.

Teken een cirkel en vul hem met een radiale gradiant.


Invoegen nieuw symbool movieclip bewegende bal, mc_bewbal.

Maak een nieuwe laag bal en sleep gr_bal uit de library.

Maak een geleider laag, en plaats daarop een rechte lijn.

Neem je pijltjestool en ga naar de lijn toe, je pijltje verandert in een pijltje met een half rondje.


Maak nu een mooi parabool vorm.

Plaats op frame 1 de bal op de ene kant van de geleider.


Dubbelklik op frame 30, slecteer ook frame 30 van de geleider laag en voer een hoofdframe in.

Plaats nu de bal aan de andere kant van de geleider.


Klik op de bal laag en maak een Bewegings Tween.


Test de movieclip door op enter te drukken, je ziet nu een bal de baan van de geleider beschrijfen.




OK dat was deel 1, de annimatie, nu verder met de knop.


Invoegen nieuw symbool knop play, btn_play.

Selecteer de text tool en type het woord Play.

Kies het Boven frame en voeg nieuw hoofdframe in, verander de kleur van het woord.

Kies het Omlaag frame en voeg nieuw hoofdframe in, verander de kleur van het woord.

Kies het Actief frame en voeg nieuw hoofdframe in, geef het actieve gebied van de knop aan


De knop is nu af.


Nu gaan we de 2 samen brengen.


Ga naar de scene, als het goed is heb je nue een lege tijdslijn met een laag en een lege stage.


Noem de eerste laag Actions.

Ga op frame 1 van de Actions laag staan druk op de rechtermuisknop en kies handelingen.

Er komt een nieuw venster op, het Handelingen venster “Actions”

Aan de linkerkant maak je de submapjes;

“global function” en vervolgens “Timeline control” open.


Klik aan de linkerkant dubbel op het woord “Stop”. Dit Actionscript is klaar, je zet de film stop, zodat niet onmiddellijk de hele tijdslijn afgespeeld wordt.


Klik het Actionscript venster weg.



Maak een nieuwe laag, en noem die “knop”.

Ga op frame 1 van de laag “knop” staan en sleep de knop op de stage.

Neem de piiltjes toets, klik op de knop “Play”

Klik rechtermuisknop en selecteer “Handelingen”

Aan de linkerkant kies jen nu voor “on”, daarna “release”.

Tussen de accolades plaats je GotoAndPlay, en tussen de haakjes 30


Maak een nieuwe laag “bal” aan.

Ga op frame 30 staan en selecteer alle lagen

Voeg een nieuw hoofdframe in.


Plaats op de laag bal op frame 30 “mc_bal.”

Plaats op frame 60 op alle lagen een nieuw hoofdrame.



CTRL+ALT+ENTER


Voila, de bewegende bal.







Flash URL
http://www.flash-here.com/tutorials/flash_hyperlink_btn.html

Annimated buttons.
http://nl.youtube.com/watch?v=hMzhJOCY6ik

Geluiden:
http://www.a1freesoundeffects.com/button.html
http://www.flashfiles.nl/categories.asp?TypeId=17