Kennismaking met Flash CS3

Flash CS3

Deze tutorial is bedoeld om de omgeving en mogelijkheden van Flash CS3 in een beknopte vorm voor te stellen aan beginnende Flash CS3 gebruikers.

Bekijk hier een voorbeeld van deze Flash tutorial.

Open Flash CS3


Open een nieuw document : Klik op Flash File (ActionScript 3.0)

Wijzig de breedte van de Stage naar 350 pixels en de hoogte naar 200 pixels. Klik daarvoor in het Properties Panel op de knop Size.

Geef de achtergrond van de Stage een lichtblauwe achtergrond.

  1. Background color : #0099CC

Bevestig de wijziging door te klikken op OK.

Breng de Stage volledig in beeld (Kies voor Fit in Window onder de Timeline)

Toon de gridlines op het scherm via het menu View/Grid/Show Grid.

Selecteer het Oval Tool. Klik daarvoor op het Rectangle Tool tot er een submenu tevoorschijn komt.


Wijzig de instellingen van het Oval Tool als volgt :

  1. Stroke : zwart; 1 pixel; dikte : Solid
  2. Fill : #00CCCC

Stel ook Snap to Objects in : Snapping wordt gebruikt om objecten onderling te positioneren tijdens het tekenen of het verplaatsen door slepen.

Object snapping : om bijvoorbeeld een lijn te verplaatsen naar een hoek van een vierkant. Wanneer je het beginpunt van een lijn verplaatst, zal bij naderen van een hoek van een ander object, een snapring verschijnen.

Teken nu een cirkel op de Stage. Houd de shift toets ingedrukt tijdens het slepen om een perfecte cirkel te krijgen.

Selecteer het Selection Tool.

Selecteer alles m.b.v. Ctrl + A.

Zowel de blauwe cirkel als de zwarte rand zijn nu voorzien van witte puntjes.Converteer de cirkel naar een symbool door F8 in te drukken.

Geef als naam grCirkel, selecteer Graphic en plaats het focuspunt in het midden (Registration middelste kleine vierkantje). Bevestig met OK.

Centreer de cirkel in het midden t.o.v. de Stage. Klik eerst op Window en selecteer daarna Align om het Align Panel zichtbaar te maken. (Het Align Panel staat nu rechts op uw scherm)


Het symbool bij To stage moet actief staan. Klik op de 2 andere aangeduide symbolen om de cirkel zowel horizontaal als vertikaal te centreren ten opzichte van de stage.


Selecteer in de timeline frame 30 en maak er een keyframe van door op de functietoets F6 te klikken.

Maak de cirkel groter tot buiten de Stage. Gebruik hiervoor het Free Transform Tool en de shifttoets om het hoekpunt te slepen met behoud van de verhouding.


Selecteer frame 1 :

Maak een Motion Tween via de Property Inspector.

Selecteer de cirkel in frame 30 en stel in de Property Inspector keuzemenu Color de Alphawaarde in op 20.

Wijzig de layernaam in cirkel. Dubbelklik hiervoor op de naam Layer 1 en wijzig de naam in cirkel. Voeg een nieuwe layer toe, klik op het meest linkse symbool, en geef deze layer de naam ‘tekst’.

Selecteer frame 1 van de layer tekst.

Plaats in dit frame een statische tekst, Arial, 20 pixels groot en Bold. Selecteer daarvoor eerst het Text Tool.

In de Property Inspector wijzig je volgende waarden :

Klik ergens in de Stage en plaats volgende tekst : KENNISMAKING MET FLASH CS3

Let op : Om de invoer van tekst te beëindigen klik je niet op Enter maar wel ergens buiten de tekst.

  1. Selecteer de tekst en converteer deze naar een grafisch symbool (Ctrl F8).
  2. Positioneer de tekst in het midden van de Stage.
  3. Maak van frame 30 in de layer tekst een keyframe (F6) .
  4. Selecteer frame 1 in de layer tekst en vergroot de tekst tot buiten de Stage.

Maak een Motion Tween van de tekst. Deze moet 1 maal roteren in wijzerzin tussen frame 1 en 30.

Bekijk nu even uw gemaakte flash animatie door te klikken op Ctrl + Enter.

Je ziet dat de animatie telkens opnieuw begint. Dit kunnen we voorkomen door een ActionScript toe te voegen.

Selecteer in de layer cirkel het laatste frame en klik vervolgens op F9 om het Acion Panel te openen.

Vul volgende “actie“ in stop (); (vergeet de punt-komma niet !!)

Controleer opnieuw de animatie (Ctrl + Enter), nu stopt de animatie nadat deze 1 maal is uitgevoerd.

Bewaar het werkbestand via File >> Save as…

Publiceer eventueel in swf-formaat of html formaat om te gebruiken op uw website.

Tutorial gemaakt door Cocovijve

Nog vragen? Bezoek het forum...


Dreamweaver Developer Toolbox

Stem of voeg toe aan Uitleg over het gebruik van deze icons : Plaatsen/stemmen op MSN Reporter Plaatsen/stemmen op Bligg.be Plaatsen/stemmen op Netjes.be Plaatsen/stemmen op eKudos Plaatsen/stemmen op NUjij Plaatsen/stemmen op Grubb Tip dit artikel! Plaatsen/stemmen op Bligg.nl Stumble it! Voeg dit artikel toe aan Del.icio.us Voeg toe aan je Google bladwijzers Abonneer je op de RSS-feed van deze site Verstuur deze pagina per e-mail via Feedburner Maak een notitie op deze pagina met Fleck
Share This Post

Indien je het nuttig vond mag je altijd een bericht achterlaten of u inschrijven op onze nieuwsbrief om altijd op de hoogte te blijven.

Comments

Nog geen reacties.

Plaats een reactie

(verplicht)

(verplicht)