Voorbereiding

In Flash programmeren wordt een bepaalde mapstructuur aangehouden.
We maken 5 mappen aan om alles gestructureerd te houden:

Uitleg:
PhotoGallery is de 'root' -map. De absolute basis van onze PhotoGallery.
assets is de map met de elementen. Hier komt de .fla en de .as in en de .xml.
images, spreekt voor zich denk ik ;-)
PHP, hier komen de PHP bestandjes.
includes, hier komen de functies etc.
deploy hier komt de uiteindelijke uitvoer. De .swf en de .html/.php

Zo nu hebben we de map structuur, maar we zijn er nog niet.
Start Macromdia Flash op!
Maak een nieuwe file aan, stel de dimensie (grootte) in. Ik doe dit nu op 750px bij 750px.

Belangrijk!
Klik op [file]>>[Publish Settings] (Ctrl+Shift+F12)
Hier stel je in: De swf naar de de Deploy map evenals de .html met als naam PhotoGallery (.swf/.html)
Dit doen we zodat we straks op publish gaan klikken of op Ctrl+Enter we niet door de hele computer .swf.tmp bestanden hebben staan.

Onze PhotoGallery gaat verschillende dingen bevatten.
Titel
Foto
Beschrijving

We gaan er nu voor zorgen dat deze ook beschreven kunnen worden. Ik doe dit bewust in Flash zelf. (Niet in ActionScript) Omdat het gewoon een heleboel extra werk gaat kosten. Als ik mij niet vergis moet dit wel gaan gebeuren in AS3.0 (de tijdlijn gaat verwijnen namelijk...:-( )
Klik op de tekst tool.
Maak een bovenaan een single-line 'Dynamic Text'. Geef gelijk de eigenschap mee. (ik heb Arial, vet, gecentreerd, 37px, zwart)
Geef hem de instance name titel_txt.

Maak nu onderaan de pagina een multiline Dynamic Text. Geef ook deze keer de eigenschappen mee (ik heb Arial, gecentreerd, 37px, zwart)

Nu gaan we de zogenaamde image_holder maken.
Klik de tekentool (vierkantje) aan en maak een vierkant. (bij mij 450px bij 450px) Selecteer het en maak er een MovieClip van (F8) met als titel imgholder. Geef hem dan de instance name; imgholder_mc.

Als laatste gaan we twee buttons maken. Gelukkig heeft Flash zelf een leuke library met knoppen. Klik op [Window]>>[Common Librarys]>>[Buttons]
Selecteer een leuke button en sleep hem naar je 'stage'. Kopieer hem en draai hem zodat je een vooruit en achteruit button hebt. Noem de ene button next_btn en de ander prev_btn.

Voorlopig zijn we klaar met de 'layout', bij ziet het nu zo uit:

« Lees de omschrijving en reacties