Sébastien Alves

Avec la version 7.1 du SDK Windows Phone (Mango), l’intégration de la réalité augmentée dans des applications mobiles semblent de plus en plus accessible et c’est le sujet sur lequel je me suis un peu amusé ces derniers jours.

Rappelons tout d’abord que la réalité augmentée permet l’intégration d’informations numérique sur une image ou une vidéo réelle.

Il existe deux usages assez fréquents :

• La réalité augmentée qui se base sur la géolocalisation dans le but de repérer les points d’intérêt autour de l’utilisateur.
• La réalité augmentée qui se base sur la détection de « Tag » sur lequel on affiche des informations.

Pour ma part je me suis intéressé au deuxième usage à l’aide du framework SLARToolkit et de XNA. Néanmoins, si vous souhaitez en apprendre plus sur l’usage de la réalité augmentée à l’aide de la géolocalisation, je vous recommande de jeter un œil sur ce framework : http://gart.codeplex.com/.

Le framework SLARToolkit est issue de deux librairies(NyARToolkit, ARToolkit) et permet grâce à des marqueurs basiques comme un rectangle noir ou des marqueurs personnalisés d’intégrer des informations numériques en temps réels sur un flux vidéo.

Ce framework a été initialement développé pour Silverlight, mais une version pour WP7 est également disponible. J’ai donc repris les exemples fournis et je m’en suis inspirés pour intégrer des objets 3D dans un flux vidéo, grâce notamment à XNA.

Voici un aperçu :

Lire la suite…

Je profite enfin d’un peu de temps pour découvrir le développement d’applications dites « metro » et son « WinRT » pour « Windows RunTime ». N’étant pas fan de « HTML/CSS/JavaScript », j’ai préféré rester pour l’instant sur le bon vieux « C#/XAML » pour développer un petit client Twitter à titre pédagogique. Cela m’a permis aussi de mettre en pratique la méthodologie « MVVM » (grâce à MVVM light Toolkit) et la programmation asynchrone (« await », « async ») dans ce nouvel environnement.

J’avoue que mes premières heures passaient sous VS 2011 ne m’a pas laissées indifférent avec son interface « retro » plus que « metro », mais à l’utilisation on constate tout de même des fonctionnalités très intéressantes comme la fusion de l’explorateur de solutions et de l’explorateur d’objets ou encore le système de recherche très efficace.

Bref le but de ce post n’est pas de vous faire une présentation de tous ces outils, mais plutôt de vous faire part de quelques ressources qui m’ont aidé à comprendre ce nouvel environnement vraiment captivant.

Quelques liens :

• Centre de développement – Applications de style Metro
• Communauté des Développeurs Windows 8 !
• Jonathan ANTOINE’s
• Mikael Koskinen
• Alex Golesh’s Blog (11 articles très détaillés)
• Building Windows 8
• Build Conference
• Windows Developer Preview Metro style app samples

Au passage, deux petites astuces :

• Thread.Sleep avec WinRT

A ma grande surprise pas de « Thread.Sleep » en « WINRT », voici donc un moyen de le faire :

new System.Threading.ManualResetEvent(false).WaitOne(ms);

• La localisation avec WinRT

Pour savoir comment cela fonctionne et aussi comprendre ce que je raconte ci-dessous, je vous recommande avant de lire cet article : http://win8dev.fr/comment-localizer-votre-application/

Une astuce donc quand vous souhaitez récupérer une ressource par le code. Si vous créez une clé du type « About.Text » servant initialement à alimenter un « TextBlock » de votre « XAML » par exemple, voici ce que vous êtes censé faire :

ResourceLoader rL = new ResourceLoader();
string maValeur = rL.GetString("About.Text");

Cependant voici ce qui se passe :

Alors, je me suis dit que peut-être en créant une clé « About » sans le « .Text » cela fonctionnerait mieux, mais ce fut encore un échec.

Il semble donc qu’il faille créer une chaîne de caractère bien distinct pour que cela fonctionne :

