Flexgala Mixed RSS

-Utilizzare i Charts components in Flex 3 - IÂ° parte-

Thu, 07 Jan 2010 00:10:02 +0100

Una delle potenzialità messe a disposizione nel Flex Builder, nelle Flex SDK e nel futuro Flash Builder, è la possibilità di utilizzare i Charts components. Questi componenti, molto avanzati in verità, permettono allo sviluppatore di creare dei grafici (a barre, a torta, ecc..) con assoluta flessibilità. In questo tutorial vedremo come usarne alcuni. Creare un nuovo progetto Adobe Flex o Adobe AIR: Dal menu "File" andiamo su "New" quindi su "Flex Project" sia che vogliate creare un progetto Flex che Adobe Air. Nel pannello successivo inseriamo il nome del progetto nel box "Project name". Nel box "Project location" scegliamo invece il percorso della cartella principale del nostro lavoro. In "Application type" selezionate "Web application" se desiderate creare un lavoro in Flex, "Desktop application" se desiderate creare un lavoro in AIR. Lasciate invariato il pannello "Serve Technology". Nei due successivi pannelli lasciate invariate le cartelle di destinazione del progetto. Al termine cliccate su "Finish". Creare un file MXML Dal menu "File" andiamo su "New" quindi "MXML Application". Nel box "FileName" inserite il nome che volete dare al file. Lasciate invariata l'eventuale indicazione della cartella "src" come destinazione del nuovo documento MXML. Cliccate su "Finish". Come buona parte dei componenti Flex, anche i Charts components utilizzano l'ArrayCollection come sorgente dati del componente stesso, il DataProvider. Detto ciò, vuol dire anche che è possibile, se non del tutto auspicabile, utilizzare l'XML come sorgente di partenza dei dati da visualizzare tramite i Charts components. Ipotizziamo quindi un file XML di visite ottenute dal nostro sito: [code] [/code] Il file è molto semplice: ogni nodo "reg" indica, tramite i relativi attributi, il mese gli accessi e le pagine visitate. Salviamo questo file con il seguente nome: dataCharting.xml Queste informazioni possono essere mostrate tramite grafici in diverse maniere. Iniziamo con un semplice "AreaChart". Ora, subito sotto il tag "Application" inseriamo quanto segue: [code] [/code] Con queste due prime righe di codice abbiamo caricato e inserito, all'interno di un ArrayCollection, le informazioni contenute all'interno del file XML. Ora creeremo un pannello dove inseriremo alcuni Charts. Anzitutto inseriamo un Box orizzontale (HBox) per dare ordine al tutto. Quindi inseriamo un Panel e al suo interno in componente AreaChart, come indicato dal codice seguente: [code] [/code] Come avrete notato abbiamo indicato al componente AreaChart (chiamato "myChart") un dataProvider che altro non è che l'ArrayCollection "visite", chiedendo (tramite la proprietà "showDataTips") di mostrare a video i valori dei risultati estratti dal file XML. Quindi abbiamo specificato come asse orizzontale (asse delle Y) i valori desunti dalla proprietà "mese" del DataProvider dell'Area Chart. Una dei punti di forza dell'Area Chart è la possibilità di inserire contemporaneamente più valori da visualizzare. Ad esempio, vogliamo vedere nel nostro esercizio, non solo i valori delle pagine visitate ma anche quello degli accessi unici (che equivarebbero agli attriubuti 'visite' e 'pages' del file XML). Per fare ciò basterà inserire tante "AreaSeries" per quanti sono i valori da visualizzare. Tuttavia le aree colorate potrebbero accavallarsi una sopra all'altra nascondendo determinati valori. Possiamo allora, tramite la proprietà "areaFill" specificare che le aree disegnate dall'AreaChart siano leggermente trasparenti. I valori "sc2" ed "sc1" sono infatti i 2 "SolidColor" che ci permetteranno - secondo quanto indicato dalle due righe precedenti all'HBox - di colorare di rosso e blu le due aree, che abbiano però un colore di sfondo trasparente (alpha a 0.4). Salvate il file e provate. Il risultato dovrebbe essere orientativamente il seguente:

-JavaDay a Roma il 30 gennaio 2010-

Fri, 11 Dec 2009 12:13:39 +0100

