12/10/2011

[XAML] Notifications dans la barre de tâches

En dépannage (qui devient souvent permanent), on a parfois besoin de créer de petits outils avec un accès rapide à 2-3 fonctionnalitées sans forcément nécessiter une (grosse) interface graphique. Moi j'obte dans ce cas pour une application silencieuse avec des accès direct depuis la zone de notification.

Et bien voilà, en WPF rien de natif pour créer des icônes dans la zone de notification et pour celles et ceux qui me lise déjà, vous savez que je ne suis pas fan de réutiliser des Winforms pour pallier à ce problème. J'utilise donc une API qui a été développée par Philipp Sumi. Son API est très efficace pour avoir rapidemment un résultat et en même temps permets d'affiner très précisément si besoin.

On démarre par télécharger le projet ici

On ouvre, on compile, et on va chercher la merveilleuse : Hardcodet.Wpf.TaskbarNotification.dll

Donc notre projet, on rajoute la dll en référence ("Project", "Add Reference...")

Puis on l'instancie dans le XAML :

xmlns:systray="clr-namespace:Hardcodet.Wpf.TaskbarNotification;assembly=Hardcodet.Wpf.TaskbarNotification"

Ensuite on rajoute notre composant :
<systray:TaskbarIcon x:Name="mySystrayIcon" IconSource="/Images/test.ico" ToolTipText="Test">
</systray:TaskbarIcon>

Pour rajouter un menu contextuel, rien de plus simple, celui ci est disponible :
<systray:TaskbarIcon x:Name="mySystrayIcon" IconSource="/Images/test.ico" ToolTipText="Test">
   <systray:TaskbarIcon.ContextMenu>
      <ContextMenu>
         <MenuItem Header="Test"/>
      </ContextMenu>
   </systray:TaskbarIcon.ContextMenu>
</systray:TaskbarIcon>

Ce qui m'a de suite séduit dans cette API c'est le fait de pouvoir utiliser des UserControl pour effectuer ses notifications.

Vous créez donc votre notification dans un Userontrol :


Ensute on rajoute bien évidemment la référence vers le local :
xmlns:local="clr-namespace:MonApplication"

Et on l'intègre de cette façon :
<systray:TaskbarIcon x:Name="mySystrayIcon" IconSource="/Images/test.ico" ToolTipText="Test">
   <systray:TaskbarIcon.TrayPopup>
      <local:MyUserControl/>
   </systray:TaskbarIcon.TrayPopup>
   <systray:TaskbarIcon.ContextMenu>
      <ContextMenu>
         <MenuItem Header="Test"/>
      </ContextMenu>
   </systray:TaskbarIcon.ContextMenu>
</systray:TaskbarIcon>
Ensuite si vous souhaitez utiliser votre User Control à partir du code behind, vous allez procéder comme ceci :

private void ShowMyUserControl()
{
   mySystrayIcon.ShowCustomBalloon(new MyUserControl(), System.Windows.Controls.Primitives.PopupAnimation.Slide, 2500);
}
Personnellement j'aime utiliser mes petites applications de cette manière là c'est à dire avec juste un menu contextuel personnalisé qui s'efface lorsqu'il perd le focus. Ce qui donne :
<systray:TaskbarIcon x:Name="mySystrayIcon" IconSource="/Images/test.ico" ToolTipText="Test" PopupActivation="RightClick" TrayLeftMouseUp="mySystrayIcon_TrayLeftMouseUp" >
   <systray:TaskbarIcon.TrayPopup>
      <local:UC LostFocus="UC_LostFocus"/>
   </systray:TaskbarIcon.TrayPopup>
</systray:TaskbarIcon>
Et dans mon code behind:

public MainWindow()
{
   this.Visibility = System.Windows.Visibility.Hidden;
}

private void UC_LostFocus()
{
   this.Close();
}

private void mySystrayIcon_TrayLeftMouseUp()
{
   //Traitement sur le clic gauche.
}
Vous avez également remarqué que je me suis abonné à TrayLeftMouseUp qui me permet de gérer mon clic gauche.

Vous pouvez retrouver le tutoriel intégral de Philipp Sumi en anglais sur The Code Project, il couvre vraiment la plupart des cas (Du moins les miens ont trouvés toutes les réponses) et notamment approfondie la partie command, routed event, databindig.

Aucun commentaire:

Enregistrer un commentaire