Chi già programma con linguaggi lato server (es. come abbiamo avuto modo di imparare con il Corso PHP gratis ) tipo PHP o ASP.net, sapra’ molto bene l’importanza del concetto di query.
Con la query è possibile passare esplicitamente tramite l’url, parametri tra una pagina e l’altra del nostro sito. Questo avviene spesso per la creazione di aree ad accesso riservato, sistemi di Tracking, affiliazioni, banner rotation etc.
In Flash spesso di devono passare informazioni direttamente all’animazione, sia sito web che gioco o galleria fotografica.
Basti pensare ad un sistema di Tracking per monitorare l’efficacia di azioni promozionali con la visualizzazione di classici banner realizzati in Flash.
Spesso i miei clienti mi chiedono di implementare un sistema in grado di riconoscere da quale campagna pubblicitaria arrivano i navigatori, in modo da mostrare loro un’animazione flash personalizzata.
Come fare? Se ad esempio il mio cliente ha 3 campagne di marketing attive e vuole mostrare 3 animazioni diverse per i visitatori che arrivano dalla campagna A, B e C?
La soluzione è iniettare un codice all’applicazione Flash, che identifichi la campagna, e poi spostare l’animazione con AcionScript al fotogramma desiderato.
Il metodo più semplice per iniettare parametri ad un file Flash, è usare un attributo specifico del tag objetc ossia flashvars.
Questo è il classico codice per inserire un file swf all’interno di un file html, senza l’uso di javascript (per bypassare gli activeX di IE usare la versione con javascript).
Questo codice dovra’ essere modificato in modo che all’applicazione flash swf venga passato in modo dinamico la query, con cui sara’ opportunamente progettata la campagna promozionale.
In sostanza, all’interno di flashvars, dovrai inserire le coppie nome=valore dove valore deve essere eventualmente codificato per la presenza di spazi (tralascio)
Ovviamentela query dovra’ essere inserita in modo dinamico, per rispettare le esigenze del nostro cliente.
Qui finiscono le modifiche a livello di codice html. Ora è necessario intervenire sul codice ActionScript 3 della nostra animazione.
Come possiamo recuperare questo parametro: “campagna=A” oppure “campagna=B” oppure “campagna=C” e riuscire così a pilotare l’animazione nel punto desiderato?
E’ necessario usare una classe molto ben conosciuta a chi ha seguito il Corso ActionScript 3.0 : ossia la classe LoaderInfo grazie alla quale siamo in grado di recuperare la query passata tramite il tag object.
this.loaderInfo.addEventListener(Event.COMPLETE, appCaricata);
function appCaricata(e:Event)
{
var query:Object = this.loaderInfo.parameters;
var promozione:String = query.campagna;
// qui inserisco le azioni da compiere in base alla tipologia di campagna
}
Il tutto dovra’ essere testato andando a modificare il file html come indicato sopra oppure in ambiente di produzione, recuperando dinamicamente la query.
Per chi si avvicina al mondo di Flash provenendo da classico html e CSS, sorge spesso la domanda: il mio cliente vuole che il sito web realizzato in Flash si adatti alla dimensione della finestra del browser, ma come si possono riposizionare determinati oggetti sullo stage in seguito all’azione fatta dal navigatore?
E’ un tema molto controverso nei termini, quindi cercherò di fare piazza pulita, perchè prima di tutto è necessario capirci nei termini usati.
A differenza dei classici siti web realizzati in html senza tabelle o css in modo “elastico”, dove, non appena si ridimensiona la finestra, in automatico, la maggior parte degli elementi della pagina si riposiziona in modo da mantenere lo stesso layout della finestra più grande, in flash CS questo non è possibile.
Si può ricreare un effetto stile “zoom” della fotocamera, ossia si può rimpicciolire o ingrandire TUTTO il contenuto e quindi testo e immagini.
In questo caso è sufficiente impostare nella scheda scheda html delle proprietà di pubblicazione di Flash come indicato qui sotto:
E’ evidente che in questo caso, eventuali immagini raster, verranno sgranate se non di qualità e per notevoli ingrandimenti.
Come far sì che un oggetto, mantenga la stessa POSIZIONE relativa agli altri o ai bordi dello stage, senza un effetto di ingrandimento o rimpicciolimento al variare della dimensione della finestra del browser?
Se vogliamo avere un controllo su ogni oggetto presente sullo stage di Flash, e posizionarlo così come avviene per gli aerei delle freccie tricolore, è necessario intervenire sul codice actionscript 3.
Il primo passo è quello di bypassare le impostazioni di pubblicazione di Flash, intervenendo direttamente sul codice actionscript 3 con 2 semplici operazioni:
1) impostare implicitamente l’allineamento al bordo superiore sinistro
stage.align = StageAlign.TOP_LEFT;
2) e impostare l’assenza di “effetto zoom”, ossia assenza di ridimensionamento di tutti gli oggetti presenti sullo stage:
stage.scaleMode = StageScaleMode.NO_SCALE;
Il terzo passo è mettersi in ascolto del fatidico evento RESIZE, inviato ogni qualvolta l’utente ridimensiona la finestra di Flash Player o del browser:
Ecco un piccolo esempio, con un singolo oggetto di nome istanza “immagine_mc”, con punto di registrazione centrale, e che si riposizione sullo stage mantenendo sempre la posizione centrale, rispetto ai bordi della finestra.
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.dispatchEvent(new Event(Event.RESIZE));
stage.addEventListener(Event.RESIZE, riposizionoOggetto);
function riposizionoOggetto(e:Event):void
{
var imgY:Number = stage.stageHeight/2;
var imgX:Number = stage.stageWidth/2;
immagine_mc.x = imgX;
immagine_mc.y = imgY;
}
Attenzione che per visulizzare il tutto correttamente nelle opzioni di pubblicazione dovrai settare sempre Dimensione: Percentuale 100%
Finalmente dopo alcuni rinvii ecco la data ufficiale (12 aprile 2010) di presentazione della nuova suite della Adobe che promette interessanti novità per i software più usati dai professionisti come Flash CS5 e Photoshop CS5.
Certo molti di voi sono appena passati alla versione CS4 quindi sembra ridicolo passare dopo meno di 2 anni alla nuova versione ma per chi dovesse essere ancora con versioni datate dei software, penso a quelli che ancora usano Flash8 o Premiere 1.5 o Photoshop cs, di prendere in serie considerazioni l’investimento per rimanere così al passo con i tempo per almeno altri 4 anni.
Presto allora nuovi video sulle principali novità della nuova versione di FlashCS5.
Un mio personale augurio di buon anno 2010 a tutti i nostri corsisti. E’ stato un anno pieno di soddisfazioni personali, quindi desidero ringraziarvi tutti e darvi appuntamente per i prossimi nuovi video sul mondo della animazioni in Flash e non solo!
E’ notizia di oggi che la tanto attesa versione beta di Flash CS5 che, come annunciato al MAX 2009, doveva uscire entro l’anno, non sara’ disponibile. Un brutta notizia per tutti coloro volevano testare il nuovo supporto per lo sviluppo di applicazioni per iPhone.
Niente paura. Nel frattamepo potete tranquillamente continuare con lo studio di ActionScript 3.0 visto che in questo fronte il grosso delle cose non è cambiato.
In questo breve video di actionscript, vedremo le tecniche per permettere al navigatore di trascinare sullo stage oggetti di qualsiasi natura come se fossero liberi di posizionarsi in ogni punto. Tecniche molto utili per rendere flessibili le tue applicazioni e per creare simpatici giochi a premi per i navigatori del tuo sito.
Si è conclusa da pochi giorni il MAX 2009 in cui si sono svelate le prime novita’ sulla nuova versione di Flash CS5. La notizia ha fatto giro dei blog in meno di 3 gg suscitando simpatiche ironie:
“…. nella versione flash cs15 al posto del mouse il nuovo flash sara’ in grado di riconoscere i comandi vocali e scivere il codice in automatico….” oppure
“… nella versione flash cs923 le animazioni saranno tradotte dalla tua mente e renderizzate da Flash…”
“.. etc…”
Putroppo non ho partecipato personalmente, ma un mio amico era lì e mi ha riferito di scoscianti applausi (vedi video sessioni qui).
Applausi per lo più di sviluppatori di actionscript, che di veri e propri animatori, perchè putroppo le novità per chi deve creare animazioni sono a mio avvio un pò deludenti per un software di quel costo.
Certo, sono state apportate notevoli migliorie per quanto riguarda la gestione del testo (altre al testo di input e dinamico anche il nuovo testo TFL), integrando il software con la libreria actionscript Text Layout Framework, già peraltro integrata in Flex Builder, dando ai progettisti di applicazioni Flash maggior libertà creativa nella realizzazione di testi accattivanti e per la gioia di tutti di creare del testo SOTTOLINEATO !
E’ stata notevolmente potenziata la libreria dei pennelli dello strumento di decorazione con la possibilità di modificare il codice javascript del pennello e usarlo per apportare le proprie personalizzazioni.
Ma le novità più interessenti in realtà saranno riservate agli sviluppatori veri e propri, ossia chi scrive il codice actionscript perchè, rispetto al mondo Microsoft di Silverlight, Adobe non aveva ancora adottato Flash di un valido editor per scrivere velocemente il codice.
Ora è possibile attivare dei menu come microsoft “Intellisense” che permettono di scegliere al volo i metodi gli attributi di un determinato oggetto ed è possibile bypassare l’editor di flash optando per il più robusto Flash Builder.
Altra novità interessante sara’ la possibilità di creare applicazioni per Iphone in actionscript.
Insomma a mio avviso Flash sta sempre di più sta andando nella direzione di migliorare tutta la parte di sviluppo del codice a scapito forse di nuovi stumenti potenziati per la creazione di animazioni senza l’uso del codice actionscript (vedi aftereffects) che è quello che la maggior parte degli animatori “neofiti” vorrebbe!
Non preoccupatevi, ci sara’ nuovamente a disposizione una mini libreria di funzione già predefinite di actionscript da applicare ai propri progetti: a patto di sapere cosa sia actionscript
Dopo la centesima email che ho ricevuto sull’argomento ho deciso di creare un post che spieghi questa istruzione misteriosa (addFrameScript) non documentata nel sito della Adobe.
Sicuramente l’avrai vista non appena hai cercato di decompilare un file swf per “sbirciarne il codice” ed evitare quindi di comprare applicazioni con codice “spazzatura” dai diversi siti che offrono script a poco prezzo.
Ebbene a cosa serve e perchè viene creata da questi software di decompilazione?
Ogni qualvolta viene trovato del codice actionscript spalmato sulla linea temporale, grazie a addFrameScript è possibile racchiudere in modo elegante tutte le istruzioni sul primo fotogramma, in modo che queste risultino appartenere alla stessa classe principale o sottoclasse.
Sinceramente non ho mai trovato la necessità di usarla e forse questo è il motivo per cui non è inserita nell’Help Online della Adobe. Presumo sia una precisa volonta’ della Adobe di disicentivare l’uso del codice sparso nella linea temporale, ma se esiste significa che potrebbe avere qualche utilizzo pratico.
Mi sforzo quindi di pensare ad un esempio possibile utilizzo. Come avrai notato è possibile specificare diversi parametri in coppia NumeroFotogramma-1, Funzionedalanciare.
Questo potrebbe far venire in mente: se volessi eseguire una certa funzione in corrispondenza al raggiungimento del fotogramma 10 della linea temporale , come posso fare?
Semplice potresti scrivere una semplice classe documento del tipo:
package
{
import flash.display.*;
public class TestaddFrameScript extends MovieClip
{
public function TestaddFrameScript()
{
addFrameScript(9,mostroMsg);
return;
}
function mostroMsg():void {
stop();
}
}
}
In sostanza non appena viene chiamata la classe viene aggiunta l’istruzione di stop al fotogramma 10 della linea temporale. Così facendo se testassi il tutto inserendo all’interno del mio file flash una qualsiasi animazione costituita da più di 10 fotogrammi, vedrei che al fotogramma 10 si blocca tutto.
Riassumento: un metodo elegante per eliminare del tutto pezzi di codice sparsi sulla linea temporale è usare addFrameScript, oppure pianificare prima lo sviluppo del tuo progetto in modo che non ci siano pezzi sparsi qua e la’, cosa che per chi inizia ad usare ActionScript 3.0 potrebbe risultare a volte complesso.
Dopo alcuni giorni dal precedente post (scrivo solo ora perchè ho sempre poco tempo), google è passato ed e’ riuscito a leggere il contenuto di testo inserito all’interno del file swf presente nel post precedente. Questa è la schermata visualizzata da Google, che mostra chiaramente come, non solo il file swf sia stato indicizzato in modo isolato, ma come, anche tutto il contenuto sia visibile chiaramente e possa quindi essere mostrato nei risultati di ricerca. C’è da chiedersi se Google sia in grado di leggere il testo anche nell’ipotesi sia animato, visto che quello presente nel file .sfw precedente era stato inserito su di un livello apposito senza che subisse animazioni. Altra questione è come possa influire ed essere d’aiuto nel posizionamento per certe parole chiave di nicchia. In ogni caso questa piacevole conferma, fara’ sbizarrire anche i SEO più diffidenti nei confronti di Flash!
In questo secondo video vedremo come completare le nozioni base viste nella prima parte del video, per creare qualcosa di più accattivante ossia una maschera da usare per creare un effetto di transizione tra 2 immagini.
Una tecnica base molto utile e che ti permetterà di iniziare ad usare la tua immaginazione per la creazione di forme più complesse e accattivanti. Guarda adesso il video GRATIS qui sotto:
Per usare flash al 100% segui adesso uno dei nostri videocorsi professionali di CS3 e CS4.
"La semplicita' e' l'estrema perfezione" - Leonardo da Vinci?
"Nulla e' vero, se non cio' che e' semplice" (Johann Goethe).
"La semplicita' e' la forma della vera grandezza" (Francesco De Sanctis)
"Non c'e' grandezza dove non c'e' semplicita'" (Lev Tolstoy)
"In carattere, maniera, stile, in tutte le cose, la suprema eccellenza e' la semplicita'" (Henry Wadsworth Longfellow)
"The way to get started is to quit talking and begin doing." (Walt Disney)
Certo, sono state apportate notevoli migliorie per quanto riguarda la gestione del testo (altre al testo di input e dinamico anche il nuovo testo TFL), integrando il software con la libreria actionscript Text Layout Framework, già peraltro integrata in Flex Builder, dando ai progettisti di applicazioni Flash maggior libertà creativa nella realizzazione di testi accattivanti e per la gioia di tutti di creare del 
