Il Binding Nicolò Sordoni

Cos’è il binding? In XAML, il binding è uno degli aspetti più complessi da comprendere, ma anche uno dei più potenti. Il binding è un canale di comunicazione fra un controllo ed un oggetto definito nel codice ( o un altro controllo), che permette di riflettere, a livello d’interfaccia, ogni cambiamento che avviene nei dati. Il binding coinvolge due oggetti: Target: è il controllo della UI che mostra le informazioni all’utente e che interagisce con la sorgente. Source: è la sorgente dei dati (ad esempio una lista di stringhe)

Cos’è il binding? Esistono 3 modalità di binding, definite dall’attributo Mode: OneWay : Le modifiche alla sorgente vengono intercettate dal target. E’ la modalità di default TwoWay : Le modifiche apportate all’interfaccia vengono riflesse sulla sorgente. OneTime : La sorgente viene utilizzata per valorizzare il target, ma eventuali modifiche successive verranno ignorate.

Binding fra controlli Il binding permette di assegnare un valore ad una proprietà di un determinato controllo, in base ad un determinato valore, ottenuto dalla Sorgente. Per farlo, all’interno della proprietà che vogliamo poter modificare, è necessario utilizzare una markup extension di tipo Binding. Per capire meglio cosa significhi, analizziamo il seguente esempio: In questo esempio abbiamo utilizzato una TextBox ed un TextBlock. Tramite Binding abbiamo valorizzato la proprietà Text della TextBlock, associandola al testo della TextBox. In questo modo, ogni volta che l’utente inserirà dei valori nell’area di testo, anche il TextBlock cambierà valore.

Binding fra un controllo ed un oggetto Quando vogliamo associare la proprietà di un controllo ad un oggetto definito a livello di codice, la sintassi è la seguente: Per poter utilizzare un oggetto per definire tale binding, è necessario che esso possieda una property con lo stesso nome definito nell’attributo Path, quindi in questo caso deve possedere una proprietà definita “Nome”.

Binding fra un controllo ed un oggetto A questo punto, per completare l’associazione, è sufficiente associare, da codice, un’istanza della classe persona alla proprietà DataContext del controllo stesso o di uno dei container del controllo.

Binding fra un controllo ed un oggetto Vediamo un esempio che mostra la potenza di questo tipo di funzionalità:

Binding fra un controllo ed un oggetto L’esempio precedente ci mostra come sia sufficiente definire una classe con determinare proprietà ed associarla al DataContext di un container, per far sì che, tutti i controlli all’interno del contenitore, possano accedere alle proprietà dell’oggetto. Sebbene il binding sia molto più complesso di quanto visto in queste semplici slide, quanto visto finora è necessario e sufficiente per comprendere come utilizzare delle liste assegnando loro un layout personalizzato.

Le ListView Nicolò Sordoni

Le ListView Una delle situazioni più ricorrenti in ambito mobile, è la necessità di gestire un elenco di informazioni, di cardinalità potenzialmente elevata, senza amdare ad intaccare le prestazioni del dispositivo. In tutti gli ambienti ci vengono forniti degli strumenti per gestire tale situazione in maniera ottimizzata, tramite una logica di riuso delle celle. In Windows Phone esiste il componente ListView, che, analogamente agli altri ambienti, anzichè andara ad allocare un numero di celle pari a quello degli elementi, riutilizza le View man mano che non sono più visibili nello schermo.

Le ListView Esistono vari modi di utilizzare una ListView. Il più semplice è inserire gli elementi direttamente al suo interno da XAML. Questo metodo è poco flessibile e probabilmente non è neanche necessario l’utilizzo di una ListView per gestire questo tipo di situazioni. Un utilizzo più comune è l’inserimento di valori da codice:

ListView con Binding Il metodo più flessibile e potente è comunque l’utilizzo di un binding. Tramite tale funzionalità è possibile definire un layout customizzato per le varie celle, associando ad ogni controllo un valore recuperato dalla sorgente. Per poter ottenere tale risultato, è necessario associare la proprietà ItemSource della ListView ad un binding, dopodichè definire il layout all’interno della proprietà ItemTemplate.

ListView con Binding In questo esempio abbiamo inserito come Template uno StackPanel, che contiene due TextBox: una per mostrare il nome e l’altra per il cognome. Come si nota inoltre, la sorgente dei dati viene recuperata tramite binding (ItemSource ={Binding})

ListView con Binding A questo punto è necessario definire una lista di oggetti che possiedono le proprietà richieste (Nome e Cognome) e associarla al DataContext della ListView: