Blog - Title

October, 2011

  • Stéphanie Hertrich

    Evènement communauté Silverlight mercredi après-midi, 26 octobre

    • 0 Comments

    La communauté Silverlight qui s’est montée récemment sur Facebook (http://on.fb.me/pVH80X) organise son premier évènement dans nos locaux ce mercredi après-midi (le 26 octobre).

     

    N’hésitez pas à venir assister aux sessions inédites :

     

    La communauté Silverlight France se lance, venez participer à sa naissance !


    - Session “Présentation de la Communauté” (15mn)

    Découvrez la communauté, son site web, son mode de fonctionnement et comment contribuer à celle-ci. Vous aimez Silverlight et vous souhaitez partager ? Alors venez aider et contribuer ! Vous aimez Silverlight mais vous ne savez pas par quel bout commencer ? Venez comprendre comment apprendre auprès d’experts reconnus sur le meilleur des ressources francophones. Vous ne connaissez pas encore Silverlight ? Venez découvrir et mesurer tout le potentiel de cette technologie qui a déjà fait ses preuves aujourd’hui et qui réserve bien des surprises à l’avenir.

    - Session “Silverlight 5 : Nouveautés et 3D” (1h20)

    Présenté par David Catuhe (Microsoft France), Cyril Cathala (So@t) et Nathanael Marchand (So@t)

    Silverlight 5 arrive et apporte son lot de nouveautés. A travers cette session, vous allez pouvoir découvrir, comprendre et analyser toutes les nouveautés de cette version qui repousse encore plus loin les limites des RIA. Au menu, fenêtres natives, intégration encore plus poussée avec Windows, capacités multimédia améliorées tout ceci en proposant des outils encore plus performants pour le développement et le débogage.

    Mais la plus grosse innovation de Silverlight reste l’intégration du moteur XNA: la 3D dans Silverlight. Aidés de la dernière version du Silverlight Toolkit, nous découvrirons comment profiter d’une des plateformes de référence utilisée pour les jeux vidéo (sur XBOX et Windows Phone 7) afin que vos visiteurs soient époustouflés par des visites virtuelles, des catalogues de produits animés et d’autres raffinements qu’aucune autre technologie web ne permet si simplement.

    - Session “Rx Framework” (40mn)

    Présenté par Aymeric Lagier (SUPINFO/MSP Expert Silverlight), Christophe Argento (Ineat Conseil) et Kévin Alexandre (Wygwam)

    Le challenge des interfaces d’aujourd’hui est de proposer toujours plus de fluidité tout en poussant la complexité tant au niveau des sources de données que du volume de données. Venez découvrir cette

    bibliothèque de Microsoft qui permet de simplifier le développement, gagner en fluidité tout en maitrisant les pièges de l’asynchrone.

    - Session “Communication en Silverlight” (40mn)

    Présenté par John Thiriet (MCNext) et Matthieu Mezil (Infinite Square/MVP)

    Communiquer efficacement en Silverlight est un challenge. Vous pourrez découvrir lors de cette session des méthodes et astuces pour que votre application soit efficace face aux scénarios les plus complexes. La nouvelle couche Low Latency de Silverlight 5, la comparaison entre la pile de communication navigateur et client, WCF pour Silverlight seront notamment les sujets abordés lors de cet après-midi.

    - Session “Retour d’expérience MVVM” (40mn)

    Animé par Stéphanie Hertrich (Microsoft France) et Jonathan Antoine (Infinite Square/MVP)

    Session spéciale, interactive et inédite : nous discuterons ensemble de MVVM afin de bénéficier du retour d'expérience de chacun. La session se voudra agile et sera construite d'après vos retours, en abordant de nombreux thèmes comme les difficultés rencontrées fréquemment avec ce pattern, les frameworks du marché, etc.


    A la suite de ces sessions, un petit cocktail sera proposé afin de partager en toute convivialité avec les acteurs de la communauté ainsi que l’équipe de développement du Silverlight 5 Toolkit présente en exclusivité pour vous.

    Heure
    mercredi 26 octobre · 14:00 - 18:00

    Lieu
    Campus Microsoft
    41 Quai du Président Roosevelt
    Issy-les-Moulineau, France

     

    A mercredi ! Verre à cocktail

  • Stéphanie Hertrich

    Application CaveAVins pour Windows Phone : Scanner un code barre

    • 0 Comments

    Edit 14/11/2011 : Mieux que de prendre le code en photo : Scannez un code barre/QR en live dans un flux vidéo en 1 ligne de code ! http://bit.ly/ud2rFn 

    Cet article complète la première maquette de l’application CaveAVins pour Windows Phone 7.5, en ajoutant une fonction d’aide à l’achat grâce au scan du code-barre de la bouteille.

    L’application initiale permet d’ajouter, modifier, noter, localiser géographiquement un vin. Pour simplifier la création d’un vin et surtout obtenir une aide à l’achat d’un vin en boutique, il sera possible de prendre le code-barre de la bouteille en photo, de visualiser les notes qui lui ont été données par les autre utilisateurs et d’obtenir la fiche complète du vin. Si cette bouteille n’a pas encore été évaluée, la fiche du vin devra être créée manuellement et sera ainsi prête pour les prochains acheteurs.

    image

    Nous complèterons l’application existante, en mettant en place les éléments suivants:

    • Utilisation de la librairie de scan de code-barres et QR code ZXing, sur CodePlex
    • Ajout d’une tuile secondaire permettant d’accéder au scan en 1 clic, depuis l’écran d’accueil
    • Ajout de la note moyenne des utilisateurs sur la fiche de vin

    Résumé des épisodes précédents

    Articles:

    Tutoriels:

    Le fonctionnement dans l’application

    1 - Le scan de code-barre est accessible à partir de la tuile secondaire ou de la page d’ajout/édition d’un vin

    imageimage

    2 - Le code-barre d’une bouteille est pris en photo

    WP_000243

    3 – Ce vin existe déjà dans le catalogue : sa fiche est complétée automatiquement, ou une nouvelle fiche de vin sera créée. La note moyenne donnée par les utilisateurs s’affiche au bas de la photo.

    image

    Utilisation de la librairie ZXing

    Téléchargez la librairie ZXing sur codeplex. Elle permet de scanner différents types de code-barres ainsi que des code QR dont voici la liste:

    UPC-A and UPC-E
    EAN-8 and EAN-13
    Code 39
    Code 128
    QR Code
    ITF
    Data Matrix (Not tested)
    PDF417 (Not tested)

    Dans notre cas, nous utiliserons le type Code 128.

    La librairie est sous licence Apache 2.0 et peut donc être utilisée sur le marketplace.
    Plus d’information concernant l’utilisation de librairies open-source sur le marketplace:

    Pour utiliser la librairie, référencez-la dans votre application Windows Phone

    image

    Le scan de code barre est déclenché par le code ci-dessous où l’on récupère le résultat de manière asynchrone:

    /// <summary> /// Button click handler to initiate scanning. This should be ted to the click event for a button in your application /// </summary> public void ScanBarCode()
    {
        try {
            WP7BarcodeManager.ScanMode = com.google.zxing.BarcodeFormat.UPC_EAN;
            WP7BarcodeManager.ScanBarcode(BarcodeResults_Finished); //Provide callback method     }
        catch (Exception ex)
        {
            Debug.WriteLine("Error processing image.", ex);
        }
    }
    
    /// <summary> /// Callback method that processes results returned by the WP7BarcodeManager. Results are also stored at WP7BarcodeManager.LastCaptureResults. /// </summary> /// <param name="BCResults">Object that holds all the results of processing the barcode. Results are also stored at WP7BarcodeManager.LastCaptureResults.</param> public void BarcodeResults_Finished(BarcodeCaptureResult BCResults)
    {
      Deployment.Current.Dispatcher.BeginInvoke(() =>
      {
        try {
            if (BCResults.State == CaptureState.Success)
            {
                BarCode = BCResults.BarcodeText; //Use results FindWineFromBarCode(_BarCode);
            }
            else {
                MessageBox.Show(BCResults.ErrorMessage);
            }
        }
        catch (Exception ex)
        {
            MessageBox.Show(String.Format("Barcode Processing Error: {0}", ex.Message));
        }
      });
    }

    En suivant l’exemple de code plus complet fourni dans la page de documentation, vous pourrez même faire fonctionner votre application dans l’émulateur : il suffit dans ce cas de choisir une image sur votre disque plutôt que de prendre une photo.

    On recherche ensuite un vin ayant le code-barre détecté et on charge sa fiche s’il existe déjà dans la base, la fiche reste vierge en dehors du code-barre et devra être remplie manuellement.

    private void FindWineFromBarCode(string barCode)
    {
        // On cherche d'abord dans notre propre cave à vins var existingWine = CaveAVinsModel.Instance.Bottles.FirstOrDefault(b => b.WineInfos.BarCode == barCode);
        if (existingWine != null)
        {
            MessageBox.Show(Resources.Strings.Wine_AlreadyExistsInYourCave);
            SelectedBottle = existingWine;
        }
        else {
            // sinon on recherche le vin dans le catalogue complet CaveAVinsModel.Instance.FindWineFromBarCode(SelectedBottle, barCode,
                 () => RefreshWineInfos(SelectedBottle));
        }
    }

    Ajout d’une tuile secondaire pour scanner une bouteille en 1 clic depuis l’écran d’accueil

    Pour faciliter l’ajout d’un vin, il est possible d’épingler la fonction de scan d’un code-barre directement sur la page d’accueil du téléphone.

    image

    La tuile secondaire est créée en cliquant sur le bouton image visible sur la page d’édition du vin.

    Voici le code utilisé pour créer la tuile :

    void CreateApplicationSecondaryTile()
    {
        var appTile = ShellTile.ActiveTiles
            .FirstOrDefault(t => t.NavigationUri.ToString().Contains("Scan"));
        if (appTile == null)
        {
            StandardTileData secTileData = new StandardTileData()
            {
                BackgroundImage = new Uri("/icons/barcode.png", UriKind.Relative),
                Title = Strings.secTileBarCode_Title,
            };
    
            ShellTile.Create(new Uri("/View/EditWineView.xaml?Scan=1", UriKind.Relative), secTileData);
        }
    }

    Un paramètre “Scan” est passé à la page EditWineView pour différencier les sources d’appel : depuis la tuile ou depuis l’application. Si c’est la tuile qui a déclenché la navigation sur la page, on lance directement la fonction de scan, pour minimiser le nombre de clics. Cette opération est réalisée en surchargeant la méthode OnNavigatedTo:

    protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
    {
        if (e.NavigationMode == System.Windows.Navigation.NavigationMode.New)
        {
            if (NavigationContext.QueryString.ContainsKey("Scan"))
            {
                App.ViewModel.EditWineViewModel.ScanBarCode();
            }
        }
        else {
            base.OnNavigatedTo(e);
        }
    }

    Ajout de la note moyenne des utilisateurs sur la fiche de vin

    Il faut pouvoir différencier la note que l’on donne au vin, de la moyenne de celles données par les autres utilisateurs. C’est pourquoi l’affichage de la note moyenne du vin est ajouté au bas de la photo, sur la fiche du vin.

    image

    Pour l’instant, celle-ci est calculée en temps réel lors de l’ouverture de la fiche : on récupère toutes les fiches de caves associées à ce vin qui comportent une note et on en fait une moyenne. Mais on pourrait imaginer la stocker dans la fiche et la mettre à jour à partir de notre WCF Data Service à l’aide d’un intercepteur sur les requêtes d’ajout/modification sur l’entite MyWine. Ceci permettrait d’optimiser la communication entre l’application et la base de données. Ce principe d’intercepteurs a déjà été utilisé dans l’article précédent, pour stocker la latitude et la longitude associés à une adresse géographique et vous pouvez vous y référer pour comprendre comment cela fonctionne.

    Conclusion

    Cette fois-ci , l’application est réellement collaborative ! On retrouve une bouteille de vin déjà présente dans le catalogue, on peut voir la moyenne des notes qui lui ont été attribuées et également la noter soi-même. De là à ce qu’elle soit vraiment fonctionnelle, il n’y a qu’un pas…ou peut-être plusieurs, soit. Il manque encore plein de petits plus très pratiques comme pouvoir saisir le code-barre à la main ou retrouver une bouteille à partir de son nom. Il faudrait également pouvoir classer les vins dans des catégories et cépages.

    Mais vous l’aurez compris, le principe pour réaliser ces fonctions sont du même ordre que celles qui ont déjà été réalisées et ne justifient pas l’écriture d’un tutoriel dédié. D’autres fonctions collaboratives seraient néanmoins intéressantes comme le partage sur Facebook ou la possibilité de faire partager un vin à un autre utilisateur de l’application.

    D’autres plateformes peuvent aussi être très intéressantes pour ce genre d’applications avec notamment des possibilités avancées pour le partage d’information et les notifications.

    A suivre  Tire la langue !

Page 1 of 1 (2 items)