La Journée Agile à Namur, le 28/11/2012

22. October 2012 13:10 by Renaud in   //  Tags:   //   Comments (0)

Cet été, nous avons eu la chance, à plusieurs reprises dans le cadre des Afterwork Parties, d'accueillir au MIC quelques membres fondateurs de DotNetHub. La spécialité de ce users group belge, en dehors d'être l'une des plus importantes communautés .NET francophones, est qu'il organise de nombreux évènements mêlant à la fois technologies Microsoft et méthodes agiles. Le 28 novembre prochain, l'association DotNetHub / AgileHub a décidé de mettre en place un grand évènement agile francophone, sobrement intitulé "Journée Agile". Le programme complet est disponible sur le site web de l'évènement ! Sont prévues au total : 18 sessions par une quinzaine de speakers. Les sujets traités sont assez variés. Cela va de l'atelier d'introduction aux principes "lean", à la conférence technique sur l'ALM et Team Foundation Server, en passant par des retours d'expériences. (http://www.journeeagile.be). Si cette journée vous tente, sachez que les inscriptions sont d'ores et déjà ouvertes. Vous avez jusqu'au 26 octobre pour profiter du prix Early Birds! Nous avons également un nombre limité de codes promos à vous offrir ! Pour en profiter lors de votre inscription, il suffit de nous contacter sur Twitter en mentionnant le @micbelgique ou @dumontrenaud. Ex: "Hello @micbelgique, est-ce qu'il vous reste des codes promo pour la #journeeagile de #dotnethub ?" Rendez-vous donc le 28 novembre, à Namur, dans les bâtiments de l'Henallux implantation IESN pour une journée Agile et Microsoft :)

L‘agenda du développeur enthousiaste

17. October 2012 15:10 by Renaud in   //  Tags:   //   Comments (0)

Si vous êtes allé sur le net récemment, vous aurez remarqué que cette fin d'année va être particulièrement chargée en évènements :) et honnêtement ce n'est pas pour me déplaire. On a droit à des hackathons, des grosses annonces Microsoft, des trainings et autres events organisés par la communauté. J'vais donc essayer ici de vous proposer un petit résumé des dates à retenir pour les développeurs du monde Microsoft !

19 Oct.
Startup Weekend Mons
2012

Le Startup Weekend vient s'installer à Mons, et plus exactement à la HELHa (Haute École Louvain en Hainaut, où j'ai d'ailleurs fais mes études, soit dit en passant :) ). Le concept : 54 heures pour créer une startup en équipe, ou du moins un concept qui tienne la route, et que l'on puisse défendre à la fin du weekend devant un jury. J'y participerai avec une bande de développeurs .NET qui ont profité des inscriptions offertes par le MIC !

Inscription

7 Nov.
Training Windows 8 : Découverte du dev en C#/XAML
2012

Vous avez envie de participer à tous les évènements qui suivent mais vous n'avez pas encore d'expérience en développement Windows 8 ? Venez une après-midi au MIC et vous découvrirez les bases du développement d'une application Windows Store. C'est gratuit et c'est moi qui donne la formation. Il vous suffit de venir avec votre laptop équipé de Windows 8 et d'une version de Visual Studio 2012 pour Windows 8. L'idée de ce training, c'est de vous permettre de vous lancer rapidement en apprenant les concepts fondamentaux :) Par la suite, je vous proposerai des sessions plus avancées. D'ailleurs n'hésitez pas à me faire savoir si un sujet vous intéresse particulièrement. Je pourrais organiser une session là-dessus !

Inscription

9 Nov.
Startup Weekend Liège
2012

Même principe que le Startup Weekend Mons, mais à la Cité Ardente cette fois ! Il reste encore quelques semaines pour vous inscrire. Si vous êtes développeurs .NET, et que vous êtes intéressés par une invitation au Startup Weekend offerte par le MIC, n'hésitez pas à me contacter (sur twitter par exemple : @DumontRenaud ;) )

Inscription

10 Nov.
WOWZAPP 2012 In Belgium
2012

Le WOWZAPP 2012, c'est un hackathon international organisé par Microsoft. Bien que ce soit publié sur la partie student du site de Microsoft, c'est évènement est évidemment ouvert à tous les développeurs intéressés ! :) Malheureusement, cela se passe au même moment que le Startup Weekend Mons ! Il faudra donc faire un choix... Petit rappel pour les étudiants : les comptes DreamSpark donnent droit à tous les outils de développements gratuitement, et en participant à cet événement vous pouvez également gagner un abonnement de 6 mois à Windows Azure ! Double bonne raison pour y aller :)

