Articoli con Tag ‘Flash’


Flash e il riutilizzo del codice: componenti e librerie condivise

Nell’ottica della programmazione ad oggetti viene spontaneo realizzare componenti per riutilizzarli in altri progetti, soprattutto se questi componenti sono general-purpose. L’uso delle classi è sicuramente un primo passo nel riutilizzo del codice, tuttavia, spesso, queste classi sono legate a MovieClip anche estremamente complessi. Così nasce la necessità di “importare” sia il codice ActionScript della classe (cosa assai facile) ma anche tutti i simboli ad esso associato.

Creare Componenti in Flash

Componenti Flash Questa strada è sicuramente la più corretta da un punto di vista strettamente logico. Tuttavia, almeno nella versione Flash MX, creare un componente che quantomeno si avvicini a quelli forniti con l’ambiente di sviluppo non è impresa da poco. I componenti, infatti, soprattutto quelli visuali, richiedono tutta una serie di procedure (come l’inclusione delle interfacce UIObject o UIComponent) e la scrittura estremamente accurata della classe legata al nostro componente. Rimane comunque il fatto che creare un componente è un’esperienza interessante da fare, ma il tempo di sviluppo è davvero notevole. Inoltre un componente come si deve supporta la modalità in designtime o authortime che altro non fa che proporre un’anteprima di quello che accadrà a runtime. È possibile associare un’icona e una documentazione perfettamente integrabile nell’IDE di Flash, con tanto di intellisense durante la scrittura del codice. Ecco quindi che scegliere questa strada comporta un dispendio temporale notevole, probabilmente riservato a particolari progetti dove, ad esempio, sia proprio il componente l’obiettivo del progetto.
Ci sono software house specializzate nella produzione di componenti per Flash, sia come prodotti gratuiti che a pagamento. Esclusi quindi i componenti estremamente semplici, dove ad esempio non c’è interfaccia utente, questo metodo è ottimo ma temporalemte dispendioso e quindi poco usato nella maggioranza dei casi.

Continua...

Fullscreen in Flash dal browser

Flash ha sempre supportato la modalità a schermo interno (fullscreen) sia nel Player stand-alone che nel proiettore. Questa modalità ancor oggi viene pienamente supportata e non ha subito modifiche. Adobe ha invece recentemente introdotto la possibilità di attivare il fullscreen direttamente nei filmati visualizzati nel browser. È stata introdotta una nuova e semplice funzionalità ActionScript che lavora sia con i player stand-alone che con i player browser. Per rendere il fullscreen fuzionante bisogna operare anche lato HTML, aggiungendo un nuovo parametro allowFullScreen nei TAG <object> ed <embed>. Tutto il resto è demandato al motore interno di Flash.
Questa nuova funzionalità ha comunque alcune restrizioni che bisogna conoscere, prima tra tutte l’uso del Flash Player versione 9.0.28.0 o superiore. Inoltre, ricapitolando:

  • Sul Browser dev’essere installata la versione del Player 9.0.28.0 o superiore
  • I developer devono aggiungere un nuovo parametro allowFullScreen nei Tag <object> e <embed>. Questo parametro è impostato normalmente a false e non permette il fullscreen. Per permettere il fullscreen bisogna esplicitamente impostarlo a true.
  • Un Box di dialogo verrà mostrato quando si entra in modalità fullscreen e indicherà all’utente come uscire da tale modalità. Questo Box sarà visibile per pochi secondi, passati i quali scomparirà da solo.
  • L’attivazione del fullscreen da ActionScript può avvenire solo in risposta di un click del mouse o tramite la pressione di un tasto, qualsiasi altra modalità verrà ignorata in ActionScript 2.0 e scatenera una eccezione throw in ActionScript 3.0.
  • Durante la modalità di fullscreen non è possibile utilizzare la tastiera. L’utente finale non può quindi inserire o modificare testi. L’unica risposta alla tastiera è riservata alla combinazione di tasti usata per uscire dalla modalità di fullscreen (la pressione del tasto ESC)

Codice ActionScript

Il codice necessario per impostare il fullscreen è semplicissimo e sfrutta l’oggetto Stage discusso su questo Blog in StageExt Class: filmati ridimensionabili in Flash:

1
Stage["displayState"] = "fullScreen";

Continua...

MagicLetter Flash Class: una classe per le scritte magiche

Come promesso ecco la versione aggiornata del simpatico effetto delle scritte magiche. Ho realizzato una diversa animazione per la “lettera”, per mostrare quanti effetti si possono fare. Il sorgente completo potete scaricarlo qui.

Loading Flash Player...

Classe MagicLetter

