Tutoriel : Consommer le service de données OGDI avec Windows Phone 7/Mango – 3ième partie

Article
07/21/2011

Vous avez précédemment créé l’application Silverlight pour Windows Phone avec le modèle Pivot et généré les classes proxy du service de données OGDI de l’instance française. Voyons à présent dans cette troisième partie du tutoriel comment consommer les données publiées pour les afficher dans une liste.

Windows Phone SDK 7.0

Editez votre fichier MainViewModel.cs contenu dans le dossier ViewModels.

Tout d’abord, vous allez ajouter au début du fichier les espaces noms correspondants à la bibliothèque cliente OData et au fichier auto-généré RennesStationnementHandiSvc.cs.

using System.Data.Services.Client;

using ogdisafe.frOpenData;

Déclarez maintenant une propriété de type DataServiceCollection<StationnementHandicapesItem> qui contiendra votre liste de stationnements pour les personnes handicapées.

private DataServiceCollection<StationnementHandicapesItem> _stationnements;

public DataServiceCollection<StationnementHandicapesItem> Stationnements

{

get

{

return _stationnements;

}

set

{

if(_stationnements != value)

{

_stationnements = value;

NotifyPropertyChanged("Stationnements");

}

Ajoutez un champ statique qui va contenir l’adresse du service OData :

private const string ODataEndpoint = https://ogdifrancedataservice.cloudapp.net/v1/frOpenData/;

Maintenant, dans le constructeur de la classe MainViewModel insérez le code suivant pour consommer les données de façon asynchrone :

frOpenDataDataService service = new frOpenDataDataService(new Uri(ODataEndpoint));

Stationnements = new DataServiceCollection<StationnementHandicapesItem>(service);

Stationnements.LoadAsync(new Uri(ODataEndpoint + "StationnementHandicapes"));

Vous en avez maintenant terminé avec le fichier MainViewModel.cs. Vous allez passer à l’édition de la vue MainPage.xaml pour afficher les données sous forme de liste.

Tout d’abord, sur la liste nommée FirstListBox remplacez-le contenu de la propriété ItemsSource pour vous lier à votre collection Stationnements :

Ensuite, modifiez le modèle (template) associé aux éléments de la liste FirstListBox pour afficher les détails de chaque place de stationnement.

</StackPanel>

</DataTemplate>

Maintenant compilez et lancez la solution en appuyant sur F5. Le temps que l’émulateur Windows Phone 7 se lance, il peut se passer plusieurs minutes. Néanmoins, une fois l’application lancée, vous devriez au bout de quelques secondes avoir la liste qui se remplit. A ce stade, vous venez de voir comment consommer simplement des données exposées par le service de données OGDI via le protocole OData.

Vous pouvez bien sûr créer des requêtes beaucoup plus complexes pour filtrer les données. Par exemple, si dans le constructeur de la classe MainViewModel.cs, vous aviez changé l’appel à la méthode LoadAsync de cette manière :

Stationnements.LoadAsync(new Uri(ODataEndpoint + "StationnementHandicapes?$top=50"));

Vous auriez alors obtenu seulement les 50 premières places de stationnement.

Comme vous pouvez le constater, dans la version 7.0 du SDK Windows phone, la couche d’abstraction fournie est encore légère et on ne peut pas, par exemple, représenter les requêtes OData par des requêtes LINQ (Language-INtegrated Query).

On doit alors composer les requêtes soi-même à la main avec la méthode LoadAsync. Cependant, dans le SDK 7.1, un fournisseur (provider) LINQ a été ajouté pour permettre justement de composer ses requêtes sous forme de requête LINQ. C’est ensuite le fournisseur LINQ qui va se charger de les convertir en requête OData.

Pour une présentation complète du protocole OData et notamment de ses opérateurs, nous vous invitons à consulter le lien suivant : https://www.odata.org/developers/protocols.

Windows Phone SDK 7.1 (Mango)

Par rapport au SDK 7.0, cette version introduit de de légères variations.

Dans le fichier MainViewModel.cs situé dans le répertoire ViewModels, ajoutez les espaces de nom suivants :

using System.Data.Services.Client;

using System.Linq;

using OGDI_WP7_SDK7_1.ogdisafe.frOpenData;

(OGDI_WP7_SDK7_1 correspond à l’espace nom par défaut de votre projet.)

Déclarez maintenant une propriété de type DataServiceCollection<StationnementHandicapesItem> qui contiendra votre liste des places de stationnement réservées aux personnes handicapées.

private DataServiceCollection<StationnementHandicapesItem> _stationnements;

public DataServiceCollection<StationnementHandicapesItem> Stationnements

{

get

{

return _stationnements;

}

set

{

if(_stationnements != value)

{

_stationnements = value;

NotifyPropertyChanged("Stationnements");

}

Ajoutez un champ statique qui va contenir l’adresse du service OData :

private const string ODataEndpoint = https://ogdifrancedataservice.cloudapp.net/v1/frOpenData/;

Maintenant, dans le constructeur de la classe MainViewModel insérez le code suivant pour consommer les données de façon asynchrone :

frOpenDataDataService service = new frOpenDataDataService(new Uri(ODataEndpoint));

var query = from s in service.StationnementHandicapes

select s;

Stationnements = new DataServiceCollection<StationnementHandicapesItem>(service);

Stationnements.LoadAsync(query);

Comme vous pouvez le constater à la différence du SDK 7.0, ici il n’est nullement la peine d’écrire ses requêtes OData à la main. On peut les composer avec la syntaxe LINQ en toute transparence. La seule restriction est que vous ne pouvez pas requêter les données d’un service OData de façon synchrone, vous êtes obligé d’utiliser un pattern asynchrone.

En fait il s’agit plutôt d’une restriction de Silverlight pour Windows Phone afin d’avoir des applications les plus fluides possibles. En effet, en requêtant de façon asynchrone, on délègue le travail à un thread en tâche de fond (background) ce qui évite les effets de gel de l’interface quand des traitements lourds sont exécutés sur le thread de l’interface utilisateur.

Vous en avez maintenant terminé avec le fichier MainViewModel.cs. Vous allez passer à l’édition de la vue MainPage.xaml pour afficher les données sous forme de liste. Tout d’abord, sur la liste nommée FirstListBox remplacez-le contenu de la propriété ItemsSource pour vous lier sur votre collection Stationnements :