ResourceLoader rL = new ResourceLoader();
string aboutStr = rL.GetString("aboutTitle");

A+

Sébastien.

Je n’ai pas pour habitude de faire de la publicité sur mon blog, mais j’ai récemment été sollicité pour la relecture d’un cours (en anglais) préparant à la certification Microsoft Windows Application Development (70-511 TS).

Ce cours a été conçu par Alessandro del Sole (Microsoft MVP) pour la société campusMVP.NET. Cette start-up propose une série de formation en ligne (cours, simulateurs d’examens, …) pour se préparer aux certifications Microsoft, conçu pour la plupart par des MVP.

Concernant le cours en question (ici), j’avoue avoir été agréablement surpris par la qualité et la clarté du cours. Tous les fondamentaux du WPF y sont traités simplement, sous forme de tutoriels accompagnés de vidéos et de codes sources. Pour tous ceux qui voudraient donc découvrir et/ou approfondir les différents concept autour WPF, je ne peux que recommander sa lecture, même si son but premier est avant tout de vous préparer à la certification (Le cours ne traite donc pas de MVVM, je vous recommande plutôt pour cela de vous procurer l’excellent livre français de Jonathan ANTOINE et de Thomas Lebrun : MVVM. De la découverte à la maîtrise).

Voici les différents points traités :

• Introducing WPF with Visual Studio 2010 and the .NET Framework 4.0
• Building a User Interface with Basic Techniques
• Enhancing a User Interface
• Data Binding
• Enhancing functionality and Usability of Solutions
• Stabilizing and Releasing a Solution

Vous allez me dire tout cela est bien beau, mais c’est payant et c’est la raison pour laquelle en général je ne parle pas de ce genre de formation sur mon blog. Mais en l’occurrence ayant été sollicité pour sa relecture et trouvant ce type de formation pas si onéreuse que cela par rapport à ce que j’ai déjà pu voir, je trouvais intéressant de vous en parler.

Voilà s’en est tout pour ce petit post « pub »

A bientôt.

Sébastien.

Je vous souhaite une bonne et heureuse année à tous !

Un grand merci à tous ceux qui suivent mon blog et j’espère que nous serons en mesure d’échanger encore plus en 2012.

Vous trouverez ci-dessous une liste des articles qui ont été le plus lu cette année :

• Cosmopolitan Theme for WPF
• Développer un projet pour WPF, Silverlight et Windows Phone 7
• Entity Framework : Un rapide aperçu !
• VI – Un Media Browser simple en WPF : MessageBox personnalisées
• Validation des données avec les DataAnnotations en WPF
• VII – Un Media Browser simple en WPF : Utilisation du pattern MVVM
• Un « LocalizationHelper » pour WPF
• Afficher une MessageBox avec MVVM : une autre façon de faire ?

A bientôt.

Sébastien.

Chose promise chose due, je vous informe que je viens de déposer un projet sur CodePlex, dans lequel vous retrouverez l’intégralité du code source du composant ItemsViewer for WPF dont je vous ai parlé ici.

C’est une première version, merci donc pour votre indulgence.

Si vous avez des suggestions ou des remarques qui permettraient d’améliorer ce petit composant, n’hésitez pas à alimenter les discussions du projet CodePlex.

C’est par ici

http://itemsviewerwpf.codeplex.com/

Un aperçu :

Enjoy and Merry Christmas !

Sébastien.

Hello everyone !

Cela fait un petit moment que je n’ai pas blogué par faute de temps. Je profite donc de ce petit moment de répit pour vous faire partager un petit composant WPF que j’avais commencé à développer il y a déjà un certain temps de cela et que j’ai eu l’occasion de reprendre récemment.

Ce composant est assez simple et permet d’afficher une collection d’éléments en ce basant sur le principe du « layout » du « WrapPanel ».

Afin que le rendu soit un peu plus sympathique, j’ai également fait en sorte d’animer le positionnement des éléments du contrôle et par soucis de performance gérer ce qu’on appelle la virtualisation d’interface. C’est une technique puissante qui permet de créer uniquement les éléments d’interface qui sont visibles à un instant « t ». Grace à cette tehnique vous pouvez ajouter un nombre important d’éléments sur votre interface sans que la performance en soit atteinte.

Sans rentrer dans des détails techniques, sachez juste que j’ai codé un « AnimatedVirtualizingWrapPanel » utilisé comme « ItemsPanelTemplate » d’un « ItemControl ».

Ci-dessous une illustration du composant :

Pour utiliser le composant il n’y a rien de bien compliqué, il suffit de « binder » votre collection d’objets (une CollectionView pour effectuer des filtres et des tris par exemple) à la propriété « ItemsSource » et de définir le « ItemTemplate » comme ceci :

<ItemViewer:ItemViewerControl x:Name="itemViewerControl"
 IsSynchronizedWithCurrentItem="True"
 ItemsSource="{Binding PicturesView}">
 <ItemViewer:ItemViewerControl.ItemTemplate>
 <DataTemplate>
 <StackPanel>
 <Image Source="{Binding Url}"
 Stretch="Fill"
 Height="110"
 Width="150" />
 <StackPanel HorizontalAlignment="Center"
 Orientation="Horizontal">
 <TextBlock Text="{Binding Name}"
 Foreground="Gray" />
 <TextBlock Text=" / "
 Foreground="Gray" />
 <TextBlock Text="{Binding Size}"
 Foreground="Gray" />
 <TextBlock Text="KB"
 Foreground="Gray" />
 </StackPanel>
 </StackPanel>
 </DataTemplate>
 </ItemViewer:ItemViewerControl.ItemTemplate>
 </ItemViewer:ItemViewerControl>

Dans l’état actuel des choses, je ne préfère pas vous fournir le code source, car pour l’instant c’est encore très brouillon et je préfère prendre un peu de temps pour mettre un peu d’ordre dans mon code.

En attendant voici une petite preview :

Ce petit composant n’a aucune prétention et il reste encore beaucoup à faire, mais je pense qu’il peut-être intéressant de le partager. Il n’est donc pas improbable que j’ouvre un projet « CodePlex » pour cela, même si je m’interroge encore sur le nom à lui donner, une idée ?

A bientôt.

Sébastien.

Un post rapide pour vous informer que je viens de déposer un projet sur CodePlex, dans lequel j’ai commencé à porter le thème Cosmopolitan de Silverlight vers WPF.

C’est une première version, il y a donc certainement encore des améliorations à apporter.

Si vous avez des suggestions ou des remarques qui permettraient d’améliorer ce portage, n’hésitez pas à alimenter les discussions du projet CodePlex.

Enfin, toutes aides seront les bienvenues pour continuer à migrer ce thème.

C’est par ici

http://cosmopolitanwpf.codeplex.com/

Un premier aperçu :

Enjoy !

Sébastien.

Vous avez peut-être vu cette annonce sur le blog Microsoft Surface, en tous les cas sachez qu’ils viennent de sortir un contrôle Bing Maps for WPF : ICI

Suite à cette annonce, je me suis alors vite empressé de le tester sur l’une de mes applications et les premiers résultats sont très attrayants.

Je vous propose donc dans ce petit post de vous parler de son utilisation dans une petite application de type MVVM. Application qui gère des contacts associés à des localisations GPS, le but étant de pouvoir afficher sur une carte la localisation de chacun de ces contacts.

Premièrement il faut déclarer le composant dans votre vue comme ceci :

<xmlns:bing="clr-namespace:Microsoft.Maps.MapControl.WPF;assembly=Microsoft.Maps.MapControl.WPF">