Questo è il codice della Classe che, ovviamente, può essere modificato e migliorato ulteriormente. Ad esempio è possibile inserire un parse per supprotare un simbolo di “nuova linea”, per andare a capo insomma. Possono essere introdotte le funzioni di get e set per esportare alcune proprietà all’esterno, ed altro ancora.

Continua...

Scritte magiche in Flash

Questo che propongo è un articolo che scrissi nell’agosto del 2003 (titolo originale: Scritte magiche in Flash MX). Nonostante sia “datato” (ora userei un codice ActionScript differente), è a mio avviso un simpatico strumento utile per effetti davvero suggestivi. Proporrò più avanti, o fatelo voi, la versione aggiornata con l’uso delle classi…

MovieClip dinamici

L’elemento che gioca un ruolo fondamentale nell’architetura Flash è l’oggetto MovieClip. La possibilità di creare questo tipo di oggetti da codice conferisce a Flash una notevolissima potenzialità, rendendolo un decoroso ambiente di sviluppo davvero divertente. Grazie alla possibilità di aggiungere run-time oggetti di tipo MovieClip, vedremo quanto sia semplice realizzare l’effetto mostrato in figura 1.

Loading Flash Player...

Fig. 1 – Esempio di testo ad effetto

La classe MagicText_class

Visto che stiamo utilizzando la versione MX di Flash, facciamo le cose per bene e creiamo una classe MagicText_class da riutilizzare a nostro piacimento. Quello che stiamo per fare è definire una nuova classe MagicText_class, che erediterà tutte le caratteristiche di una classe MovieClip. In questo modo avremmo a disposizione un vero e proprio oggetto, la base per creare successivamente un componente Flash vero e proprio! Se lo desideriamo. Per ora soffermiamoci solo sulla nostra classe e vediamo come costruirla.

Continua...

Scrivere buon codice OO in Adobe Flash

Ecco alcuni consigli su come scrivere un buon codice Object Oriented (OO) in Adobe Flash, soprattutto per chi ancora usa la versione MX in attesa di passare alla CS3.

Organizzare le cartelle delle classi

Prima di tutto l’organizzazione delle classi rende il lavoro di manutenzione del codice estremamente più semplice. Inoltre è possibile creare una vera e propria libreria personale da poter riutilizzare in altri progetti. Flash usa una nomenclatura legata al filesystem, quindi l’organizzazione in cartelle si rifletterà anche sull’importazione delle classi. Se ad esempio creiamo la sequenza di cartelle “mylibrary/grafica/plot” e inseriamo una nostra classe ActionScript “PlotClass.as”, quando andremo ad importare la classe dovremmo usare:

1
import mylibrary.grafica.plot.PlotClass;

Se la libreria (cartella) “mylibrary” non si trova nella cartella del nostro filmato o progetto, usare l’impostazioni di pubblicazione di Flash per selezionare il percorso:

Impostazione percoroso librerie

Continua...

Estendere i MovieClip in Adobe Flash MX

Io utilizzo due tecniche per estendere le funzionalità di un MovieClip. La prima, utilizzata anche nelle precedenti versioni di Flash MX, usa la proprietà prototype, un puntatore alla superclasse (madre), come indicato nel manuale:

Un riferimento alla superclasse di un oggetto classe o funzione. La proprietà  prototype viene creata automaticamente e associata a qualsiasi oggetto classe o funzione creato. Questa proprietà è di tipo statico ed è specifica della classe o della funzione creata. Se, ad esempio, si crea una classe personalizzata, il valore della proprietà  prototype viene condiviso da tutte le istanze della classe ed è accessibile solo come una proprietà della classe. Le istanze della classe personalizzata non possono accedere direttamente alla proprietà prototype, ma possono accedervi mediante la proprietà __proto__.

Uno dei vantaggi nell’uso di prototype, soprattutto con i MovieClip, risiede nell’estensione di tutti i MovieClip, nessuno esluso. Di fatto si effettua un’estensione broadcast a tutti i MovieClip statici o dinamici. Ad esempio, una comoda estensione potrebbe essere:

1
2
3
MovieClip.prototype.move = function(x:Number, y:Number) {
    this._x = x; this._y = y;
}

Continua...

StageExt Class: filmati ridimensionabili in Flash

La tecnica del Fullsize (anticamera per il Fullscreen – di cui parleremo in seguito) era, fino a poco tempo fa, utilizzata soprattutto nelle applicazioni Flash (RIA), composte quindi da una più o meno complessa interfaccia utente, dove il contenitore (Adobe AIR, Browser o il Player stand-alone) ridimensionato dall’utente, costringeva ad un riposizionamento degli oggetti componenti il filmato. Al ridimensionamento del contenitore segue ovviamente una funzione di disegno o Refresh in grado di riposizionare i MovieClip o ridisegnare runtime l’interfaccia in base alle nuove dimensioni del contenitore. Oggi questa tecnica è utilizzata anche nei siti web più avanzati o articolati, rendondo l’interfaccia estremamente piì accattivante. L’implementazione di questa tecnica è abbastanza semplice e sfrutta sostanzialmente l’oggetto Stage nativo di Flash e introdotto con la versione MX. Per la sua implementazione ecco una classe che permette di ottenere le coordinate dell’area dello Stage:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
/**
 *
 * @file                StageExt.as
 * @author              Giovambattista Fazioli (g.fazioli@undolog.com)
 * @web                 http://www.undolog.com
 * @email               g.fazioli@undolog.com
 */
