Tutorial per il Picture Viewer Flash

April 11

Tutorial per il Picture Viewer Flash


visualizzatori di immagini, a volte chiamati "gallerie di immagini" o "portafogli", visualizzazione di fotografie e altre immagini in un formato di presentazione-like. Un approccio tipico è quello di organizzare una serie di piccoli quadri, o "miniature", lungo il lato o la parte superiore della visualizzazione del documento zona conosciuta come la "fase" in Flash. Le miniature, se cliccato, mostrano una versione full-size dell'immagine vicino al centro della scena. In Flash, un metodo semplice e comune per la creazione di questo tipo di visualizzatore di immagini è quello di convertire le miniature per simboli pulsante e renderli cliccabili con ActionScripts base "Event Listener".

istruzione

Ottenere il Pictures pronto

1 Aprire le immagini in un programma di editing di immagini, come Photoshop o iPhoto.

2 Creare due copie di ciascuna immagine. Avrete bisogno di una versione full-size e una versione di anteprima. Le dimensioni e le dimensioni di ogni versione attuale dipenderà la dimensione del display destinato del filmato Flash visualizzatore di immagini e la dimensione originale e la forma delle immagini. Per 6 x 4 pollici foto, ad esempio, è possibile rendere le immagini full-size 400 per 300 pixel e le miniature 100 per 75 pixel.

3 Salva le immagini come file JPEG (.jpg). Dare ad ogni immagine alle dimensioni delle miniature e set di nomi corrispondenti. Ad esempio, denominare le miniature "thumbnail1.jpg," "thumbnail2.jpg", ecc il nome del corrispondente immagini full-size "picture1.jpg," picture2.jpg, "e così via.

Creazione del Picture Viewer in Flash

4 Avviare un nuovo filmato Flash FLA.

5 Impostare l'area di visualizzazione, o "stage", per la dimensione desiderata del visualizzatore di immagini. Per fare ciò, fai clic su "Modifica" nella barra dei menu e scegliere "Documento" per aprire la finestra di dialogo Proprietà documento. Cambiare la "larghezza" e campi di dimensione "altezza" alle dimensioni desiderate per voi filmato. Una buona, dimensioni sicuro è 766 x 700 pixel. Questa dimensione si adatta maggior parte dei monitor, senza costringere l'utente a scorrere verso destra e sinistra per vedere l'intera pagina.

6 Importare i file di immagine in film come questo: Fare clic su "File" sulla barra dei menu, scegliere "Importa", quindi selezionare "Importa nella libreria" dal sottomenu. Passare alla directory che contiene le immagini che si. Selezionarli e cliccare su "Apri".

7 Trascinare una miniatura dalla libreria sullo stage. Posizionarlo dove si desidera che il primo miniatura per visualizzare.

8 Pulsante destro del mouse sulla miniatura e scegliere "Converti in simbolo" dal menu a comparsa. Questo apre la finestra di dialogo Converti simbolo. Digitare un nome nel campo "Nome" campo, e quindi selezionare il pulsante "Button". Fai clic su "OK".

9 Vai al pannello delle proprietà (di solito visualizzata a destra del palco) e digitare "Button1" nel campo Nome istanza (primo campo nel pannello).

10 Fare clic con il fotogramma 2 nel pannello Timeline e scegliere "Inserisci fotogramma chiave" dal menu a comparsa.

11 Trascinare l'immagine alle dimensioni corrispondenti la miniatura è stato posizionato sulla fase precedente. Posizionare sul palco in cui si desidera le immagini di maggiori dimensioni da visualizzare.

12 Pulsante destro del mouse fotogramma 1 nel pannello Timeline e scegliete "Azioni" dal menu a comparsa. Tipo (o tagliare e incollare) il codice seguente nel pannello Azioni:

Stop()
ANDARE

button1.addEventListener (MouseEvent.CLICK, onClickPlay)
ANDARE

Funzione onClickPlay (evento: MouseEvent): void {
gotoAndPlay ( "2")
ANDARE
}

Questo script si ferma il film nel fotogramma 1 e ascolta per un clic sulla miniatura. Quando si "sente" un clic sulla miniatura, Flash gioca Frame 2, in cui è stato inserito l'immagine alle dimensioni corrispondenti.

13 Fare clic con il fotogramma 2 nel pannello Timeline e scegliete "Azioni" dal menu a comparsa. Digitare il seguente script nel pannello Azioni:

Stop()
ANDARE

Questo script si ferma semplicemente il filmato nel secondo frame, dove è posizionato il primo film full-size.

14 Ripetere questi passaggi per la seconda serie di immagini. Questa volta, però, dare il vostro simbolo del pulsante il nome di istanza Metti la tua immagine full-size nel fotogramma 3. Non dimenticare di inserire un "Button2." "Stop ();" script nel pannello Azioni nel fotogramma 3.

Il codice ActionScript a fare la seconda cliccabile miniature entra nel pannello Azioni nel fotogramma 1, sotto gli script messi lì in precedenza. Ecco lo script:

button2.addEventListener (MouseEvent.CLICK, onClickPlay2)
ANDARE

Funzione onClickPlay2 (evento: MouseEvent): void {
gotoAndPlay ( "3")
ANDARE
}

Si noti che in questo script "Button2" sostituisce "button1" all'inizio dello script. "OnClickPlay2" sostituisce "onClickPlay" in prime due righe, e "3" sostituisce il "2" in parentesi dietro "gotoAndPlay." Questo script ascolta per un clic sul secondo miniature (istanza nome "button2") e, quando sente un clic su quella delle miniature, gioca frame 3.

15 Ripetere questo processo per ogni serie di immagini. Per esempio, dare il terzo simbolo del pulsante il nome di istanza "button3." Posizionare l'immagine corrispondente alle dimensioni del fotogramma 4. Creare lo script evento Listener di nuovo (nel fotogramma 1), cambiando in modo che "button3" sostituisce "button2"; "OnClickPlay3" sostituisce "onClickPlay2" nelle prime due righe; e le "3" dietro "gotoAndPlay" viene sostituito con un "4"

Consigli e avvertenze

  • Flash è spietato quando si tratta di nomi di istanza e script. Se si riproduce il filmato e non funziona come previsto, controllare gli script e nomi di istanza.