Inscription

17 Nov.
When AZUG meets MADN (Coding BBQ)
2012

Ok, sérieusement : Qui ne rêve pas de faire un barbecue à cette période de l'année ? Et si en plus, on s'en sert d'excuse pour organiser une petite matinée de code ? Ce ce qu'ont décidé de faire les user groups AZUG et MADN, en organisant un évènement mélangeant Cloud, développement Mobile, et saucisses grillées ! Le planning de la journée suggère que la matinée sera dédiée au code, avec une démo des projets aux environs de 13h. Le reste de la journée étant réservée au barbecue ! :)

Inscription

23 Nov.
Windows App Day
2012

Cook Your App !Le Windows App Day s'adresse aussi bien aux développeurs qu'aux graphistes. Il s'agit d'une journée organisée par Microsoft et pour laquelle on nous promet des speakers internationaux :) A noter que l'une des sessions est consacrée à Windows Phone 8 ! D'ici là évidemment, le SDK aura été lâché dans la nature... :)

Inscription

28 Nov.
Journée Agile 2012 - Namur
2012

LA journée dédiée à l'agilité en Belgique et en français, c'est celle-là ! Organisée par l'association DotNetHub / AgileHub, la Journée Agile 2012 propose un programme de 18 sessions sur les méthodes agiles, scrum, la gestion de projet, l'ALM et TFS 2012. Le MIC Belgique a quelques codes promos à offrir pour l'inscription à cet événement. Plus d'infos dans ce billet : http://blog.mic-belgique.be/articles/la-journee-agile-a-namur-le-28-11-2012/

Inscription

MSDN Events

Ensuite, à côté de tout ça, il y a encore plein de formations organisées par Microsoft et les membres des communautés belges !

Plus d'infos

Encore plus d'events :)

Non non, ce n'est pas fini ! Mais je ne peux pas encore tout vous dire... D'ici la fin de l'année, il y aura d'autres nouvelles dates à ne pas manquer, et je vous en reparlerai ici dès que tout sera fixé ;) Et enfin, si vous participez à un évènement dans les semaines à venir, et qu'il ne se trouve pas dans cette liste, n'hésitez pas à nous en faire part dans les commentaires ! :) Ca intéressera sûrement quelqu'un.

[Windows 8] C# / XAML : Drag & Drop (fr)

1. October 2012 15:12 by Renaud in Windows 8  //  Tags: , ,   //   Comments (6)
Cet article présente une manière d'utiliser le Drag and drop entre deux listes différentes. Si vous voulez simplement permettre de réarranger les items au sein d'une même liste, il vous suffit de mettre les propriétés CanReorderItems et AllowDrop à True sur votre GridViewSample : http://sdrv.ms/U8tPem. Lisez ce commentaire.
À la recherche d'une idée d'application Windows 8 à développer, je voulais quelque chose qui me permette de tester le Drag & Drop (en partie parce que j'avais été intrigué en voyant les propriétés CanDragItems et DragItemsStarting sur les listes en WinRT). Et comme j'en avais assez de faire des applications classées 16+, pour être sûr de passer la certif, je voulais également faire une application sans équivoque qui soit notée 3+ ! Une app pour les tout-petits :) Du coup j'ai développé "Les animaux de la ferme", une sorte de puzzle en bois dédiée à l'apprentissage: disponible sur le Windows Store.

Le Drag & Drop sur WinRT

Indiquer si un event doit être déclenché ou pas

Il est très simple de déplacer des items provenant d'une liste. On va voir avec quelques lignes de code comment démarrer le drag, garder une trace des éléments manipulés, et finalement faire quelque chose de ces informations au moment du drop, si nécessaire. Si vous n'avez pas remarqué, il y'a généralement dans WinRT la possibilité de dire si un event doit être utilisé ou pas. On retrouve par exemple les propriétés suivantes : IsItemClickEnabled, IsRightTapEnabled, ... Ce qui va réellement nous faciliter la vie, c'est la propriété CanDragItems couplée à l'event DragItemsStarting. Tout cela étant hérité de la classe ListViewBase.