class StageExt {
    // release
    private var __release          :String = "1.0";
    // properties
    private var __movieWidth       :Number = 0;
    private var __movieHeight      :Number = 0;
    private var __left             :Number = 0;
    private var __right            :Number = 0;
    private var __top              :Number = 0;
    private var __bottom           :Number = 23;
    //
    function StageExt(w:Number, h:Number) {
        trace("StageExt::constructor");
        //
        __movieWidth = w;
        __movieHeight = h;
        //
        Stage.addListener(this);
    }
    /**
     * onResize() event
     */
    private function onResize() {
        trace("StageExt::onResize " + Stage.width + ", " + Stage.height);
        //
        var sw:Number = Math.round(Stage.width);
        var sh:Number = Math.round(Stage.height);
        var ow:Number = Math.round(this.__movieWidth);
        var oh:Number = Math.round(this.__movieHeight);
       
        // La coordinata x (in alto a sinistra)
       
        this.__left = -Math.floor(((sw - ow) / 2));
        this.__top = -Math.floor(((sh - oh) / 2));
       
        // La coordinata x (in alto a destra)
       
        this.__right = Math.round((sw + ow) / 2);
       
        // La coordinata y (in basso)
       
        this.__bottom = Math.round((sh + oh) / 2);
    }
    /**
     * Refresh()
     */
    public function Refresh() {
        onResize();
    }
    /**
     * Left - get
     */
    public function get Left():Number {
        return (__left);
    }
    /**
     * Top - get
     */
    public function get Top():Number {
        return (__top);
    }
    /**
     * Right - get
     */
    public function get Right():Number {
        return (__right);
    }
    /**
     * Bottom - get
     */
    public function get Bottom():Number {
        return (__bottom);
    }
    /**
     * MovieWidth - get/set
     */
    public function get MovieWidth():Number {
        return (__movieWidth);
    }
    public function set MovieWidth(v:Number) {
        __movieWidth = v;
    }
    /**
     * MovieHeight - get/set
     */
    public function get MovieHeight():Number {
        return (__movieHeight);
    }
    public function set MovieHeight(v:Number) {
        __movieHeight = v;
    }
}

Continua...

Note sul testing e debug in Adobe Flash

Una considerazione, ovvia ma sottovalutata, durante lo sviluppo di applicazioni in Adobe Flash: la differenza tra il Player utilizzato per il testing all’interno dell’IDE Flash e l’oggetto (ActiveX o EMBED) usato dal nostro browser. Chi possiede la versione “Macromedia” Flash MX (la versione 8 per intenderci, ma questo discorso in realtà vale per qualsiasi versione di Flash…) quando sviluppa un filmato e lo prova all’interno dell’IDE Flash manda in esecuzione il Player legato al pacchetto di sviluppo. Quando poi si pubblica il filmato sulla rete e lo si “prova” con il Player Flash del browser si potrebbero riscontrare alcune – sostanziali – differenze!

image image

 

Continua...

N3TV Interactive Platform

Cos’è?

N3TV Interactive Platform è la piattaforma interattivita di N3TV.it, nata da un’idea di Tommaso Tessarolo, “Blogger d’azione” che se discute di Net TV non rimane certo vincolato alle sole parole, ma agisce concretamente provando in prima persona che cosa vuol dire “fare Net TV”, proponendo strumenti software in grado di fornire un’interazione online di nuova generazione.
La piattaforma N3TV Interactive Platform ha quindi l’obiettivo di fornire interattività durante le numerose dirette televisive proposte su N3TV.it.

N3TV Interactive Platform
N3TV.it: una diretta con la N3TV Interactive Platform

Continua...

ActionScript 3.0 Performance

Io sono un estimatore di Adobe Flash CS3 e quindi di ActionScript 3.0. Ecco un demo, presentata alla conferenza Adobe in Giappone, che dimostra le capacità del nuovo motore di rendering sviluppato da Adobe, giusto per smentire strane voci su un “superamento” da parte di Microsoft Silverlight. Cliccate e muovete il Mouse, aumentando il numero di sfere!

Loading Flash Player...

Davvero notevole…

Continua...



Stop SOPA