A day in a differtent universe è quello che si vivrà partecipando alla quarta edizione del Javaday Roma, sabato 30 gennaio 2010. Una full immersion di sei ore ad altissima velocità verso nuovi universi di conoscenza. Un evento che permetterà a studenti, utenti esperti ed a semplici appassionati sia di approfondire la tecnologia sia di conoscere le ultime novità del mondo Java. La manifestazione, organizzata direttamente dai membri della community Java romana in maniera volontaria, ha coinvolto nelle scorse edizioni migliaia di professionisti. Durante l’evento si potrà consegnare alle aziende Sponsor il proprio curriculum vitae per avere nuove opportunità professionali. E’ possibile partecipare anche come relatori dei seminari sottoponendo la propria proposta al comitato tecnico tramite la Call for paper pubblica. L’ingresso al Javaday Roma è come sempre gratuito. Il Javaday ha come obiettivo quello di promuovere la tecnologia Java e tutto quanto può essere connesso ad essa. L’evento si distingue per l’alto contenuto tecnico degli interventi in programma e per l’entusiasmo della community che lo sostiene ed organizza in maniera volontaria da quattro anni. La Call for Paper per proporre un talk al Javaday Roma è aperta a tutti i membri della community: membri dei Java User Group, associazioni, società, relatori indipendenti, professori e studenti. I temi su cui sottoporre gli interventi tecnici sono legati al linguaggio Java ed alle sue possibili contaminazioni: open source, metodologie, nuovi linguaggi, web 2.0, tecnologie, approcci ed idee emergenti. Per aiutare i relatori a proporre gli interventi sono state pubblicate delle linee guida sul sito dell’evento. La data ultima per inviare la presentazione di un talk tecnico è martedì 22 dicembre 2009, tramite l’apposito modulo online. Le proposte accettate dal comitato del Javaday saranno comunicate ai proponenti i primi giorni di gennaio 2010 e successivamente inserite nel programma ufficiale della conferenza. Per ogni informazione: http://roma.javaday.it/

-Adobe AIR 2 beta su Adobe Labs-

Wed, 09 Dec 2009 00:10:02 +0100

Già da qualche giorno è disponibile la nuova versione beta di Adobe AIR. Molte sono le novità che questa release presenta. Anzitutto, dato il sempre maggiore sviluppo di dispositivi touch screen (soprattutto dopo l'arrivo dell'iPhone), la possibilità di gestire applicazioni che siano distribuite su tali dispositivi. Il WebKit aggiornato alla versione HTML5 con CSS3 ed altro ancora. Potermo così utilizzare - senza rischio alcuno - le nuove feature dei CSS3 come l'inserimento di ombre esterne, utilizzo del font diverso dagli standard, disegnare bordi smussati sugli elementi della pagina e tanto altro ancora ... La nuova versione prevede inoltre la tanto attesa possibilità di aprire applicazioni di default per particolari tipi di file. Sono state introdotto nuove APIs per la gestione di elementi multimediali come il microfono. E' aumentata la sicurezza secondo gli standard attualmente richiesti e tanto altro ancora. Per maggiori informazioni e per il download di quest'ultima versione vi rimandiamo direttamente al sito Labs di Adobe. Sul sito troverete disponibile ovviamente il nuovo runtime e le SDK.

-FITC 2010: pronti per la 3Â° edizione!-

Sun, 22 Nov 2009 23:52:25 +0100

Nel 2010 si terrà ad Amsterdam il 22 e 23 febbraio: segnate queste date sulla vostra agenda, mi raccomando! E' assolutamente vietato mancare! E visto che gli organizzatori si aspettano il tutto esaurito come negli anni passati, il consiglio è AFFRETTATEVI a registrarvi all'evento. Speakers di risonanza internazionale tratteranno gli argomenti più attuali e interessanti del mondo Adobe, con programmi fitti fitti. Per registrarvi e i ticket, cliccate qui. Non perdete quest'occasione, perchè, detto tra noi, ci si diverte moltissimo! Per gli iscritti di FlexGALA è disponibile uno sconto del 10% sul costo del biglietto

-Verso la creazione di Rich Web Applications con le novitÃ di Spring 3.0 e l'integrazione con Adobe Flex-

Wed, 18 Nov 2009 17:20:29 +0100

