Depuis mes derniers articles sur cette avancée des Xamarin.Forms le Shell a bien évolué et il y a de nouveau des tas de choses à en dire ! Parmi les plus essentielles la navigation modale s’impose à presque toute App. Comment le faire simplement ?
La navigation modale
Elle diffère grandement de la navigation “classique”, à la fois dans la façon de faire et visuellement pour l’utilisateur. Du côté de ce dernier une page modale dans le Shell va apparaître par dessus la page en cours en venant du bas par recouvrement dans une belle animation (si on choisit le mode animé). Côté développeur la page modale n’est pas poussée sur la pile comme dans le cadre d’une navigation habituelle. C’est une page “bloquante” qui va nécessiter une action de l’utilisateur pour être fermée (et par conséquent une action du développeur). Il pourra s’agir d’un bouton à taper pour marquer son approbation ou tout autre type de choix ou d’action pouvant déclencher la fermeture.
Sous Xamarin.Forms et avec le Shell il est maintenant possible de naviguer de façon modale en utilisant une simple propriété…
Le Mode de Présentation
Shell a rationnalisé la navigation en lui donnant une structure, une API. Et au sein de cette dernière sont gérés tous les styles de navigation par le biais de la propriété PresentationMode. En utilisant cette dernière on peut notamment effectuer une navigation modale avec ou sans animation. En mode non modale cette propriété peut être utilisée pour contrôler la façon dont les pages sont poussées sur la pile.
Modal Animé
C’est le mode le plus sympathique pour le modal car il présente une animation assez sobre mais efficace faisant venir la page modale depuis le bas de l’écran dans un mouvement de recouvrement de la page en cours. La sémantique de cette animation colle parfaitement à celle de l’action informatique et de son intention. Mais il est possible dans des cas où cela est mieux approprié de naviguer en modal sans cette animation. A chacun de voir en fonction du contexte.
Pour accéder à une telle navigation il suffit d’utiliser le mode ModalAnimated de PresentationMode :
Shell.PresentationMode="ModalAnimated"
On place cette propriété (et sa valeur) directement dans l’élément de déclaration de la ContentPage :
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App11.Views.ModalPage"
Shell.PresentationMode="ModalAnimated">
Il est tout aussi possible de fixer cette valeur dans le code behind de la page même si l’intérêt est mince :
Shell.SetPresentationMode(this, PresentationMode.ModalAnimated);
Fermer une page modale
La nouvelle navigation arrière du Shell peut être utilisée pour mettre fin à une page modale. Celle-ci s’écrit pour mémoire :
Shell.Current.GoToAsync("..");
On utilise deux points comme pour remonter par “cd” dans l’arborescence des répertoires sous DOS 
Ce code sera utilisé dans le code behind puisque c’est un code d’UI qui ne demande aucun traitement. Dans le cas contraire on ajoutera l’envoi d’un message par une messagerie MVVM pour que l’information arrive au ViewModel concerné.
Se prémunir d’un retour arrière “système”
Les unités mobiles possèdent un bouton hardware ou software permettant à l’utilisateur de revenir en arrière. Bien entendu tout l’intérêt d’une page modale est d’éviter qu’une telle action s’exécute dans l’App en cours.
Le Shell gère parfaitement cette situation en offrant une méthode virtuelle protégée OnBackButtonPressed() qu’il suffit alors de surcharger de la façon suivante :
protected override bool OnBackButtonPressed() => false;
On coupe alors l’herbe sous le pied de cette commande et l’utilisateur ne pourra quitter la page modale aussi facilement ! Il devra appuyer sur le bouton que vous aurez ajouté et qui déclenchera la navigation arrière pour annuler la page modale…
Conclusion
Le Shell est une avancée de premier plan dans les Xamarin.Forms car la navigation sur unité mobile est loin d’être un sujet simple. Tout ce qui permet de rendre ces actions cohérentes tant du point de vue visuel pour l’utilisateur que du point de vue de l’API pour le développeur est essentiel.
Un peu frustre dans sa première version, le Shell a su intégrer rapidement de nombreuses demandes pour le rendre plus souple, plus puissant et capable d’être généralisé dans toutes les Apps. Ne le négligez surtout pas ! Même s’il manque souvent maintenant au toolbox MVVM de l’intégrer à leur propre philosophie de navigation ce qui prend du temps.
Bonne navigation… et
Stay Tuned !