<Window.Resources>
 <DataTemplate x:Key="UsersViewTemplate">
 <Ellipse Stroke="Black"
 StrokeThickness="1"
 Width="10"
 Height="10"
 bing:MapLayer.Position="{Binding Location.Coordinates}"
 bing:MapLayer.PositionOrigin="Center">
 <ToolTipService.ToolTip>
 <StackPanel>
 <TextBlock Text="{Binding Name}"
 FontSize="14"
 FontWeight="Bold" />
 </StackPanel>
 </ToolTipService.ToolTip>
 <Ellipse.Fill>
 <LinearGradientBrush EndPoint="1,0.5"
 StartPoint="0,0.5">
 <GradientStop Color="#FF8D4646"
 Offset="0" />
 <GradientStop Color="#FFEA8C54"
 Offset="1" />
 </LinearGradientBrush>
 </Ellipse.Fill>
 </Ellipse>
 </DataTemplate>
 </Window.Resources>

<bing:Map x:Name="myMap"
 Mode="Road"
 CredentialsProvider="Insérer votre clé BING">
 <bing:MapItemsControl ItemsSource="{Binding UsersView}"
 ItemTemplate="{StaticResource UsersViewTemplate}" />
</bing:Map>

Quelques explications :

• Pour utiliser le contrôle, il vous faut créer un compte et obtenir une clé sur : https://www.bingmapsportal.com/
• Déclarer un mode d’affichage : Road, Aerial, AerialWithLabels.
• Définir le MapItemsControl en y bindant une Collection de votre ViewModel et en définissant un ItemTemplate.
• L’itemTemplate va définir la façon d’afficher l’information sur la carte, dans mon exemple je vais afficher des points correspondant aux coordonnées GPS de chacun de mes contacts (« Binding Location.Coordinates »).

Petite astuce :

Le composant semble avoir besoin de se connecter à Internet et si comme moi, vous passez par un proxy pour vous connecter Internet, il faudra modifier à l’initialisation de votre application la valeur du « DefaultWebProxy » :

WebRequest.DefaultWebProxy = new WebProxy("http://myProxy:8080")
 {
 Credentials = CredentialCache.DefaultCredentials
 };

Un aperçu :

Conclusion :

Même si ce contrôle n’est qu’en version bêta pour l’instant, il semble néanmoins très prometteur.

Enjoy !

Sébastien.

N’avez-vous jamais été confronté à cette problématique ? Si vous développez des applications qui mettent en application le pattern MVVM, impossible de pouvoir y échapper à un moment ou un autre. Pour résoudre cette problématique, nous avons souvent recours à des outils comme le Messenger du framework MVVM Light Toolkit ou encore le ServiceProvider permettant d’enregistrer des services et de les appeler depuis vos ViewModels.

Cependant, si on y réfléchit on pourrait se demander ce que fait ce genre de code dans le ViewModel. N’est-il déjà pas trop lié à des interactions écrans qui ne devraient pas être gérées par les ViewModels, mais par les écrans eux-mêmes. Après tout pourquoi pas garder la logique d’interaction des écrans du côté des vues et de laisser les ViewModels uniquement traiter des données.

Le problème dans cette approche, c’est qu’il est souvent nécessaire de devoir écrire du code dans la partie « code-behind » et pour beaucoup de puriste cela n’est pas acceptable. Cependant, en y regardant d’un peu plus près, il n’est pas rare de trouver dans des projets des ViewModels très (trop) complexe, car en plus de traiter des données, ils ont aussi la charge de gérer une partie des interactions écrans. Gardons en tête que nos ViewModels doivent être découplés un maximum des vues mais également testable facilement.

Je ne vous écrit pas tout cela aujourd’hui avec des certitudes, mais plutôt avec des interrogations. Et c’est dans cet esprit que je vous propose une solution simple pour palier à la problématique d’affichage d’une boite de confirmation avant l’exécution d’une commande d’un ViewModel. La solution exposée ci-dessous a été réalisée pour WPF, mais pourra facilement être utilisé pour Silverlight.

Lire la suite…