Un evento unico, completamente gratutito, condensato in 3 ore dense di contenuti e anteprime. Per la prima volta in Italia verrà presentata ufficialmente da SpringSource la nuova versione di Spring 3.0 e gli scenari di integrazione con il potente presentation tier Adobe Flex, grazie alla partecipazione di Comtaste (Spring Training Center e Adobe Solution Provider) Dedicato a IT manager e sviluppatori che vogliono capire come realizzare applicazioni robuste e affidabili senza rinunciare all'appeal di un elevato livello di user experience. Tra tutti i partecipanti verranno sorteggiati dei libri editi dalle case editrici O'Reilly e FriendsofED. La partecipazione è gratuita ma è necessaria l'iscrizione registrandosi cliccando sul tasto Register nella sezione Ticket Information. Agenda 14.45 Registrazione Partecipanti 15.00 Presentazione dell'evento e degli speaker 15.15 Spring 3.0 and the new REST support 16.30 Integrare Spring con Flex 3 17.45 Sessione di Q&A 18.00 Fine lavori Sessione 1 (in lingua inglese) - Spring 3.0 and the new REST support, Speaker: Rossen Stoyanchev (SpringSource) One of the major new themes of Spring 3.0 is the support for REST in Spring MVC. This talk will investigate these features from the perspective of a web application developer and discuss them in the context of JAX-RS, the Java Standard for RESTfulWeb Services. If you're familiar with JAX-RS you can relate your knowledge to Spring MVC. If you're an existing Spring MVC user can learn about major developments in the areas of data binding, validation, and type conversion as well as how Spring MVC compares to JAX-RS, a topic that's likely to come up in your organization. Sessione 2 (in lingua italiana) - Integrare Spring con Flex 3, Speaker: Marco Casario (Comtaste) SpringSource announced Spring BlazeDS Integration, a new open source project to provide tight integration between Spring and Adobe BlazeDS, Adobe’s open source server-based Java remoting and Web messaging technology. This open source project will make it easy for Java and Spring developers to create enterprise-class rich Internet applications (RIAs) using Adobe Flex software, a cornerstone of the Adobe Flash Platform, and Spring, the de facto standard for enterprise Java. Biografia Rossen Stoyanchev is a senior consultant at SpringSource. In his career he has worked on a trading and risk management application, an investment accounting system, e-commerce web applications, and others. Rossen joined SpringSource in March 2007. He specializes in Web technologies and is part of the Spring Web team. He created the 4-day "Rich Web Development With Spring" course that allows attendees to become SpringSource certified Spring web application developers. Marco Casario Chief Technology Officer di Comtaste e Adobe Guru, è autore di molti testi per editori come O'Reilly, FriendsOfED, Apress e Wrox. Partecipa come speaker a conferenze di livello internazionale come la Adobe MAX, FlashOnTheBeach,AJAXWorld Conference FlexCamp, O'Reilly Web 2.0 Summit, MultiMania, FITC. Marco è un Adobe Certified Instructor (ACI) e un Adobe CertifiedExpert. Le informazioni complete sul profilo si possono trovare sull'account personale di LinkedIN: http://it.linkedin.com/in/marcocasario

-Nuovi e-seminar per FlexGALA in calendario-

Mon, 09 Nov 2009 00:22:26 +0100

Come preannunciato lo scorso settembre, alla ripresa post-vacanze, eccoci con il primo appuntamento al quale faranno seguito altri eventi in calendario. Si comincia il 30 novembre presentando la nuova versione di Adobe Flash Builder 4. L'e-seminar durerà 60 minuti circa ed è rivolto a tutti coloro che vogliono conoscere la nuova versione ma anche cominciare ad accostarsi a Flex. L'evento è ovviamente gratuito, ma è indispensabile la registrazione al nostro sito! Non mancate, poichè a breve pubblicheremo altre date con altri interessantissimi appuntamenti ma soprattutto ci saranno nuovi incontri live.... stay tuned! Per maggiori informazioni riguardo al prossimo evento online, vi rimando ovviamente alla pagina dei nostri e-seminar!

-Altri esempi di animazione in Flash Builder 4-

Mon, 02 Nov 2009 00:10:48 +0100

