UI Composition

19
Paolo Possanzini UI Composition Problemi e “possibili” Soluzioni Mauro Servienti

description

Cos'è la UI Composition e che problemi può risolvere Perchè MVVM e WPF sono importanti per la UI Composition Il concetto di 'region' e 'UI Injection' Analisi del toolkit PRISM di Microsoft e cosa comporta realizzarsene uno in proprio.

Transcript of UI Composition

Page 1: UI Composition

Paolo Possanzini

UI CompositionProblemi e “possibili” Soluzioni

Mauro Servienti

Page 2: UI Composition

Agenda

• UI Composition– Ma pecccchè?– I problemi;– Le possibili soluzioni;

• Toolkit:– cosa offre il mercato;– farselo, è pensabile?

Page 3: UI Composition

UI COMPOSITION: PERCHÈ?È un investimento decisamente onoreso, ne vale la pena?

Page 4: UI Composition

Bella domanda...

• Cliente: necessità di modularizzare:– Acquistare in configurazioni diverse;– Installare in configurazioni diverse;

• Team: necessità di gestire e lavorare:– Team grande o distribuito;– Soluzione/i di dimensioni ingestibili in VS;– Tempi di sviluppo diversi dei “moduli” che non

devono condizionarsi/bloccarsi a vicenda;• Un esempio per tutti: Visual Studio;

Page 5: UI Composition

UI COMPOSITION: I PROBLEMIOk, chiaro... Ma a che costo?

Page 6: UI Composition

Mamma mia...

• ...oltre a tutto quello che M-V-VM si porta dietro:– Region management;– La comunicazione tra attori che non si conoscono;– Gestione del ciclo di vita del modulo/plugin;– Obbligatorietà di IoC perchè bisogna avere a che

fare con i contratti... altrimenti ciccia plugin;

Page 7: UI Composition

Semplicità, adesso è tutto così facile...“Region... perchè sei tu region”

Toolbars e Documents sono Region in cui poter iniettare contenuti a runtime

xxxDetails è una Region in cui poter iniettare contenuti contestuali a runtime

Page 8: UI Composition

Semplicità...adesso un po’ meno...

Ecco perchè per mettere M-V-VM al centro del mondo è necessario sporcarsi le mani

Page 9: UI Composition

Region: statiche e dinamiche• Toolbars e Documents sono region “statiche”;– Referenziabili per “nome”;

• Ma se avessimo più Window?

• IRegionManager.GetRegion( name ) ?

CustomerWindow: Instance 1“ContentRegion”

CustomerWindow: Instance 2“ContentRegion”

• svc.RegisterRegion( name, view );• svc.GetManager( view ).GetRegion( name );

Page 10: UI Composition

RegionService, RegionManager, Region

• Wpf e Xaml vi danno la massima libertà: lunga vita alle Attached Property;

<ContentPresenter rg:RegionService.Region="{rg:ContentPresenterRegion 'myRegionName'}" />

Page 11: UI Composition

Come comunicano?

l’elemento selezionato deve “attivare” un Command nella toolbar

La variazione di selezione deve essere intercettata per iniettare i contenuti contestuali

Una toolbar contestuale compare quando visualizziamo contenuti contestuali

Page 12: UI Composition

Il postino suona sempre 2 volte

• I vari attori, aka Module, non si conoscono ma hanno la necessità di comunicare tra loro:– Dobbiamo definire una lingua nota a tutti;– Dobbiamo designare qualcuno come postino;

Page 13: UI Composition

Italiani...! La shell si avvia!

• Il nostro postino trasporta messaggi: ViewModelLoading<IShellViewModel>()

• che contengono informazioni:

• che possiamo usare a nostro uso e consumo:

var regionManager = this.regionService.GetRegionManager( this.View );var msg = new ViewModelLoading<IShellViewModel>( this, regionManager );this.broker.Dispatch( msg );

this.broker.Subscribe<ViewModelLoading<IShellViewModel>>( this, msg => {

var viewModel = this.provider.GetService( typeof( IMyContentViewModel ) )msg.RegionManager[ "myRegionName" ].Add( viewModel.View );

} );

Page 14: UI Composition

ANATOMIA: ...DAL VIVO!... Si ma come è fatto?

Page 15: UI Composition

Struttura

• Separazione di contratto e implementazione;– ComponentModel;– Runtime;

• Ma...qualcuno deve conoscere il tutto:– Bootstrapper: è l’equivalente del file di

configurazione;

Page 16: UI Composition

TOOLKIT, TOOLKIT E ANCORA TOOLKIT...

Cosa offre il mercato?

Page 17: UI Composition

Realizzare un toolkit...

• ... Il gioco vale la candela?• Che requisiti dobbiamo soddisfare:– Gestione delle region;– Comunicazione;– Gestione del ciclo di vita dei moduli;

• Ma anche (ecco perchè forse ha senso):– Un set di ViewModel di base;– Un motore di validazione degno del suo nome;– Localizzazione;

• e... Silverlight?

Page 18: UI Composition

DEMO... Si m... Io continuo a non capire...

Page 19: UI Composition

NIENTE DOMANDE...? :-)Fate i bravi....