J’ai été confronté ces dernières semaines à la problématique du développement multi-plateforme. Il est vrai que Microsoft a fait beaucoup d’effort pour uniformiser ces environnements de développement, mais dans la réalité le portage de code n’est pas toujours aussi évident qu’il n’y parait. On pourra tout de même noter l’existence de projet comme : Portable Library, qui permet de conserver un maximum de code commun entre diverses plateformes, mais avec quelques limitations.

Je vous propose donc ici un petit exemple d’application que j’ai réalisé et qui montre que le développement sur plusieurs plateformes peut se faire assez simplement.
En deux mots, cette petite application permet la consultation et l’administration de médias de tout types, un peu dans le même esprit que mon Media Browser simple. Cette application a été développée avec WPF et Silverlight pour la partie consultation/administration et Windows Phone uniquement pour la consultation.

Le but n’étant pas de faire un cours, mais juste une présentation, je pars donc du principe que les notions de services WCF, d’injection de dépendances, de pattern MVVM, d’architecture en couches, etc. n’ont plus de secret pour vous.

Deux petits schémas de l’idée générale de l’application :

Aperçu des clients :

Aperçu de l’architecture technique :

Lire la suite…

Ce petit post fait suite à un article que j’avais publié, il y a déjà un petit moment de cela, sur la localisation d’une application « WPF » à l’aide des fichier ressources : http://www.sebastien-alves.fr/index.php/2009/12/14/localisation-dune-application-wpf/

Je vous propose donc ici une classe un peu plus puissance que ma simple classe « LangResource », qui se contentait de traiter qu’un seul fichier ressource. Cette classe, que j’ai nommé « LocalizationHelper », permet d’enregistrer dans un cache l’ensemble des ressources de votre application et de « binder » les valeurs associées dans les vues XAML grâce à des clés. Ainsi, si vous souhaitez mettre à jour la culture courante de votre application, il suffira d’appeler la méthode « UpdateCultre » de la classe « LocalizationHelper » qui va parcourir l’ensemble des ressources et notifier les différentes vues de votre application.

Premièrement voici la classe en question :

Lire la suite…

Je vous propose dans ce petit post de vous parler rapidement des validations en WPF. En effet, je trouve la mise en place de celles-ci souvent pénibles et j’ai donc cherché un moyen plus astucieux pour les utiliser et tout cela dans un contexte MVVM.

En cherchant un peu sur la toile, je suis tombé sur un post très intéressant (ici), qui propose de coupler l’utilisation du « IDataErrorInfo » avec les « DataAnnotations ». J’ai alors adapté cette idée et l’ai intégrée pour que les propriétés de mon « ViewModel » puisse accueillir facilement ces notions de validations.

J’ai dans un premier temps créé un « ViewModelBase », qui sera l’élément parent de tous les « ViewModels » enfants de mon projet et qui héritera de « IDataErrorInfo ». Ensuite, j’ai intégré dans la méthode « public string this[string columnName] » (implémentation du « IDataErrorInfo ») la validation des annotations des propriétés de mes « ViewModels ». Et ceci grâce à quelques lignes de code couplées à des requêtes LINQ simple :

Lire la suite…

Vous n’êtes pas sans savoir que Microsoft ADO.NET Entity Framework 4.1 est sortie en version Release ces dernières semaines : http://blogs.msdn.com/b/adonet/archive/2011/04/11/ef-4-1-released.aspx

J’ai donc eu l’occasion de commencer à l’utiliser et mes premières impressions sont plutôt positives, surtout avec l’arrivée du nouveau pattern de développement : Code First. En effet ce modèle fournit une belle alternative à ce que proposait Entity Framework jusqu’ici, autrement dit la création d’un fichier edmx à partir d’une base de données ou plus récemment le mode Model First pour générer la base de données à partir d’un diagramme de classe.
A l’inverse, le mode Code First se détache de la persistance et oriente sa stratégie autour de la définition de simples classes C # ou VB.NET, classes qui sont mises en relation avec une base de données à l’aide d’un simple contexte. L’approche est donc totalement orientée objet et c’est clairement ce qui me plait !

Un exemple très simple :
Lire la suite…