Dot.Blog

Il existe de nombreux plugins pour Xamarin iOS ou Xamarin Android, les Xamarin.Forms commencent à être elles aussi dotées de ces briques supplémentaires bien pratiques…

Petit shopping d’été…

C’est le mois d’août il fait chaud je vous propose un sujet un peu plus léger que d’habitude, un petit tour de shopping dans les contrôles pour Xamarin.Forms.

J’ai pris en compte certains critères pour cette liste :

• Il doit s’agit de plugin Xamarin.Forms (donc pas spécifiquement iOS, Android, UWP ou MacOS)
• Ces contrôles doivent offrir un support des trois principales plateformes (iOS, Android, UWP)
• Ils doivent être gratuits
• Leur code doit être publié
• Ils doivent être tenu à jour ou être dans une version réputée stable

A titre exceptionnel j’ai conservé des plugins qui par exemple ne supportent pas UWP car pour beaucoup cette plateforme n’est plus considérée comme “mobile” vu la mort de Windows Phone (même si Microsoft dit qu’un jour ils feront un smartphone innovant) et à ce titre on peut accepter un plugin orienté mobile qui ne couvre que Android et iOS s’il en vaut la peine. Dans la même veine certains plugins supportent Windows Phone 8.x mais pas UWP, on sent bien qu’il ne serait pas difficile d’ajuster le code pour ajouter le support de UWP.

Bref en regardant sur le site GitHub on trouve environ 4000 projets concernant les Xamarin.Forms. A trier ça occupe je vous le promets ! Mais je l’ai fait pour vous, c’est pas une chance ça ?

De tout et de rien

Forcément c’est une liste à la Prévert, on y trouve de tout. Pas encore beaucoup de contrôles visuels mais c’est normal cela oblige le plus souvent à écrire des Renderers pour toutes les plateformes et avoir une bonne connaissance de tous OS dans leurs API natives est assez rare. D’ailleurs même dans le payant ils se battent tous avec la sempiternelle grille ou le 302ème carrousel ou la 548ème jauge mais  pas de label avec coins arrondis ou de bouton rond par exemple.

Nuget ou pas Nuget ?

Certaines librairies sont juste fournies en code sources, d’autres ont fait l’objet d’un package Nuget mais ne valent pas la peine d’être totalement installées (mieux vaut repiquer le bout de code qui vous intéresse) et d’autres sont parfaitement à jour et disposent d’un paquet Nuget facile à installer dans Visual Studio… Si un package vous intéresse, avant de vous lancer dans le téléchargement et la compilation des sources vérifiez d’abord s’il y a un package Nuget tout prêt à consommer !

Les contrôles

La grille

Le classique des classiques.

https://github.com/akgulebubekir/Xamarin.Forms.DataGrid

Supporte Windows Phone et WinRT donc pas difficile d’ajouter un projet UWP.

Les lecteurs qui me suivent depuis longtemps savent à quel point je déteste les grilles. Mais parfois cela peut rendre service. A utiliser avec doigté donc !

Les images

FFImageLoading permet de charger les images très vite, gère des caches pour éviter les multiples téléchargements quand les images sont distantes, propose aussi des addon comme des transformations ou le support de SVG, etc. Très complet et tourne sur iOS, Android et UWP. Un bon contrôle qui rend de vrais services donc.

https://github.com/luberda-molinet/FFImageLoading

Range Slider

Un slider c’est bien, deux c’est mieux ! C’est ça un range slider, un slider avec deux boutons mobiles qui permettent ainsi de définir une étendue plutôt qu’une valeur unique. Assez pratique dans de nombreux cas et pas forcément évident à développer soi-même pour toutes les plateformes (même si ce n’est pas un contrôle très complexe il faut l’avouer).

https://github.com/halkar/xamarin-range-slider

Essentials

C’est un début de bonne idée d’une librairie de contrôle mais sans activité depuis un an. Toutefois on y trouve un conteneur bindable avec des Enums et un Cercle supporté par toutes les plateformes.

C’est donc plus du code où aller piocher qu’un package à installer dans sa totalité. Mais trouver de bonnes sources de code c’est important !

https://github.com/xDelivered-Patrick/Xamarin.Forms.Essentials

Behaviors Pack

Xamarin.Forms supporte les Behaviors de XAML et ça serait dommage de s’en passer ! Ce pack contient un EventToCommandBehavior, un classique pour assurer MVVM dans certains cas, SelectedItemBehavior pour déclencher une commande quand l’élément sélectionné d’une ListView change, DisplayActionSheetBehavior ou DisplayAlertBehavior qui sont assez parlants. S’agissant de code purement Xaml cela marche sur toutes les plateformes (le code “reste” dans la partie partagée pas d’interaction avec des API natives).