This post explains a way to use Drag & drop across two different lists. If you're looking for rearranging items within the same list, you just have to set the properties CanReorderItems and AllowDrop to True on your GridViewSample : http://sdrv.ms/U8tPem. Read this comment.
While looking for a new Windows 8 app idea, I wanted to make something using drag & drop, just for fun. I also wanted something that could be rated 3+ on the Store. An app for kids. And I suddenly remembered my childhood and that kind of puzzles with big pieces of wood. That's how I built "Les animaux de la ferme" (Farm's animals), which is available on the Windows Store for free.

Ce qu'on va déplacer

Pour faire simple, on va utiliser deux GridView. Cela marcherait tout aussi bien avec des ListView, mais peu importe. On va simplement afficher deux collections, et faire passer les items de l'une à l'autre grâce au drag and drop. Dans une page basique, je vais donc ajouter ces deux GridViews, plutôt similaires :

<GridView   ItemTemplate="{StaticResource ItemTemplate1}"
            ItemsSource="{Binding FirstCollection}"
            AllowDrop="True" CanDragItems="True" 
            DragItemsStarting="GridViewDragItemsStarting"
            Drop="GridViewDrop" Margin="10">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

<GridView   ItemTemplate="{StaticResource ItemTemplate2}"
            ItemsSource="{Binding SecondCollection}"
            AllowDrop="True" CanDragItems="True" 
            DragItemsStarting="GridViewDragItemsStarting"
            Drop="GridViewDrop" Margin="10">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

Les seules différences notables entre ces deux grilles sont les templates utilisés (ItemTemplate1 et ItemTemplate2), et les collections bindées (FirstCollection et SecondCollection). Notez ici les propriétés utilisées:

  • CanDragItems / DragItemStarting
  • AllowDrop / Drop
On va concrètement activer la possibilité de déplacer des items tout en écoutant l'événement indiquant le commencement d'un déplacement. Et on va également activer le drop, donc le fait de pouvoir lâcher un item sur ce contrôle, et écouter l'événement correspondant.

Première collection visible, deuxième collection encore vide.

Gestion du drag et du drop !

On va maintenant implémenter les eventhandlers pour DragItemsStarted et Drop. Dans ce cas-ci, on va faire simple et faire ça de manière assez générique pour pouvoir utiliser les mêmes eventhandlers sur chaque liste en permettant de déplacer les items de l'une à l'autre.

Lors du début du déplacement d'un élément, on se retrouve avec un DragItemsStartingEventArgs avec quelques propriétés intéressantes:

  • Items, une collection contenant les éléments déplacés.
  • Data, qui n'est autre qu'un DataPackage, le même que celui utilisé par le charm Share.
        private void GridViewDragItemsStarting(object sender, DragItemsStartingEventArgs e)
        {
            var item = e.Items.FirstOrDefault();
            if (item == null)
                return;

            e.Data.Properties.Add("item", item);
            e.Data.Properties.Add("gridSource", sender);
        }

On récupère ici le premier élément déplacé, et on va stocker quelques infos dans notre DataPackage, qui va nous service de contexte durant toute l'opération. On va ainsi garder une trace de l'item déplacé, ainsi que du grid duquel il provient !

Ensuite vient le moment de lâcher l'élément. Et si l'utilisateur le lâche par-dessus l'un des grids, l'eventhandler suivant sera appelé :

private void GridViewDrop(object sender, DragEventArgs e)
{
    object gridSource;
    e.Data.Properties.TryGetValue("gridSource", out gridSource);

    if (gridSource == sender)
        return;

    object sourceItem;
    e.Data.Properties.TryGetValue("item", out sourceItem);
    if (sourceItem == null)
        return;

    _mainViewModel.SwitchItem((DemoItem)sourceItem);
}

Dans ce code, on va comparer le grid de source, et le grid cible. Si les deux sont les mêmes, on ne fait rien, et l'élément reste dans sa collection. Dans le cas contraire, on va récupérer l'élément qui a été déplacé depuis notre DataPackage, et on va le changer de collection. Ici, je fais appel à une méthode de mon viewmodel qui fait passer les éléments d'une liste à l'autre. Et c'est tout ! Rien que ça. Il n'en faut pas plus pour faire du drag&drop entre deux listes. Les animations sont présentes automatiquement, et le tout forme un ensemble assez sympathique. 

Conclusion

Cela n'a jamais été aussi simple ! N'hésitez pas à télécharger les sources si quelque chose ne vous semble pas clair :

 

 

[Windows 8] C# / XAML : Drag & Drop (English)

