In concomitanza con il rilascio di Silverlight 4 è stata anche presentata ufficialmente la nuova versione di Expression Blend 4 RC - release candidate - disponibile al download pubblico al seguente link.Dal punto di vista della progettazione e sviluppo, Expression Blend 4 abilita lo sviluppo di applicazioni Silverlight 4 e Windows Presentation Foundation 4 (WPF 4) mantenendo comunque la possibilità di produrre applicazioni Silverlight 3 e WPF 3.5 Service Pack 1; risulta inoltre supportata l'interoperabilità con Visual Studio 2010 per gli aspetti di "code behind" di un'applicazione.Ma vediamo un'anteprima sulle principali funzionalità che sono state introdotte in questa nuova versione. In primis, sulla base dei suggerimenti raccolti da voi progettisti, sono stati inseriti una nuova serie di behavior. Come sempre la logica è quella di fornire una serie di behavior che vi permettano "nativamente" di gestire funzionalità ed interazioni avanzate senza dover scrivere una "riga di codice". Per chi fosse neofita dei behavior, vi ricordo che una volta associato un behavior a qualsiasi elemento della UI - attraverso un semplice "drag & drop" dall'Asset Library di Blend - le proprietà esposte/associabili dal behavior specifico verranno elencate all'interno del pannello "properties" di Blend. Nei behavior di Expression Blend 4 è inoltre possibile gestire le "conditions", funzionalità che permettono di scatenare e generare una specifica "action" all'interno dell'applicazione solo in seguito al raggiungimento di una specifica condizione. Vediamo l'esempio rappresentato nella figura qui sotto, si tratta di una semplice maschera di login per la gestione della visualizzazione di pannelli diversi a seconda della tipologia di user. Al "button" presente in questo semplice prototipo, è stato associato un behavior "Navigate to Screen" che permette di gestire la navigazione tra due screen che caratterizzano il nostro prototipo. Se andiamo a vedere in dettaglio il pannello delle "Properties", oltre alle classiche opzioni per la gestione dei "trigger" e delle action "Common Properties" è presente anche il pannello "Conditions". Interagendo su questo pannello è possibile definire le "condizioni" che devono essere presenti in modo che venga riprodotta la action associata al behavior. In questo caso specifico, il behavior permetterà di accedere alla screen del prototipo "Admin", solo se, il valore inserito nel "Text Box" - user - è uguale come valore - Value - al valore "admin". Utilizzando questa funzionalità sarete quindi in grado di gestire interazioni con logica avanzata senza bisogno di scrivere del codice "custom" per riprodurre le seguenti condizioni.La funzionalità descritta in precendenza è chiaramente valida sia per progetti reali Silverlight sia in prototipi SketchFlow.Sempre in merito ai behavior, un'altra funzionalità molto interessante, è il supporto alle "Bindable Properties". In questo modo le funzionalità dei behavior risultano ulteriormente dinamiche ed estese. Vediamo il tutto attraverso un semplice esempio. Consideriamo ad esempio uno "storyboard" all'interno di un'applicazione che vogliamo venga riprodotto solo se risulta "flaggato" un check-box presente all'interno dell'interfaccia utente. Anche in questo caso andremo ad impiegare il classico behavior "ControlStoryboardAction", associato ad un semplice controllo "button" e allo "storyboard" appena creato, ma l'animazione verrà riprodotta solo se il check-box presente nell'interfaccia sarà flaggato. Come rappresentato in figura, "bullet 1", il behavior è stato associato al button in cui è definito di riprodurre lo "storyboard1", fino a qui nulla di nuovo.La "bindable properties", in questo caso andrà definita tra le opzioni avanzate, "bullet 5", facendo tasto destro sul quadratino bianco tra le opzioni è possibile selezionare l'opzione "Element Property Binding..." - bullet 2. Eseguita questa operazione, vi verrà richiesto di selezionare l'elemento a cui associare il binding. Notate che a fianco al cursore del mouse, muovendosi sull'artboard, vi appare l'icona con il "target" utile a selezionare il controllo a cui associare la property. Nell'esempio specifico, posizionandomi sul check-box, vi apparirà il contenuto del "bullet 3" e automaticamente verrà proposta l'opzione di default "IsChecked" - chiaramente è possibile associare delle altre opzioni. Confermato il tutto, e a questo punto, se notate nel pannello opzioni avanzate vi sarà apparso la classica cornice gialla ad indicare il data binding appena definito. Se lanciate il "run" dell'applicazione, F5 da tastiera, avrete modo di testare l'applicazione con la funzionalità appena definita all'interno del browser.In merito alla realizzazione di un prototipo SketchFlow, Blend 4 introduce una serie di novità che vanno dalla possibilità di utilizzare di default interagendo, controlli a cui è associato lo "sketch styles" senza dover andarli a selezionare dall'Asset Library sino alla gestione del "naming" in automatico una volta definito un nuovo "screen" che costituisce l'applicazione. Nel primo caso, se provate ad esempio ad inserire un controllo "button", di default al button verrà associato lo stile "sketch style" tipico di un button di un prototipo, mentre nella seconda ipotesi, se create un nuovo "screen" all'interno della "SketchFlowMap" di default vi verrà richiesto di definire un nome allo screen appena inserito.Una serie di funzionalità aggiuntive caratterizzano anche lo SketchFlow Player, l'applicazione che vi permette di condividere il prototipo con il cliente e/o all'interno del team di lavoro. Nella visualizzazione delle SketchFlow Animation presenti nel prototipo, sarete in grado di mandare in pausa e riavviare le animazioni interagendo con il pannello di controllo.Inoltre la nuova versione dello SketchFlow Player permette di effettuare operazioni di "panning", "scrolling" e "resizing" degli screen che caratterizzano il prototipo. Funzionalità molto utile per visualizzare screen/pagine che hanno uno sviluppo più esteso rispetto alle dimensioni di default. Se la dimensione della pagina è superiore rispetto all'area disponibile a video, verrà visualizzata una scrollbar per scorrere la pagina. Per abilitare il resize delle pagine, è invece sufficiente interagire con la cornice presente allo screen visualizzato all'interno dello SketchFlow Player.Sempre in ambito prototipi, una serie di funzionalità aggiuntive per visualizzare la SketchFlow Map in overlay agli "screen" accessibile direttamente dall'icona "MAP" e la possibilità di includere e raccogliere i feedback nella documentazione progettuale in fase di export del documento Word.Blend 4, in fase di definizione di un progetto, permette di creare e gestire un progetto con il nuovo template "Model View View Model" (MVVM), uno specifico pattern per la progettazione di applicazioni Silverlight e WPF che mantiene separata la logica dell'applicazione dalla UI (presentation layer). Avremo modo di approfondire questo argomento in uno dei prossimi post.In merito ai nuovi controlli, uno fra tutti occupa un ruolo da protagonista, "PathListBox Control", un nuovo controllo che introduce una nuova e flessibile modalità per il layout di "items" multipli. E' possibile procedere in due modalità:- inserendo dall'Asset Libray il controllo "PathListBox", inserirvi gli elementi "items" che andranno poi visualizzati sulla "path" e selezionare accedendo dal pannello properties dedicato a questo controllo le path a cui collegare gli "items". Per effettuare quest'ultima operazione è possibile interagire con il classico strumento "target".Come vedete rappresentato nella figura qui sotto, ho inserito un controllo "PathListBox", in cui ho associato in data binding una semplice fonte dati di esempio "sample data" - "bullet 1". Interagendo quindi sul pannello properties, ho selezionato con lo strumento target - "bullet 2" - la path il layout a cui voglio associare gli "items" - bullet 4. Fatto seguito a queste operazioni, vedrete visualizzato nel pannello properties, in overlay nell'immagine, la path che è stata selezionata - bullet 4. La seconda modalità, più immediata, permette di convertire una qualsiasi path in "layout path". Molto semplicemente, con l'oggetto selezionato facendo tasto destro "Path > Make Layout Path". In questo modo l'oggetto verrà convertito automaticamente in controllo "PathListBox" a cui si potrà associare gli items da visualizzare.Infine, un rapido accenno ai nuovi "pixel shader effect", applicabili ad immagini, controlli ed oggetti vettoriali che trovate catalogati all'interno dell'Asset Library nella sezione dedicata agli "effects": Bloom, ColorTone, Emboss, Magnify, Monochrome, Pixelate, Ripple, Sharpen, Swirl, etc.Nella visualizzazione degli effetti è possibile associare anche degli effetti di transizione "transition effects" associabili attraverso gli "states".