https://github.com/nuitsjp/Xamarin.Forms.BehaviorsPack

Caeno Toolkit

Un début de librairie qui ne supporte pas UWP malheureusement mais qui reste très intéressante notamment dans la liste des convertisseurs de valeurs qu’elle propose et qu’on peut “repiquer” de façon isolée (puisqu’on a le source sur GitHub…). Par exemple le ImageResourceConverter simplifie le binding avec une image placée en ressource, mais on trouve des choses comme le BoolNegationConverter bien utile pour faire un binding en pur XAML mais sur la valeur inverse d’un champ (par exemple rendre visible un contrôle quand un autre est caché et inversement). Pas mal de code intéressant donc même dans la partie iOS / Android avec une image circulaire (très à la mode).

https://github.com/Caeno/Caeno.XamarinForms.Toolkit

Forms Gesture

pour l’instant XF ne supporte qu’un seul détecteur de geste, le Tap. On peut vouloir accéder à d’autres “gestures” comme le Swipe gauche ou droit, haut ou bas ou le Pan. Cette librairie l’offre gracieusement ce qui permet d’agrémenter l’UX de ses applications. UWP n’est pas supporté mais le swipe sur un PC n’a pas beaucoup d’intérêt, Windows le supporte mais très peu de gens ont un écran tactile pour leur PC (j’en ai un depuis longtemps et je peux confirmer que sous Windows en desktop ça ne sert à rien).

https://github.com/softlion/XamarinFormsGesture/

ImageCircle

Ecrit par James Montemagno de Xamarin et supportant toutes les plateformes ce contrôle visuel permet de sacrifier à la mode des images rondes. C’est vrai qu’on ne voit rien vu que les appareils photos sont rectangulaires mais ça fait cool sur un écran de smartphone ! Soyez dans le vent et optez pour l’image ronde vous aussi !

https://github.com/jamesmontemagno/ImageCirclePlugin

Barcode scanner

Pour des applications LOB un scanner de barcode est un must. Mais on le voit aussi utilisé dans des Apps grand public type comparateur de prix. Dans tous les cas c’est assez pénible à développer et trouver un scanner tout fait est une bonne chose. Ne fonctionne pas avec UWP mais on image mal quelqu’un se déplacer avec sa tour PC pour scanner un barcode.. Donc pour iOS et Android ce qui se justifie. Attention on parle de barcodes et non de QR codes… mais c’est bien quand même !

https://github.com/rebuy-de/rb-forms-barcode

Rounded BoxView

Voilà un truc pratique dans plein de situations, une BoxView avec coins arrondis et border… Le package est bon mais il a été fait à l’époque de Windows Phone et son auteur (comme beaucoup…) n’a pas jugé bon de le mettre à jour pour supporter UWP. Ici aussi cela ne sera pas très compliqué d’ajouter un projet UWP et d’implémenter cela avec un Border XAML si vous en avez besoin.

https://github.com/paulpatarinski/Xamarin.Forms.Plugins/tree/master/RoundedBoxView

Custom Controls