1. October 2012 11:10 by Renaud in Windows 8  //  Tags: , , ,   //   Comments (19)

 It's really easy to move items from a list in a Windows 8 app. We'll see in this blog how we can start dragging items in a few lines of code, keep track of the item being dragged, and finally how to handle the drop of that item. You probably noticed that in the XAML now (something that didn't exist in Silverlight for Windows Phone 7), you can say, for some events, whether you want them enabled or not. For example, on a GridView, you'll find properties such as IsItemClickEnabled, IsRightTapEnabled, ... But there is also one property that will be really useful for now. It's called CanDragItems, and we will use it in addition to the DragItemsStarting event. Those properties are  inherited from the ListViewBase class.

 

What are we going to drag ?

To make it as simple as possible, we'll use two GridView. We could make it also with ListView as it also inherits from ListViewBase. We will simply display two collections, and make it possible for the user to move items from a list to the other using drag and drop. In a blank Page, I add those two GirdViews, that are quite similar :

<GridView   ItemTemplate="{StaticResource ItemTemplate1}"
            ItemsSource="{Binding FirstCollection}"
            AllowDrop="True" CanDragItems="True" 
            DragItemsStarting="GridViewDragItemsStarting"
            Drop="GridViewDrop" Margin="10">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

<GridView   ItemTemplate="{StaticResource ItemTemplate2}"
            ItemsSource="{Binding SecondCollection}"
            AllowDrop="True" CanDragItems="True" 
            DragItemsStarting="GridViewDragItemsStarting"
            Drop="GridViewDrop" Margin="10">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

The only differences are the templates used (ItemTemplate1 and ItemTemplate2), and the bound collections (FirstCollection and SecondCollection). Notice alose those properties :

  • CanDragItems / DragItemStarting
  • AllowDrop / Drop
We explicitly enable the possibility to move items, while listening to the event fired the user actually starts moving an object. And then, we also activate the ability to "drop", and we listen to the corresponding event to know when an item is dropped on one of the GridViews.
 

Handle the drag and the drop !

Now that the UI can display our collections, we will implement the eventhandlers for DragItemsStarted and Drop. In this case, we will make it simple and we will use the same handlers for both grid so that the user can move items from one grid to the other and vice versa.

When you start moving an item, you end up with a DragItemsStartingEventArgs, which has some interesting properties :

  • Items, a collection containing the dragged items.
  • Data, which is nothing less than a DataPackage object. The same as the one used by the Share charm for data transfer between apps.
        private void GridViewDragItemsStarting(object sender, DragItemsStartingEventArgs e)
        {
            var item = e.Items.FirstOrDefault();
            if (item == null)
                return;

            e.Data.Properties.Add("item", item);
            e.Data.Properties.Add("gridSource", sender);
        }

Here we retrieve the first dragged item, if any, and we store it in the DataPackage, which will act as a context during the whole operation. We also keep track of the "sender" grid, to know where that item comes from.

Then comes the moment you drop the item. And if the user drop it on one of the grid, the following event handler will be executed :

private void GridViewDrop(object sender, DragEventArgs e)
{
    object gridSource;
    e.Data.Properties.TryGetValue("gridSource", out gridSource);

    if (gridSource == sender)
        return;

    object sourceItem;
    e.Data.Properties.TryGetValue("item", out sourceItem);
    if (sourceItem == null)
        return;

    _mainViewModel.SwitchItem((DemoItem)sourceItem);
}

In that piece of code, we compare the source grid with the target grid. If they are the same, then we don't have nothing to do, the item will simply stays where it is. Otherwise, we will get back the item that was dragged, thanks to the DataPackage, and we will put it in the other collection (that's what does the SwitchItem method). And that's all. You don't need nothing more to use drag & drop between two collections. Animations are automatically added, and the result is quite nice ! 

Conclusion

It has never been that easy to use drag and drop ! Don't hesitate to download the sample project if something seems fluzzy :

 

 

TextBox

About the author

I'm a developer, blog writer, and author, mainly focused on Microsoft technologies (but not only Smile). I'm Microsoft MVP Client Development since July 2013.

Microsoft Certified Professional

I'm currently working as an IT Evangelist with an awesome team at the Microsoft Innovation Center Belgique, where I spend time and energy helping people to develop their projects. I also give training to enthusiastic developers and organize afterworks with the help of the Belgian community.

MIC Belgique

Take a look at my first book (french only): Développez en HTML 5 pour Windows 8

Développez en HTML5 pour Windows 8

Membre de l'association Fier d'être développeur

TextBox

Month List