Actionscript 3.0: MovieClip over MovieClip

Martedì 14 Ottobre, 2008

Appena uno sviluppatore Flash/Actionscript si appresta a scrivere una funzione simile ad un tooltip, si scontra immediatamente con il problema della propoagazione degli eventi tra MovieClip sovrapposti. Infatti se un MovieClip (B) si sovrappone ad un MovieClip (A) che risponde, ad esempio, ad un evento MouseEvent.Mouse_OVER, passando con il mouse sul MovieClip (B) più alto nessun evento verrà più intercettato dal MovieClip (A):

MovieClip over MovieClip

In questo scenario si presenta la necessità di inibire l'intercettazione degli eventi da parte del MovieClip (B). Questo è possibile impostando a false la property mouseEnabled:

Actionscript:
  1. mcb.mouseEnabled = false;

Post correlati

Actionscript Flash contest: erase tool

Domenica 3 Febbraio, 2008

Premetto subito: non si vince nulla! A parte l'orgoglio - caso mai - di aver risolto il problema.

QUEST - DOMANDA

Come si realizza un tool per cancellare, eliminare, ripulire, una "porzione" della grafica disegnata con le API di Actionscript 3.0?

Con Actionscript 3.0 alcuni oggetti visivi, come i MovieClip o gli Shape, espongono la proprietà graphics, un puntatore ad un altro oggetto che "serve" tutte le funzioni grafiche di disegno runtime. Ad esempio è possibile sviluppare una semplice applicazione di disegno. Questo oggetto graphics permette di disegnare qualsiasi cosa, ad esempio su un oggetto Shape, in modo semplice e rapido. Il problema è che una volta disegnato qualcosa è possibile ripulire tutto ma non una singola parte.

Disegnare una linea è facilissimo:

Actionscript:
  1. var myShape:Shape = new Shape();
  2. addChild(myShape);
  3. //
  4. myShape.graphics.lineStyle(2,0xff0000,1);
  5. myShape.graphics.moveTo(0,0);
  6. myShape.graphics.lineTo(100,100);

Disegnato qualcosa è possibile ripulire tutto con la semplice chiamata al metodo clear():

Actionscript:
  1. myShape.graphics.clear();

Ma se voglio "cancellare" solo un punto? Oppure dalle coordinate 50,50 a 100,100?

Cercando su Internet ho trovato numerosi esempi di "applicazioni di disegno" e, in effetti, nessuna supporta o propone lo strumento "cancella".

Avete qualche soluzione?

Post correlati

Actionscript 3.0: tutto con l’operatore new

Giovedì 31 Gennaio, 2008

Sempre nell'ottica di "uniformare", come già accaduto con gli eventi (vedi La nuova gestione degli eventi di Flash CS3 e Flash CS3: la nuova gestione degli eventi), una delle tante novità presenti in Actionscript 3.0 è la scomparsa di tutti quei metodi ad hoc dedicati alla creazione di particolari oggetti, come: createEmptyMovieClip() o il famosissimo attachMovie(). Con Actionscript 3.0 l'operatore new è sufficiente a svolgere tutte le operazioni di creazione. Un nuovo MovieClip, ad esempio, viene creato (runtime) con il seguente codice:

Actionscript:
  1. var mioClip:MovieClip = new MovieClip();
  2. addChild(mioClip);

image Ma veniamo al dunque! Se ho un simbolo nella libreria e voglio aggiungerlo runtime come procedo se attachMovie() è scomparso? La soluzione non è molto dissimile da quello che accadeva in Actionscript 2.0. Prima di tutto bisogna andare nel pannello di libreria, selezionare il simbolo e aprire la finestra proprietà. A questo punto spuntare la casella di concatenamento Esporta per ActionScript - come accadeva in Flash 8. Un simbolo di libreria ha sempre come Classe base flash.display.MovieClip, ma questo non ci interessa granchè. La cosa interessante, invece, è il parametro Classe che viene impostato di default (quando si spunta Esporta per ActionScript) con il nome del simbolo. Quello che è importante sottolineare è che questa è una nuova modalità di Flash CS3 (e quindi ActionScript 3.0). Il simbolo, per essere esportato, deve avere una Classe di riferimento. La curiosità risiede nel fatto che non siamo costretti a creare per forza una nostra Classe (estesa da flash.display.MovieClip), anche se potremmo farlo. Continua a leggere... »