In questo articolo, che prosegue il precedente, mostreremo come creare alcune semplici animazioni in Flash Builder 4 utilizzando esclusivamente i componenti a disposizione in Flex 4. Creare un nuovo progetto Adobe Flex o Adobe AIR: Dal menu "File" andiamo su "New" quindi su "Flex Project" sia che vogliate creare un progetto Flex che Adobe Air. Nel pannello successivo inseriamo il nome del progetto nel box "Project name". Nel box "Project location" scegliamo invece il percorso della cartella principale del nostro lavoro. In "Application type" selezionate "Web application" se desiderate creare un lavoro in Flex, "Desktop application" se desiderate creare un lavoro in AIR. Lasciate invariato il pannello "Serve Technology". Nel successivo pannelli lasciate invariate le cartelle di destinazione del progetto. Nel successivo pannello scegliete dalla voce "Component set" l'opzione "MX only". Al termine cliccate su "Finish". Creare un file MXML Dal menu "File" andiamo su "New" quindi "MXML Application". Nel box "FileName" inserite il nome che volete dare al file. Lasciate invariata l'eventuale indicazione della cartella "src" come destinazione del nuovo documento MXML. Cliccate su "Finish" Una delle caratteristiche tipiche di Flex 3 e di Flash Builder 4 è proprio nell'avere insite nei propri componenti alcune transizioni, oppure nell'avere a disposizione componenti per filtri. Per l'occasione creeremo un'interfaccia in cui l'utente, inserendo un percorso di un'immagine, vedrà apparire l'immagine richiesta con un semplice effetto di Fade In (o Fade Out in uscita) con un effetto di Ombra esterna aggiunta alla foto. Più o mneo come mostrato nella seguente immagine: Cominciamo quindi impostando anzitutto il filtro che utilizzeremo sul'immagine: [code] ?xml version="1.0" encoding="utf-8"?> [/code] Dopo aver creato l'Array di filtri () abbiamo inserito un "DropShadowFilter con distanza di 10 pixel dall'immagine e un angolo di inclinazione di 127 gradi. Quindi impostiamo gli elementi della nostra interfaccia: [code] [/code] Come è possibile leggere dal codice è bastato impotare la visibilità dell'immagine al click dei due pulsanti , quindi come parametri "showEffect" ed "hideEffect" il valore "Fade" per farci restituire l'effetto richiesto. In aggiunta abbiamo impostato il valore della proprietà "toolTip" per farci restituire il valore dell'immagine. Ora basterà salvare e provare il lavoro. Possiamo già testare l'applicativo. Cliccate sul tasto di scelta rapida CTRL+F11 oppure cliccate su "Run nomeApplicazione" dal menu "Run".

-Gestire le animazioni in Flash Builder 4-

Sat, 24 Oct 2009 16:31:33 +0200

In questo articolo vedremo come realizzare delle animazioni in Flex 4 utilizzando la nuova versione (beta) di Adobe Flash Builer 4. Diversi sono infatti i cambiamenti che riguardano questo aspetto così come diverse sono le possibilità che abbiamo a disposizione. Vediamo come in questo articolo!! Creare un nuovo progetto Adobe Flex o Adobe AIR: Dal menu "File" andiamo su "New" quindi su "Flex Project" sia che vogliate creare un progetto Flex che Adobe Air. Nel pannello successivo inseriamo il nome del progetto nel box "Project name". Nel box "Project location" scegliamo invece il percorso della cartella principale del nostro lavoro. In "Application type" selezionate "Web application" se desiderate creare un lavoro in Flex, "Desktop application" se desiderate creare un lavoro in AIR. Lasciate invariato il pannello "Serve Technology". Nel successivo pannelli lasciate invariate le cartelle di destinazione del progetto. Nel successivo pannello scegliete dalla voce "Component set" l'opzione "MX only". Al termine cliccate su "Finish". Creare un file MXML Dal menu "File" andiamo su "New" quindi "MXML Application". Nel box "FileName" inserite il nome che volete dare al file. Lasciate invariata l'eventuale indicazione della cartella "src" come destinazione del nuovo documento MXML. Cliccate su "Finish" Come esempio di animazione creeremo due "State" posizionando o aggiungendo oggetti (Panel) nei vari stati. Tramite i componenti "Transition" animeremo il tutto. Come primo passo quindi creiamo gli stati: [code] [/code] Quindi inseriamo gli oggetti interessati. Cominciamo con un Panel iniziale: [code] [/code] Come noterete, per cambiare semplicemente posizione ad un oggetto basterà variare la proprietà interessata (ad esempio "y") in "y.secondPage" specificando quindi il nome dello state in cui il pannello dovrà cambiare posizione! Per quanto riguarda invece l'aggiunta del secondo pannello (chiamato "secondPanel") nel secondo State, basterà utilizzare la proprietà "includeIn" . Semplice no? A questo punto non basterà altro che inserire il componente "transitions" per le animazioni: [code] [/code] E in linea di massima, rispetto alla versione di Flex 3 non cambia molto. Da un'attenta analisi noteremo come abbiamo chiesto a Flex di creare una transizione dallo stato principale "main" al secondo "secondPage" costruendo due animazioni seprate in sequenza ("Sequence"). Nella prima abbiamo una tripla animazione contemporanea ("Parallel") composta da "Move", "Blur" per il pannello principale, in contemporanea con il "Fade" del secondo pannello. Al termine di queste animazioni abbiamo un "Resize" del pannello principale. Inseriamo ora invece le animazioni per il "ritorno" allo stato principale: [code] [/code] Anche questa animazione segue la stessa logica... invertita! Ora basterà salvare e provare il lavoro. Possiamo già testare l'applicativo. Cliccate sul tasto di scelta rapida CTRL+F11 oppure cliccate su "Run nomeApplicazione" dal menu "Run".

