Download - m-v-vm @ UgiAlt.Net
![Page 1: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/1.jpg)
Mauro Servienti
UI Composition
Microsoft MVP - Visual C#Software Mason @ Managed Designs
http://blogs.ugidotnet.org/[email protected]
Problemi e “possibili” Soluzioni
![Page 2: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/2.jpg)
Agenda
• Indagine di mercato;• M-V-VM:– Overview;– Il dottore ha detto...
• UI Composition– Ma pecccchè?– I problemi;– Le possibili soluzioni;
• Parliamone insieme.
![Page 3: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/3.jpg)
INDAGINE DI MERCATOItaliani! :-P
![Page 4: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/4.jpg)
Per alzata di mano...
Abbiamo 29 slide...dobbiamo capire come usarle.. Agili, agili ;-)
• Quanti hanno familiarità con IoC e DI?
• Quanti conoscono e usano M-V-VM?
![Page 5: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/5.jpg)
M-V-VM: OVERVIEWTutti ne parlano... Ma che cosa è?
![Page 6: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/6.jpg)
Il centro del mondo!
Please welcome M-V-VM
Somewhere in time...
ViewModel
Repository<T>
D.I.
View
DataBinding
Command pres
enta
tion
engi
neda
ta
Model
Adapter
![Page 7: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/7.jpg)
Pregi & Difetti
• + Testabilità della logica della UI;• + Sostituibilità della UI (stesso View Engine);• + Elevata manutenibilità;
• - Aumento della complessità e mancanza di “controllori” (San csc.exe non aiuta...);
• - il data binding non risolve tutti gli scenari... dobbiamo sporcarci le manine...
![Page 8: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/8.jpg)
M-V-VM: IL DOTTORE HA DETTO...Il libro che ho letto dice che devo fare così, ma tu invece hai fatto cosà...!
![Page 9: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/9.jpg)
Il centro del mondo
• Il designer non deve scrivere codice;– > Il ViewModel deve diventare il vostro unico
punto di riferimento;• Ma non tutto si può “bindare” purtroppo:– Come gestiamo il processo di chiusura della View?– E quello di attivazione?– Come interagiamo con l’utente?• Dialog (dialog owner), MessageBoxes, etc...
![Page 10: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/10.jpg)
Iniettiamo anche la ‘I’View...
• Se facciamo uso di IoC, ci siamo già in parte tagliati le gambe:
• Tanto vale farlo fino in fondo:
class MyViewModel{ public MyViewModel( IRepository<Customer> repo ){ ... }}
class MyViewModel{ public MyViewModel( IView view, IRepository<Customer> repo ){ ... }}
![Page 11: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/11.jpg)
...e ‘I’View diventa
Alla fine il nostro compito è consegnare valore non filosofeggiare ;-)
interface IView{ Object DataContext{ get; set; }}
interface ICloseableView : IView{ event CancelEventHandler Closing; event EventHandler Closed;}
![Page 12: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/12.jpg)
UI COMPOSITION: PERCHÈ?È un investimento decisamente onoreso, ne vale la pena?
![Page 13: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/13.jpg)
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;
![Page 14: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/14.jpg)
UI COMPOSITION: I PROBLEMIOk, chiaro... Ma a che costo?
![Page 15: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/15.jpg)
Requisiti: un esempio
• Semplice applicazione “gestionale”:– Anagrafiche;– Contabilità;
• Il cliente deve poter installare il “modulo” anagrafiche senza la contabilità;
• Il team deve poter sviluppare i 2 moduli indipendentemente;
![Page 16: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/16.jpg)
Domain Model• Contabilità “dipende” da Anagrafiche?
• Dipende... ;-) da che cosa?– Se modularizzo per necessità di sviluppo;– Se modularizzo per necessità di deploy;
![Page 17: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/17.jpg)
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 18: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/18.jpg)
Semplicità...adesso un po’ meno...
Ecco perchè per mettere M-V-VM al centro del mondo è necessario sporcarsi le mani
![Page 19: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/19.jpg)
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 20: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/20.jpg)
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 21: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/21.jpg)
L’ecosistema: è un mondo difficile
• L’ecosistema: lunga vita a Visual Studio– la shell;– i moduli;– il processo di bootstrap;
• Diligenza assoluta, farsi prendere la mano, e sporcarla, è molto facile ma il rischio è di pagarla cara dopo;
• La navigazione e il ciclo di vita dei “documenti”: RunningDocumentsService;
![Page 22: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/22.jpg)
UI COMPOSITION: LE POSSIBILI SOLUZIONI
Comporre, scomporre e ricomporre questo è il segreto...
![Page 23: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/23.jpg)
Il mio Domain Model
• Il pericolo è il mio mestiere:
• Potreste avere un Repository<T> basato su servizi WCF;
• Naturalmente... non si possono fare le join;
![Page 24: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/24.jpg)
RegionService, RegionManager, Region
• Wpf e Xaml vi danno la massima libertà: lunga vita alle Attached Property;
<ContentPresenter rg:RegionService.Region="{rg:ContentPresenterRegion 'myRegionName'}" />
![Page 25: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/25.jpg)
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 26: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/26.jpg)
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 27: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/27.jpg)
IMessage lifecycle
BrokerSearchRequestMessage
MessageHandler
Handler-“Risolve” il ViewModel;- passa le informazione sulla ricerca richiesta;- Inietta la View nella Region;ViewModel-Esegue la ricerca;- Visualizza i risultati;
![Page 28: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/28.jpg)
Messaggi o Eventi: l’unione fa la forza
• Ingestibili con messaggi:– Attivazione/
Disattivazione Document;
– Cambio di selezione;
• Gli eventi tornano ad essere vincenti:– Una Region notifica il cambio di contenuto attivo;– Un ViewModel può interagire con il contenuto:– IHandlePrintScenario -> PrintScenarioChanged
![Page 29: m-v-vm @ UgiAlt.Net](https://reader033.vdocuments.pub/reader033/viewer/2022061206/54824986b4af9f636b8b47d9/html5/thumbnails/29.jpg)
Si aprano le danze
?