DDL

Radical => WPF Drag&Drop to the max

Per un programma che sto sviluppando in questi giorni mi sono trovato a dover gestire il drag&drop tra controlli WPF.

Ho deciso di utilizzare il Framework Radical di Mauro Servienti per implementare il pattern MVVM nella mia applicazione desktop.

Il programma è una sorta di designer che posiziona elementi (raffigurati da rettangoli) su una superficie piana. Gli elementi possono essere posizionati o attraverso il drag&drop, o attraverso un doppio click sull’elemento stesso.

Nel codice sorgente che trovate allegato vi ho creato la stessa situazione, in una versione semplificata, utile a capire come Radical permette di gestire la cosa con poche righe di codice.

Iniziamo installando l’estensione Radical Templates che aggiungerà i Radical Project Templates a Visual Studio. In questo modo sotto i templates per i progetti Windows Desktop troveremo una sottocartella con i template per Radical che creeranno per noi una nuova soluzione già funzionante che implementa questo framework. L'estensione per Visual Studio non è un requisito ma una semplice comodità per essere operativi in meno tempo.

Il framework utilizza le convenzioni per facilitarci l’utilizzo del pattern MVVM, quasi senza accorgerci di utilizzarlo.

Non è questo il post dove sviscerare tutte le feature, di cui vi è ampia documentazione, di questo framework, ma guardando il sorgente noterete come risulta veramente facile ed espressivo, senza avere un mucchio di codice per la comunicazione tra View e ViewModel, che in soluzioni non banali genera solo molto “rumore”.

Passiamo alla gestione del Drag&Drop:

dopo aver aggiunto il riferimento ai behaviors:

xmlns:behaviors="http://schemas.topics.it/wpf/radical/windows/behaviors"

basterà aggiungere le Attached Properties “behaviors:DragDropManager.DataObject” e “behaviors:DragDropManager.DataObjectType” al controllo da cui partiamo con il drag, mentre dovremo aggiungere la gestione del DropCommand sul controllo che subirà il drop con questa semplice riga di codice:

behaviors:DragDropManager.OnDropCommand="{markup:AutoCommandBinding Path=DropItem}"

Grazie a Radical, “DropItem” è seplicemente una funzione void del ViewModel che si preoccupa di gestire il drop dell’elemento.

Poiché volevo rendere evidente dove sarebbe stato depositato l’elemento, ho aggiunto la gestione di altri due eventi:

behaviors:DragDropManager.OnDragEnterCommand="{markup:AutoCommandBinding Path=DragEnter}"  
behaviors:DragDropManager.OnDragLeaveCommand="{markup:AutoCommandBinding Path=DragLeave}" 

Che permettono di gestire l’ingresso e uscita dal controllo, rendendo evidente, con un altro colore, dove sarà depositato l’elemento.

Ah… mi sono dimenticato… per la gestione del doppio click basta un’altra riga di codice:

behavior:ListViewManager.ItemDoubleClickCommand="{markup:AutoCommandBinding Path=ListViewDoubleClick}"

Insomma, se guardate il codice c’è più codice nello XAML dei controlli che per l’implementazione di MVVM con Radical, ma volevo farvi assaggiare le potenzialità di questo framework in un'applicazione per lo meno “non banale”.

Il sorgente di esempio lo trovate al seguente indirizzo: http://1drv.ms/1Ar8dD6

Spero di aver stuzzicato la vostra curiosità e, se vi ho incuriositi, volentieri posterò altro su Radical.

P.S. un grazie speciale a Mauro per il supporto!