-Learning Flex 3-

Sat, 17 Oct 2009 10:03:03 +0200

Learning Flex 3 Autore: Cole Alaric Editore: O'Really Pagine: 350 Giudizio: Molto Buono In effetti posso dire che questo era il testo che cercavo da un pÃ² per Flex! Esercizi mirati su specifici argomenti, dalla grafica alla gestione di Data Services. Sulla scia di altri testi della collana (abbiamo giÃ recensito "Learning ActionScript 3.0") anche qui la semplicitÃ disarmante dell'autore spiega le caratteristiche di Flex, come costruire correttamente una progetto Flex. Certo, all'indomani dell'uscita di Flash Builder 4, questo Flex 3 potrebbe essere obsoleto, tuttavia molte delle pratiche insegnate risulteranno essere valide anche per la nuova versione. Consigliato!

-Adobe Flash Catalyst: una overview-

Sat, 17 Oct 2009 09:41:13 +0200

Oggi vedremo una veloce overview di Flash Catalyst, il nuovo prodotto Adobe per la creazione di Rich Internet Application per grafici. In verità Flash Catalyst, come dice il nome si pone come punto di raccordo tra grafici e sviluppatori i quali finalmente possono interagire tra loro senza problemi... o quasi. Grazie al formato FXP, il progetto Flex potrà essere aperto in Flash Builder 4 o Flash Catalyst. Partiamo quindi dall'inizio e vediamo cosa Flash Catalyst permette di fare: Anzitutto dalla schermata introduttiva già possiamo vedere come realizzare progetti partendo da un file di Photoshop od Illustrator oppure creare un nuovo progetto vuoto di Flash Catalyst (FXG file). Flash Catalyst è soprattutto pensato ai grafici che da oggi potranno creare RIA senza troppi problemi. Ecco spiegato quindi, rispetto a Flash Builder 4, la presenza degli strumenti di disegno con possilibilità di convertire gli oggetti disegnati in componenti come Button, Combo, CheckBox, ecc.. Guardando bene la figura precedente, in effetti assomiglia molto a Flash Professional , con tanto di Libreria!! Una delle caratteristiche sin dalle prime versioni di Flex era la suddivisione di un progetto in pagine. Questa suddivisione avveniva tramite gli "States" che permettevano di impostare la presenza o meno di determinati elementi. Flash Catalyts ovviamente eredita questa impostazione. Per creare pagine del vostro progetto potete creare diverse pagine, come mostrato nella figura sottostante: Come Flash Professional, anche Flash Catalyst ha una timeline dove poter creare animazioni. Certo, non è quella di Flash Pro, però sarà sempre molto utile per creare animazioni, impostarne la durata, e altro ancora. Possiamo quindi intendere fondamentalmente che Flash Catalyst cercherà di fare da "via di mezzo" per i grafici abituati a Flash Professional ma allo stesso tempo di creare un progetto che sia gestibile anche in Flash Builder 4 per gli sviluppatori e che, viceversa, gli sviluppatori possano restituire il progetto ai grafici per qualunque tipo di modifiche senza compromettere il lavoro. Forse sarà un luogo comune che i grafici non amano tanto il codice, sta di fatto che quello generato da Flash Catalyst (in vista "Codice", come Dreamweaver) è immodificabile!!! Per la serie: giù le mani dal mio codice!!! Se in questa visualizzazione provate a modificare il codice, vi sarà impossibile!!! Per chi fosse interessato a scaricare questo prodotto, Adobe Flash Catalyst è presente in versione demo beta 2 sul sito Adobe Labs.

-Flash Builder 4 beta 2: una overview-

Fri, 09 Oct 2009 21:54:09 +0200

