Parfois on a besoin de la totalité de la surface de l’écran, on ne peut donc se permettre d’afficher la system tray (la barre en haut de l’écran avec l’heure, l’état du réseau, etc…), toutefois cela est handicapant pour l’utilisateur, il ne pourra ni voir l’heure, ni voir l’état du réseau, etc… Il sera alors obligé de sortir de votre application ou pire, il pourra penser que votre application rame alors qu’en réalité il capte mal le réseau.

J’ai déjà proposé deux solutions à ce problème sur ce blog :

• La rendre transparente
• L’afficher uniquement lorsque l’on clique en haut de l’écran

Nous allons voir aujourd’hui une troisième façon, utilisé notamment par internet explorer.

Le principe

Lorsque l’on ouvre l’application internet explorer, on se rend compte que celle-ci ne dispose pas de system tray. Toutefois en utilisant l’application, on se rend compte que l’heure est bien affiché lorsque l’on ouvre le menu de l’application bar (notamment en appuyant sur « … »).

 

 

 

 

 

 

 

 

 

 

 

 

Nous allons donc tenté de reproduire ce comportement.

Détecter l’ouverture de l’application bar

Ceci est plutôt facile, il suffit uniquement de s’enregistrer sur l’évènement StateChanged de l’application bar :

ApplicationBar.StateChanged += ApplicationBar_StateChanged;

void ApplicatioBarStateChange_DisplayTime(object sender, ApplicationBarStateChangedEventArgs e)
{

bool menuvisible = e.IsMenuVisible;

}

Afficher la system tray

Pour demander l’affichage de la barre d’affichage, il suffit d’écrire l’instruction suivante :

SystemTray.IsVisible = true;

En combinant les deux codes précédents, on arrive au comportement que l’on souhaitait :

ApplicationBar.StateChanged += ApplicationBar_StateChanged;

void ApplicatioBarStateChange_DisplayTime(object sender, ApplicationBarStateChangedEventArgs e)
{

SystemTray.IsVisible = e.IsMenuVisible;

}

Et voilà !

Enfin presque

Lorsque l’on teste l’application, on a bien le comportement que l’on souhaitait, toutefois, on remarque que la page se décale lorsque la system tray s’affiche alors que l’ont souhaite qu’elle s’affiche par dessus le contenu.

Pour cela, utilisons un dernière petit hack, au lieu d’afficher la system tray avec une opacité de 100%, affichons là avec 99%, l’effet visuel sera quasi inchangé, mais la system tray viendra maintenant par dessus le contenu et ne le décalera pas :

<phone:PhoneApplicationPage x:Class="Wikipedia.BrowsePage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
..
shell:SystemTray.Opacity="0.99" >

Vous pouvez évidemment mettre une valeur plus basse pour l’opacité.

Conclusion

Et voilà en quelques lignes de codes, on a réussi à reproduire le comportement d’internet explorer, vos utilisateurs ne seront donc plus obligé de sortir de votre application pour voir l’état du réseau ou l’heure, ce qui est un grand plus.