Single item binding

Facciamo esempio completo per meglio comprendere come collegare una singola instanza di una classe su controlli di interfaccia utente.

Creiamo dal progetto Visual Studio 2012 una nuova classe Person con le proprietà Name, Email e City:

public class Person
{
    public string Name { get; set; }
    public string Email { get; set; }
    public string City { get; set; }
}

Doppio click sul file MainPage.xaml e inserisci il seguente codice XAML all’interno dell’elemento principale Grid:

<TextBlock Text="{Binding Name}" HorizontalAlignment="Left" Height="58" Margin="120,101,0,0" TextWrapping="Wrap"  VerticalAlignment="Top" Width="398" FontSize="48"/>
<TextBlock Text="{Binding Email}" HorizontalAlignment="Left" Height="58" Margin="120,204,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="398" FontSize="48"/>
<TextBlock Text="{Binding City}" HorizontalAlignment="Left" Height="58" Margin="120,299,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="398" FontSize="48"/>

Le espressioni di binding sono quelle come Text="{Binding Name}", ovvero attributi che al posto del valore hanno il nome di una proprietà tra parentesi graffe. Serviranno a runtime per effettuare il collegamento tra la proprietà dell’oggetto di business e la proprietà del controllo di interfaccia utente. In particolare, nel codice XAML possiamo notare come, nel primo controllo, la proprietà Name dell’entità sia collegata con la proprietà Text.

È chiaramente possibile collegare la maggior parte delle proprietà visuali con dati esposti da entità: potremmo infatti esporre una proprietà Person.FavoriteColor e collegarla alla proprietà Foreground del controllo TextBlock, oppure una proprietà Person.FavoriteTextSize e collegarla alla proprietà FontSize del controllo TextBlock e così via.

L’ultimo passo è aprire il file MainPage.xaml.cs, ricercare il metodo OnNavigatedTo (che verrà richiamato dal runtime appena l’utente navigherà su questa pagina) e sostituire il metodo con il seguente codice C#:

protected override void OnNavigatedTo(NavigationEventArgs e)
{
	var person = new Person() { Name = "Luca Regnicoli", City = "	Firenze", Email = "luka@devleap.it" };
	this.DataContext = person;
}

Nel metodo OnNavigatedTo abbiamo istanziato un nuovo oggetto Person e collegato tale instanza alla proprietà DataContext della pagina.

A runtime la piattaforma analizzerà ogni espressione di binding e, nel nostro caso, navigherà di parent in parent fino a trovare un oggetto con una proprietà DataContext non null, non appena trovato cercherà la proprietà referenziata dall’espressione di binding nell’oggetto contenuto nel DataContext.

Eseguendo l’intero progetto possiamo vedere il risultato finale:

Figura 2. Single item binding