Da qualche giorno sul sito Adobe Labs è possibile scaricare gratuitamente in prova per 60 giorni Adobe Flash Builder 4, la nuova versione del Flex Builder che, come molti di voi sapranno, da questa versione cambia nome con ovvie aggiunte e miglioramenti. Già diverso tempo fa, dopo il MAX dello scorso anno, abbiamo presentato alcune novità della beta 1, vediamo oggi quella della beta 2. Una delle prime significative modifiche, rispetto a Flex Builder 3 e Flash Builder 4 beta 1 è la possibilità di scegliere il component set. Oggi infatti oltre al set "mx" disponibile da sempre in Flex abbiamo anche il set "Spark". In fase di inizializzazione del progetto potremmo scegliere quale usare, come è possibile vedere dall'immagine seguente: Ecco le differenze grafiche di defalut, cioè come si presentano i componenti con le impostazioni appunto di default: E i relativi codici: MX COMPONENT: [code] [/code] SPARK COMPONENT: [code] [/code] Nascono poi con il set SPARK alcuni nuovi componenti di layout: Border, DataGroup, Group, Skinnable Container, SkinnableDataContainer che permetteranno una più facile e customizzabiile gestione del layout delle applicazioni. E proprio sulla customizzazione delle applicazioni che Flash Builder gioca le sue carte. E' possibile ad esempio cambiare con più facilità alcuni informazioni generali del progetto con pochi click, come colori di rollover, selezione, formattazione del testo. Vedi l'immagine seguente: Come non considerare poi i data services disponibili per applicazioni Flex: BlazeDS, LiveCycle, componenti PHP, e altro ancora: Come non ricordare poi altre importanti novità come la possibilità, se in possesso di Flash CS4, di creare componenti su misura con Flash CS4, di cui abbiamo già parlato in un nostro precedente articolo sulla beta 1. Last but not least: miglioramenti per la creazioni di animazioni via codice, sostanzialmente migliorato rispetto a Flex 3 ma invariato dalla beta1. Anche di questo già ne avevamo parlato in questo articolo. Che dire quindi? Una nuova versione... full options!! Flash Builder 4 è disponibile su Adobe Labs scaricabile gratuitamente per 60 giorni. Alla scadenza dei giorni disponibili potrete richiede, se in possesso di un seriale di Flex3 un ulteriore seriale per proseguire i vostri lavori Flex 4 Flash Builder based... :)

-Creare componenti SWC in Flash per progetti ActionScript di Flex 3 - IIÂ° parte-

Fri, 02 Oct 2009 15:27:17 +0200