Post correlati

10 motivi per passare ad Adobe Flash CS3

Lunedì 26 Novembre, 2007

2007-11-21_170314 Per alcuni sviluppatori basta sapere che esiste una nuova versione del loro pacchetto di sviluppo preferito per correre ad acquistare l'aggiornamento. Altri, e non a torto, mantengono una maggiore calma e "pretendono" di conoscere gli effettivi miglioramente della nuova versione prima di modificare le proprie abitudini. Nel caso di Adobe Flash CS3 non c'è molto da attendere, visto gli innumerevoli cambiamenti che ha subito il pacchetto da quando Macromedia è stata acquisita da Adobe.
Ecco, quindi, 10 semplici, ma importanti, motivi che, a mio personale parere, bastano per convincersi ad eseguire l'aggiornamento ad Adobe Flash CS3. Mi soffermerò, ovviamente, solo sulle caratteristiche che mi hanno colpito personalmente; questo non vuole essere un elenco esaustivo di tutte le numerose novità introdotte con la suite CS3, solo un volo radente per anticipare qualche features della versione CS3.

1. Installazione

L'installazione è gradevole e rapida, rispetto alle precedenti versioni. Si integra, tra l'altro, con tutti i prodotti Adobe (Dreamweaver CS3, Photoshop CS3 extended, ecc...) il che rende le operazioni di installazione/rimozione ed aggiornamento un vero piacere.

2. Compatibilità a ritroso

Una questione spesso sottovalutata, ma sempre tenuta in considerazione nella storia di Flash: la possibilità di gestire le precedenti versioni del prodotto. In Flash CS3 ci sono tutti gli strumenti sia per migrare che per manipolare le precedenti versioni dei nostri filmati. Troviamo questa possibilità sia nel debug (un debug separato per Actionscript 2.0 e Actionscript 3.0) sia in fase di compilazione del filmato. Scrivere da subito applicazioni Flash in Actionscript 3.0 potrebbe essere controproducente in determinati contesti. Se il vostro sito target ha un traffico notevole potrebbe capitare che molti utenti non hanno ancora installato le ultime versioni del Player Flash per il browser e quindi non vedrebbero il filmato. Tuttavia, come già detto, Flash CS3 permette di sviluppare applicazioni Flash mantendedo la compatibilità a ritroso e quindi non vedo in questo un grosso ostocalo nell'upgrade del prodotto.

3. Interfaccia grafica e IDE

Pannello ridotto ad icona Nuovo pannello Flash CS3 L'IDE di Flash CS3 (come quella di Dreamweaver CS3) è stata rivisitata al meglio. I pannelli (vedi figura qui a sinistra), spesso scomodi nelle precedenti versioni, sono stati completamente ridisegnati e adesso il loro uso è notevolemente meno invasivo. Pannelli in modalità icona Inoltre la possibilità di ridurre ad icona i pannelli (vedi figura qui a destra) è una vera trovata che rende l'interfaccia gradevole e funzionale. Quando un pannello si trova in modalità icona occupa molto meno spazio e con un semplice click è possibile aprire il pannello principale prima sempre visibile.
Tutta l'IDE, insomma, è stata rivista compresa la zona centrale con la finestra per l'editing grafico e del codice. Non vi segnalo tutti i cambiamenti altrimenti vi rovinerei la sorpresa...

Nuova IDE Flash CS3

Continua a leggere... »

Post correlati

Creare MovieClip modali in TopMost

Lunedì 12 Novembre, 2007

Illustrerò una tecnica per realizzare simboli (MovieClip) modali da usare similmente ai componenti Alert e Window di Flash. L'obiettivo è quello di mostrare un MovieClip sopra tutti gli altri, disabilitando - anche - l'accesso all'area sottostante e qualsiasi altro oggetto/componente presente. Ad essere sincero ho realizzato tutto ciò eseguendo un po' di reverse engineering dai codici Adobe, che sono in chiaro! Non ho proprio resistito ;)

L'artefizio che si usa, per disabilitare qualsiasi interfaccia presente al di sotto del nostro MovieClip, è quella di creare un MovieClip trasparente che prenda tutta l'area dello stage. A questo MovieClip, che non sarà praticamente visibile, si aggancia un metodo "nullo" sull'evento onRelease, stando attenti ad impostare la proprietà useHandCursor a false.

Prima di tutto creiamo un filmato con una qualsiasi interfaccia nello stage principale:

Interfaccia

Continua a leggere... »

Post correlati

Aggiungere proprietà ad un MovieClip

Venerdì 9 Novembre, 2007

Nel Post Estendere i MovieClip in Adobe Flash MX avevo illustrato alcune tecniche per estendere un MovieClip. In particolare avevo detto che l'uso di MovieClip.prototype non permetteva l'estensione di proprità ma solo di metodi:

[...] Due importanti limitazioni di questa tecnica sono:

  1. Non può essere applicata a tutti gli oggetti esposti da Flash
  2. Possono essere "aggiunti" solo metodi e non proprietà [...]

In verità è possibile, con un passaggio in più, aggiungere dinamicamente proprietà anche usando MovieClip.prototype. Prima dell'introduzione di function get e function set, infatti, Flash permetteva l'aggiunta di proprietà (in lettura/scrittura o solo lettura) tramite il metodo addProperty(). Nella pratica questo si traduce nell'invocazione del metodo addProperty() e nella definizione di due funzioni getter e setter. La setter può essere null così da creare proprietà in sola lettura. Ad esempio se volessimo estendere tutti i MovieClip con una nuova proprietà _alpha in grado di aggiungere un'animazione, basta scrivere il seguente codice:

Actionscript:
  1. function _get_alpha():Number {
  2.         return(this._alpha);
  3. }
  4. function _set_alpha(v:Number):Void {
  5.        new Tween(this, "_alpha", Strong.easeOut, this._alpha, v, 1, true);
  6. }
  7. MovieClip.prototype.addProperty("_alpha_tween", _get_alpha, _set_alpha);

Da questo momento in poi se abbiamo un simbolo "miosimbolo_mc" possiamo sfruttare questa nuova proprietà:

Actionscript:
  1. miosimbolo_mc._alpha_tween = 50;

Quello che non è possibile fare, invece, è sovrascrivere le proprietà esistenti; per questo motivo ho usato _alpha_tween invece di _alpha. Ecco, quindi, un buon motivo per usare comunque le Classi 2.0 per estendere - e derivare - eventuali MovieClip.

Post correlati

Flash: come inizializzare componenti nel costruttore di una classe

Martedì 6 Novembre, 2007

Quando si estente una classe da un MovieClip che continene altri oggetti (MovieClip, TextField, etc...) questi ultimi potrebbero non essere "pronti" all'interno del costruttore. Questo accade soprattutto quando si utilizzano altri MovieClip estesi o i componenti (controls) di Flash. Per risolvere il problema basta sfruttare l'evento onLoad ereditato dalla classe stessa. Ad esempio immaginiamo di avere un MovieClip che contiene un campo TextField (oggetto visuale statico interno a Flash) e un oggetto TextInput (controllo inserito dal pannello componenti) e si vuole impostare qualche proprietà durante il costruttore della nostra classe MiaClasse.

Esempio Creiamo un simbolo ed inseriamo al suo interno sia l'oggetto TextField (chiamiamolo text_txt) sia l'oggetto TextInput (textinput_txt). Associamo questo simbolo ad una classe che estende un MovieClip, chiameremo la nostra classe MiaClasse. Quello che vogliamo ottenere è che durante il costruttore della nostra classe MiaClasse vengano inizializzati questi due controlli. Se proviamo ad usare un codice come questo:

Actionscript:
  1. //
  2. import mx.controls.TextInput;
  3. //
  4. class MiaClasse extends MovieClip {
  5.     //
  6.     private var text_txt:TextField;
  7.     private var textinput_txt:TextInput;
  8.     //
  9.     function MiaClasse() {
  10.         trace("MiaClasse::costruttore");
  11.         //
  12.         text_txt.text = "Ciao";
  13.         textinput_txt.text = "Ciao";
  14.         //
  15.     }
  16.  
  17. }

Continua a leggere... »

Post correlati

Flash e il riutilizzo del codice: componenti e librerie condivise

Mercoledì 31 Ottobre, 2007

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 interfaccie 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 a leggere... »

Post correlati

Scrivere buon codice OO in Adobe Flash

Venerdì 19 Ottobre, 2007

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:

Actionscript:
  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 a leggere... »

Post correlati