Encore une librairie pas finie et au nom pas très innovant, mais il y a du bon dedans et la dernière maintenance date d’il y a 28 jours. C’est donc un travail en cours qu’il est intéressant de suivre pour voir ce que cela devient. On trouve un contrôle Accordéon, une AutoCompleteBox, un Repeater, un StateButton, etc… Déjà de quoi faire des emprunts pour enrichir le visuel de vos Apps ! Android et iOS uniquement pour le moment (mais une fois encore pour un développeur C#/XAML porter un code pour UWP c’est le plus facile).

https://github.com/DottorPagliaccius/Xamarin-Custom-Controls

Iconize

Disposer d’icônes sans trop s’embarrasser avec des images à fournir dans des tas de résolutions c’est plutôt sympa. Comment ? En utilisant des fontes de symboles… Le plugin supporte de nombreuses fontes comme Entypo+, Font Awesome, Ionicons, Material Design icons, MeteoCons etc… Cela fonctionne avec iOS, Android et UWP alors ne vous privez pas !

https://github.com/jsmarcus/Iconize

ButtonCircle

Après les images rondes, forcément, on veut des boutons ronds… Ce plugin le fait. il est vrai que c’est plus esthétique qu’un gros bouton rectangulaire dans pas mal de cas. Seul Android et iOS sont pour l’instant supportés mais UWP est prévu. La dernière mise à jour datant de 26 jours on peut supposer que le package est maintenu et que cela viendra. A surveiller.

https://github.com/wilsonvargas/ButtonCirclePlugin

Progress Ring

Après les images et les boutons il est normal de vouloir aussi une barre de progression ronde !

Celle-ci fonctionne sur Android et iOS seulement mais elle n’est pas mal fichu et à jour. A vous d’ajouter le code UWP si vous en avez besoin…

https://github.com/AndreasHennig/ProgressRingPlugin

IconEntry

C’est tout bête mais c’est vrai que ça rend le visuel beaucoup plus sympa tout de suite. Le principe : ajouter une icône devant un champ Entry. Une image valant mille mots:

Comme on le voit sans les icônes il faudrait placer des labels avec “login” “mot de passe” devant chaque zone ce qui serait moche, impliquerait une traduction, etc, là où les petites images sont plus parlantes..

https://github.com/Li-Yanzhi/IconEntry

Value Converters

Encore des convertisseurs de valeurs supportant toutes les plateformes et avec un très grand choix avec des choses plutôt originales comme  un BoolToThicknessConverter ou un EnumWrapperConverter à côté de choses plus classiques comme le BoolToVisibilityConverter ou le DateTimeConverter.

Une librairie de code à jour qui permet d’en faire toujours plus côté XAML pour éviter le code-behind ou les bricolages dans le ViewModel dont ce n’est pas le boulot…

https://github.com/thomasgalliker/ValueConverters.NET

Calendar

Un calendrier assez complet qui fonctionne sur toutes les plateformes cela peut servir. Il n’est pas d’une esthétique folle mais en personnalisant les couleurs on peut facilement l’intégrer dans une charte existante.

https://github.com/rebeccaXam/XamForms.Controls.Calendar

Effects

Un border, un placeholder des extensions pour ajouter un texte ou une commande. ToFlatButton rend les boutons Android flat comme ceux de iOS et leur ajoute un border. La librairie ne supporte pas UWP mais est maintenue. Elle possède donc un intérêt certain.

https://github.com/muak/AiForms.Effects

Animations simplifiées

Les Xamarin.Forms offrent de nombreuses solutions pour créer des animations, les lecteurs de mon Livre le savent déjà. Mais ces solutions impliquent du code C# alors qu’il serait plus facile (et plus logique) de manipuler cela côté XAML. Ce plugin permet de le faire. Le FadeTo, le Flip, le Rotate, le Shake… ils sont là et disponibles en XAML.

La façon dont cela est implémenté ne rend pas l’utilisation beaucoup plus simple car la complexité est déplacée en XAML où il est nécessaire d’utiliser des ressources ou des triggers ou même des Behaviors pour déclencher et cibler les animations. Je ne sais pas trop si le développeur y gagne beaucoup… Mais regardez et faites vous votre avis !

https://github.com/jsuarezruiz/Xamanimation

Logger

Pouvoir logger les évènements d’une App sans faire appel à l’artillerie lourde d’une instrumentalisation complexe n’est pas chose aisée en environnement cross-plateforme. Ce plugin propose une solution simple avec un Logger très classique gérant des niveaux d’importance et offrant plusieurs méthodes pour logger aussi bien du debug que de l’info ou des warnings ou des erreurs. Une méthode GetLocalStoragePath permet de récupérer le chemin de stockage utilisé selon la plateforme, GetAll permet de charger tout le log dans une string et Purge permet de l’effacer.

Pas de logger tournants, de mise en forme de fou, mais si vous ne disposez pas d’une solution ultra pro très sophistiquée ce plugin vous permettra tout de même de créer des traces en cas de pépin !

Fonctionne sur toutes les plateformes et la mise à jour est assez récente, le produit semble stable (et n’est pas très compliqué à maintenir, le code est simple).

https://github.com/wpbest/Plugin.Logger/tree/master/Plugin/Logger

File Picker

Sélectionner un fichier existant peut s’avérer une tâche ardue en mode cross-plateforme. Il est donc intéressant de disposer d’un plugin qui prend en charge cette fonction. FilePicker est à jour, il supporte toutes les plateformes et même Xamarin.Mac.

L’interface du picker permet de sélectionner un fichier (PickFile) de l’ouvrir ou de le sauvegarder en asynchrone. Sous iOS on peut même accéder à ICloud.

https://github.com/uk-taniyama/FilePicker-Plugin-for-Xamarin-and-Windows

Clipboard

le copier/coller reste l’emblème du collaboratif entre applications. Malgré les avancées techniques on ne peut pas s’en passer… D’où l’intérêt d’accéder au presse-papiers.

Fonctionne sur toutes les plateformes avec deux formules simples : SetText pour placer du texte dans le clipboard ou GetText. On pourra d’ailleurs regretter cette limitation au seul texte, tellement de choses pouvant se partager comme les images ou des fichiers. Mais ce n’est déjà pas mal…

https://github.com/stavroskasidis/XamarinClipboardPlugin

Toasts

Un toast croustillant avec des scrambled eggs et un bon thé, voilà un petit déjeuner très british et bien agréable ! Mais vous avez compris qu’ici il s’agit plutôt d’afficher des messages, moins gastronomique mais certainement plus utile qu’une tartine pour créer une App !

Ce plugin regroupe d’autres plugin dont le célèbre Crouton que j’ai utilisé dans certaines App et qui donnait de bons résultats visuels. Un gros travail d’amélioration a été fait pour fusionner trois plugins différents du même auteur. Android, iOS et UWP sont supportés.

https://github.com/EgorBo/Toasts.Forms.Plugin

StrapUp

Un autre début de librairie de plugin mais qui contient deux choses intéressantes : un CardView, comme les cartes d’Android, et un Expansion Panel (un panel qui se déplie). L’auteur précise avoir testé avec le profile 111 qui inclut UWP. A tester car les card views sont sympa et le panel rétractable peut rendre service.

https://github.com/ntheile/StrapUp.Forms

XamaRed.Forms.Svg

C’est un visionneur de SVG basé sur SkiaSharp dont je vous ai déjà parlé. Le support SVG de ce dernier n’intègre pas toutes les subtilités du format et seuls des dessins pas trop compliqués sont supportés mais cela peut être largement assez pour créer des icônes indépendantes de la résolution écran par exemple.

https://github.com/Brainflab/XamaRed.Forms.Svg

EasyLayout

Il ne s’agit pas d’un contrôle mais plutôt d’un ensemble de méthodes “helper” simplifiant l’utilisation du RelativeLayout, un conteneur très puissant mais pas toujours évident à manipuler. Un projet intéressant à connaître si on doit utiliser des positionnements relatifs sans trop se prendre la tête !

https://github.com/lprichar/EasyLayout.Forms

Auth

Produit par Xamarin ce plugin permet d’utiliser OAuth 1.0 et 2.0 dans une application. C’est technique, pas visuel du tout, mais c’est justement sympa de ne pas avoir à le coder soi-même !

https://github.com/xamarin/Xamarin.Auth

Popup Menu

Les popup menus sont toujours très pratiques. Ce plugin ajoute donc cette fonction bien utile à vos Apps sur toutes les plateformes.

https://github.com/SKLn-Rad/Xam.Plugin.PopupMenu

Messaging

un plugin très simple qui offre un accès cross-plateforme aux fonctions de type envoi de mail, de sms ou même d’appel téléphonique. Fonctionne forcément mieux sur un smartphone que sur un PC… même si UWP est supporté !

https://github.com/cjlotz/Xamarin.Plugins

Vibrations

Envoyer quelques secousses à l’utilisateur est un moyen simple et discret de l’avertir. C’est ce que propose ce plugin en toute simplicité. Bien entendu sur un PC cela n’envoi rien du tout… mais c’est supporté (car rappelez-vous que UWP fonctionne aussi sur Windows Phone ! Et que le prochain smartphone de MS utilisera vraisemblablement Windows 10 ou suivant et pas un OS à part, le support d’UWP n’est donc pas à négliger).

https://github.com/jamesmontemagno/VibratePlugin

Compas

Pour éviter que l’utilisateur ne perde le nord le mieux reste d’interroger le compas ! Ce plugin très simple permet de s’abonner à un évènement qui renvoie les informations du compas, sur toutes les plateformes (même si cela ne donnera rien sur un PC de bureau on s’en doute).

Simple Logger

Un autre logger fonctionnant sur toutes les plateformes et peut-être un peu plus subtile que l’autre avec notamment le contrôle de la taille du fichier de log et la création de nouveaux fichiers de façon automatique.

https://github.com/jirimatejka/xamarin-logger

Version Tracking

Voici un plugin plus original, le tracking de version très utile dans les Apps. Savoir par exemple si c’est la première fois que l’App est lancée pour afficher un petit message d’aide par exemple, savoir si l’App est à jour, connaître l’historique des mises à jour et deux ou trois choses du même ordre. C’est simple mais c’est très pratique.

Conclusion

Il existe bien d’autres plugins, payants ou non. Ici je me suis borné aux contrôles gratuits qu’on peut trouver sur GitHub avec le code source et qui présente un certain intérêt sans entrer dans les choses trop particulières.

J’espère que ce petit shopping d’été vous aidera ou vous donnera des idées pour vous Apps ou même pour développer de nouveaux plugins !

Stay Tuned (et n’attrapez pas de coups de soleil) !