Deze dagen ben ik weer druk doende met een nieuwe Windows Phone 7 applicatie. De vorige applicatie die ik had gemaakt was nogal haastig in elkaar gezet, zonder ook maar een enkel pattern of framework te gebruiken, echt een Hello World dus.

Nu betreft het een tweede applicatie bezig voor m’n werk en die moet toch van iets hogere kwaliteit zijn. Een collega van me had al een framework gevonden dat ons kon helpen met het MVVM pattern dat veel wordt gebruikt bij Silverlight en WPF applicaties, namelijk MVVM Light. Het duurde even voordat ik alles op het systeem had staan. Het installeren staat goed beschreven op de site van Galasoft: https://www.galasoft.ch/mvvm/installing/manually/

Let er hier ook op dat de hotfix voor Windows Phone 7 ontwikkeling wordt geinstalleerd:

Important note for Windows Phone developers: If you work with Windows Phone 7, you must install this hotfix on top of V3 SP1.

Wanneer dit niet is gedaan krijg je foutmeldingen tijdens het maken van een nieuw MVVM Light WP7 project.

Zodra de bestanden goed op het systeem staan kan er worden begonnen met ontwikkelen. Er is een nieuw project template beschikbaar, namelijk MvvmLight (WP7).

Dit project bevat gelijk al een tweetal mappen, Model en ViewModel en een XAML bestand.

De ViewModel map bevat ook gelijk al 2 bestanden. Deze zijn belangrijk!
Het bestand MainViewModel.cs is gelinkt aan de MainPage.xaml en de ViewModelLocator.cs bevat volgens mij de logica om ViewModel bestanden te koppelen aan de View’s.

Het ViewModel.cs bestand heeft nog niet zoveel nuttige inhoud, zoals is te zien:

public class MainViewModel : ViewModelBase
{
	public string ApplicationTitle
	{
		get { return "MVVM	LIGHT"; }
	}
	//Nog	enkele	properties

	public MainViewModel()
	{
	}
}

Omdat ik nog nooit echt met Silverlight, XAML en MVVM heb gewerkt vroeg ik me natuurlijk af hoe het komt dat de properties aan de View zijn gebind. Het grootste nadeel van het gebruik van een framework, is dat je zelf niet alles meer hoeft te maken en dus ook niet precies weet wat er allemaal gebeurd. Na wat spelen in de XAML ben ik er achter gekomen dat deze regel belangrijk is voor de koppeling met de ViewModel:

DataContext="{Binding	Main,	Source={StaticResource	Locator}}">

De StaticResource wordt volgens mij gebind naar de ViewModelLocator klasse, vanwege de naam.
Het volgende stuk code zorgt er volgens mij voor dat de MainViewModel wordt gebind:

public	MainViewModel Main
{
	get
	{
		return MainStatic;
	}
}

Ik heb dit getest door de snippets te gebruiken om nog een Locator aan te maken, genaamd Test.

Daarna heb ik de DataContext gewijzigd in

DataContext="{Binding	Test,	Source={StaticResource	Locator}}">

Nu zag ik de properties van m’n TestViewModel op de pagina weergegeven.
Het lijkt dus dat ontwikkelen met MVVM Light of XAML betekend dat je je aan enkele naam conventies moet houden. Op zich leuk en aardig, maar dat is behoorlijk foutgevoelig natuurlijk. Tijdens compileren kom je hier namelijk niet gelijk achter.

Het toevoegen van acties aan een knop gaat op een vergelijkbare manier:

<Button	Content="Zoeken!">
	<Custom:Interaction.Triggers>
		<Custom:EventTrigger	EventName="Click">
			<GalaSoft_MvvmLight_Command:EventToCommand	Command="{Binding	ZoekInDeBuurtCommand,	Mode=OneWay}"/>
		</Custom:EventTrigger>
	</Custom:Interaction.Triggers>
</Button>

Sidenote: Hier heb ik de volgende toevoeging voor moeten doen in het

xmlns:Custom="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"xmlns:GalaSoft_MvvmLight_Command="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WP7"

In de code van de ViewModel heb ik dan het volgende RelayCommand gedefinieerd als een property:

public RelayCommand ZoekInDeBuurtCommand
{
	get {	return new RelayCommand(DoZoekenResultaten);	}
}
private	void DoZoekenResultaten()
{
	throw new NotImplementedException();

}

Op zich is het geen rocket-science, maar ik had eigenlijk verwacht dat het allemaal iets stricter zou werken. Blijkbaar is dat nog niet het geval. Het was in ieder geval even zoeken naar hoe alles precies werkte en hoe je nieuwe elementen op een pagina kan krijgen. Inmiddels is het me gelukt om een leuke WP7 Pivot applicatie te maken. Nu de inhoud van de pivot’s nog.