In questa seconda parte vedremo come gestire lavori disegnati od organizzati in Adobe Flash CS4 e gestiti, nella programmazione, con Adobe Flex 3, ActionScript 3, e componenti SWC...in attesa delle nuove potenzialità di Flash Builder 4 e Flash Catalyst. L'idea di questo articolo nasce da un proposito prettamente personale, che forse qualcuno dei lettori potrà condividere, di trovare un'alternativa a Flash per scrivere codice. Qualcuno potrebbe obiettare che molti sono i programmi (soprattutto in ambiente Windows) che possono sostituire egregiamente Flash (stesso Flex, FlashDevelop, SE|PY, ...). Non altrettanto "facile" è però se lavorate in ambiente Mac o ancor di più Linux. Dato che Flex è disponibile (stand alone o plug-in di Eclipse) per tutte e 3 le piattaforme, ecco una soluzione - figlia della precedente parte di questo articolo: creare l'interfaccia del nostro applicativo in Flash (CS3 o CS4) convertire in simbolo di libreria le varie "parti" o "sezioni" che la compongono e trasformare da ultimo questi simboli in singoli file SWC (Shockwave Compiled) Per prima cosa, quindi, apriamo Flex e impostiamo il lavoro. Creiamo un nuovo progetto ActionScript che chiameremo ad esempio: flashSWC. Nel passo successivo, momentaneamente, non avendone ancora disponibilità, non dichiariamo nessun SWC. Concludiamo questo processo cliccando su "Finish". Riguardo alla pagina HTML che conterrà il file SWF, è preferibile crearlo appositamente in un secondo momento. Possiamo quindi togliere di mezzo la cartella "bin-debug" . Clicchiamo con il tasto destro sul progetto "FlashSWC" nel pannello "Flex Navigator" e cliccate sulla voce "Properties". Quindi nella sezione "Properties for FlashSWC" alla voce "ActionScript compiler" togliamo il segno di spunta da HTML wrapper. Confermiamo con OK anche sul successivo alert che ci avviserà della cancellazione della cartella "bin-debug". Ovviamente Flex avrà creato a questo punto il nostro file ActionScript dal nome "FlashSWC". Questo file sarà la Document Class del file Flash. Ora apriamo Flash CS3 o CS4. Creiamo un progetto ActionScript 3.0 e salviamolo subito, anche se completamente vuoto, nella cartella FlashSWC creata da Flex durante la fase di impostazione del progetto e chiamiamo il file, ad esempio FlashSWC.fla! :) Nel box "Document Class" di Flash (nel pannello Properties), scriviamo il nome del file ActionScript che abbiamo creato con Flex: FlashSWC. Sempre in Flash creiamo un elemento tipico (un pulsante ad esempio) che diventerà il nostro SWC da importare in Flex e gestire via codice in ActionScript 3. Creiamo un pulsante con una semplice forma rettangolare. Convertiamo la forma in MovieClip (è preferibile rispetto al simbolo pulsante). Chiamiamolo "MyButton". Apriamo ulteriormente il pannello di conversione del simbolo cliccando sul pulsante "Advanced", ora spuntiamo il checkbox "Export for ActionScript" e facciamo ben attenzione che nel box "Class" sia scritto ancora MyButton. Confermiamo cliccando su Ok. Nel successivo alert di avviso clicchiamo ancora sul pulsante "Ok". Riassumendo le impostazioni precedenti avremo: Ora che il simbolo è stato creato, cancelliamo l'istanza presente sullo stage senza eliminare quella presente in libreria. A questo punto, possiamo anche inserire (se ne abbiamo bisogno) codice ActionScript . Proviamo ad esempio ad inserire all'interno del simbolo un piccolo semplice metodo che richiameremo successivamente in Flex. Clicchiamo due volte sul simbolo in libreria, aggiungiamo un livello per le azioni sulla timeline e apriamo il pannello Azioni (F9). Ora scriviamo, ad esempio, questa semplice istruzione: [code] function oggi() { var giorno:Date=new Date(); trace("Oggi è il "+giorno.getDate()+" "+(giorno.getMonth()+1)+" "+giorno.getFullYear()); } [/code] Fatto ciò, ovverosia, completata la creazione grafica e di codice del componente, creiamo il file SWC. Apriamo la libreria, tasto destro sul simbolo di libreria, clicchiamo sulla voce "Export SWC". Salviamo questo file nella cartella del progetto FlashSWC e creiamo qui una cartella per i componenti, chiamata ad esempio "comp". Chiamiamo il file come il simbolo: MyButton Ora torniamo a Flex e cominciamo a scrivere codice e a utilizzare questo componente. Anzitutto riapriamo (click con il tasto destro) le proprietà del progetto. Quindi nella sezione "ActionScript Build Path" scegliamo il tab "Library Path" e clicchiamo sul pulsante "Add SWC". Cerchiamo il file SWC che abbiamo creato nei passaggi precedenti e confermiamo il tutto cliccando su OK. Conferiamo tutti i pannelli di proprietà di Flex cliccando su OK. Ora che il nostro componente è stato aggiunto, utilizziamolo! Anzitutto inseriamolo sullo Stage. Modifichiamo quindi la nostra classe FlashSWC nella seguente maniera: [code] package { import flash.display.Sprite; public class FlashSWC extends Sprite { private var mioPulsante:MyButton; public function FlashSWC() { mioPulsante=new MyButton(); mioPulsante.x=100; mioPulsante.y=100; addChild(mioPulsante); } } } [/code] A questo punto se proviamo il filmato in Flash quanto in Flex avremo lo stesso identico risultato!!! Bello quanto ovvio, tuttavia questo processo significa ad esempio che una volta impostati tutti gli SWC necessari, possiamo pure continuare a lavorare in Flex senza usare Flash . Se il nostro grafico deve fare delle modifiche, basterà che ci reinvii il file SWC senza rimandare tutto il progetto Flash!!! Proviamo ora a richiamare codice presente nel file SWC. Modifichiamo la nostra Document Class nella seguente maniera: package { import flash.display.Sprite; [SWF(backgroundColor="0xFFFFFF", width="550", height="400")] public class FlashSWC extends Sprite { private var mioPulsante:MyButton; public function FlashSWC() { mioPulsante=new MyButton(); mioPulsante.x=100; mioPulsante.y=100; mioPulsante.oggi(); addChild(mioPulsante); } } } Questa volta, se lavoriamo in Flex proviamo in modalità "Debug" (abbiamo un trace) oppure semplicemente in Flash come siamo abituati a fare. Come noterete... abbiamo lo stesso risultato in Flex quanto in Flash. Dovete apportare modifche grafiche? Basterà cambiare gli SWC incriminati! Usate Flex 3 o Flash Buidler 4 o Flash CS4 e il vostro grafico la CS3 (o viceversa)? Basterà sempre che vi scambiate gli SWC!!

-Squiggly: creare un motore di controllo ortografico per applicazioni in ActionScript 3-

Fri, 25 Sep 2009 15:35:52 +0200

Di recente pubblicazione (il 21 settembre scorso) Adobe ha lanciato sul proprio sito Labs la preview di questa nuova libreria che permetterà di creare un motore di controllo ortografico in applicazioni Flex o Flash. Questa libreria, che necessita di Flash Player 10, può essere utilizzata anche in applicazioni Adobe AIR 1.5. Come potete vedere dalla figura sottostante, (esempio disponibile online, dal sito Adobe Labs) basandosi su un dizionario (attualmente disponibile solo in lingua inglese), permette la correzione runtime del testo presente all'interno dell'applicazione Flash/Flex/AIR. Disponibile in download la reference (Squiggly AS DOC) e alcuni esempi (in MXML per Flex). Per maggiori informazioni: http://labs.adobe.com/technologies/squiggly/

-Creare componenti SWC in Flash per progetti ActionScript di Flex 3 - IÂ° parte-

Wed, 16 Sep 2009 22:58:07 +0200

Partiamo dal fatto che Flash Builder 4 (ovvero Flex Builder 4) permetterà agli sviluppatori di creare componenti da Flash con due semplici click! Quindi molto lavoro per creare componenti personalizzati sarà agevolato. Vediamo invece in questo articolo come creare dei componenti da soli usando il formato SWC in Flash, creare delle classi per gestirli e impostarli quindi in un lavoro per Flex 3! Prima di iniziare però consideriamo i lati positivi di questo tipo di lavoro: se avete Flash CS4 e Flash Builder 4, quanto diremo non vi servirà a molto. Se uno dei due vi manca (se non addirittura entrambi) allora questo articolo vi sarà molto di comodo! Soprattutto consiglio questa soluzione nel caso in cui vogliate usare Flex 3 per scrivere codice ActionScript 3.0 e magari continuare a lavorare graficamente con Flash per creare, modificare o quant'altro, la nostra grafica (modalità di lavoro per altro non poi così desueta! ) senza ricorrere ad estensioni da installare su Flash. Escludiamo quindi la possibilità di lavorare in progetti Flex in MXML, ma solo in progetti ActionScript. Cominiciamo! Per prima cosa apriamo Flash CS3 o CS4 (a sottolineare che non serve per forza l'ultima versione) Create un nuovo documento Flash con ActionScript 3.0 e salvatelo (diciamo sul desktop per praticità) e chiamatelo "ProvaSWC.fla" Creiamo, ad esempio, una clip contenente una forma e un campo di testo dinamico (chiamato "label_txt"). La scelta di questi elementi ovviamente è prettamente indicativa. Il risultato è mostrato nella figura seguente: Convertite quindi il tutto in MovieClip, dando un nome specifico, ad esempio: Pannello. Segnate la spunta sull'opzione "Esporta per ActionScript" e scrivete come nome della classe, ovviamente : Pannello. Confermate il pannello successivo cliccando su OK. Cliccate ora con il testo destro del mouse sull'oggetto in Libreria e scegliete l'opzione: Esporta SWC file. Sempre per praticità salvate ora questo file nella stessa directory del file Fla. Ora apriamo Flex. Creiamo un nuovo "ActionScript project" (File-->New-->ActionScript project) Chiamiamo il progetto "ProvaSWC". Nel pannello successivo, clicchiamo sul tab "Library path" in alto, quindi sul pulsante "Add SWC". Scartabelliamo il nostro computer e andiamo a selezionare il nostro file SWC. Clicchiamo ora su "Finish". Al termine di questo processo, Flex avrà creato la Classe (parafrasando Flash potremmo dire la Document Class) . Modifichiamola nella seguente maniera (in grassetto le modifiche): [code] package { import flash.display.Sprite; public class ProvaSWC extends Sprite { public var pan:Pannello=new Pannello(); public function ProvaSWC() { addChild(pan); pan.label_txt.text="Hello World"; pan.x=100; pan.y=100; } } } [/code] Se provate l'applicativo già da ora noterete come effettivamente tutto funziona correttamente. A questo punto basterà (si fa per dire!) creare tanti SWC quante sono le parti del vostro progetto e il gioco e fatto. D'altronde consideriamo questo aspetto: Flex lavora per componenti, che sommariamente sono effettivamente "parti" del proggetto che lavoriamo. Allora creiamone noi tramite SWC per il nostro lavoro! Nella seconda parte di questo articolo, invece, vedremo come lavorare con questo metodo all'interno di un progetto Flash