Sables de MAUI : Numéro 66

Bienvenue dans Sands of MAUI, des numéros de type newsletter dédiés à rassembler les derniers contenus .NET MAUI pertinents pour les développeurs.

Une particule de sable, minuscule et inoffensive. Mais mettez beaucoup de particules de sable ensemble et nous avons quelque chose de grand, une force avec laquelle il faut compter. Ce sont les plus petits grains de sable qui s’additionnent souvent pour former des plages massives, des dunes et des déserts.

La plupart des développeurs .NET sont enthousiasmés par l’interface utilisateur de l’application multiplateforme .NET (MAUI)—l’évolution de l’expérience de développement multiplateforme .NET moderne. À l’avenir, les développeurs devraient avoir beaucoup plus confiance dans la pile technologique et les outils, car .NET MAUI permet des solutions multiplateformes natives sur mobile et sur ordinateur.

Bien que cela puisse prendre un long vol pour atteindre les sables de l’île de MAUI, l’enthousiasme des développeurs autour de .NET MAUI est assez palpable dans tout le contenu partagé. Comme les grains de sable, chaque actualité/article/documentation/vidéo/tutoriel/livestream contribue aux connaissances des développeurs dans .NET MAUI et nous développons une communauté/écosystème désireux d’apprendre et d’aider.

Sands of MAUI est une humble tentative de rassembler toutes les merveilles de .NET MAUI en un seul endroit. Voici ce qui est remarquable pour la semaine du 1 août 2022:

Restauration sur ordinateur et mobile

.NET MAUI est le framework de développement multiplateforme .NET moderne, permettant aux développeurs d’accéder à une plate-forme étendue à partir d’une seule base de code. Ce qui a commencé comme une évolution de Xamarin.Forms avec un état d’esprit axé sur le mobile inclut désormais la prise en charge des ordinateurs de bureau en tant que citoyen de première classe.

Alors que .NET MAUI atteint sans effort les mobiles et les ordinateurs de bureau, la réalité des différents facteurs de forme exige une réflexion sur la conception des applications pour une expérience utilisateur optimale (UX). L’espace de l’écran varie considérablement entre les facteurs de forme mobiles et de bureau, et les bonnes applications .NET MAUI doivent respecter les différences – et répondre à des UX de bureau et mobiles distinctifs.

Heureusement, il n’est pas difficile de répondre à différents facteurs de forme à partir d’une seule base de code, mais avec une UX légèrement différente. Des vérifications simples sur la plate-forme sur laquelle une application .NET MAUI donnée est exécutée permettent aux développeurs de proposer facilement différentes expériences. Le contenu de l’application et les modèles de navigation peuvent également être ajustés à la volée – MenuBar et Flyouts fonctionnent bien pour le bureau, tandis que les onglets peuvent fournir une meilleure UX sur mobile. Essentiellement, les applications et les développeurs .NET MAUI feront bien de respecter les différences de facteur de forme et de fournir une UX appropriée pour mobile/bureau.

Multi-Windows dans .NET MAUI

Les applications .NET MAUI fonctionnent de manière transparente sur iOS, Android, Windows et MacOS et les développeurs peuvent partager du code à partir d’une seule base de code. Une fonctionnalité du framework qui répond aux facteurs de forme du bureau est la prise en charge de plusieurs fenêtres – c’est une UX courante d’attendre plusieurs fenêtres d’application lors de l’exécution sur le bureau. Cependant, les facteurs de forme mobiles plus grands tels que les tablettes ou les appareils à double écran pliables peuvent également bénéficier d’applications générant plusieurs fenêtres de contenu.

Léomaris Reyes écrit un article sur le Prise en charge multi-fenêtres .NET MAUI et comment les développeurs peuvent tirer parti de la fonctionnalité de framework pour tirer le meilleur parti de leurs applications.

Alors qu’Android/Windows n’a pas besoin de configuration supplémentaire, iOS/MacOS nécessite des déclarations info.plist explicites et un délégué de scène avant de prendre en charge les fonctionnalités multi-fenêtres de l’application. Au-delà de cela, et comme le souligne Leomaris, les développeurs peuvent puiser dans l’objet Application.Current, qui fait référence à l’instance actuelle de l’application en cours d’exécution. Il existe une méthode magique OpenWindows() qui attend un objet Window avec une vue spécifiée, et le tour est joué, les développeurs peuvent créer de nouvelles fenêtres d’application.

Il existe également des options pour gérer et fermer les fenêtres d’application existantes. Dans l’ensemble, le multi-fenêtre est une fonctionnalité .NET MAUI indispensable qui sert principalement le bureau, mais également certains facteurs de forme mobiles.

Auth0 avec .NET MAUI

Alors que les développeurs commencent à créer des applications .NET MAUI multiplateformes plus sophistiquées, une fonctionnalité d’application indispensable serait la gestion de l’identité des utilisateurs, pour authentifier et autoriser les utilisateurs à accéder aux fonctionnalités de l’application. La plate-forme d’identité Auth0 peut aider les développeurs à centraliser/gérer les utilisateurs de plusieurs fournisseurs d’identité et à fournir des expériences d’inscription et de connexion transparentes et personnalisées.

Andréa Chiarelli écrit un article sur la façon de
ajouter l’authentification aux applications .NET MAUI avec Auth0-un merveilleux guide étape par étape.

Les développeurs doivent d’abord enregistrer leur application sur le tableau de bord Auth0, afin de rendre Auth0 conscient de l’application .NET MAUI. Ensuite, ajouter le package OpenID Connect Client NuGet à l’application .NET MAUI et écrire le code qui intègre l’application avec Auth0. Un client Auth0 doit être créé pour gérer les communications avec Auth0. Oui, des navigateurs Web sont impliqués et l’application doit être correctement configurée, mais le tout en suivant des étapes simples. Certaines modifications spécifiques à la plate-forme doivent être apportées à l’application .NET MAUI. Il s’agit d’indiquer à l’application comment gérer l’URI de rappel vers lequel Auth0 redirigera l’utilisateur après son authentification.

Une fois que tous les paramètres sont en place, les développeurs peuvent câbler l’interface utilisateur de connexion/déconnexion et permettre à Auth0 de faire le gros du travail d’authentification/autorisation. Il s’agit d’un article incontournable pour tous ceux qui cherchent à ajouter la gestion de l’identité des utilisateurs aux applications .NET MAUI – merci, Andrea, pour la rédaction.

Discord UI avec .NET MAUI

La série MAUI UI de juillet animée par Matt Goldman a fourni beaucoup d’inspiration aux développeurs en matière d’interface utilisateur. Il a été réconfortant de voir la communauté intensifier et recréer des interfaces utilisateur étonnantes qui mettent en valeur la puissance de .NET MAUI. La mi-juillet était le tour de
Cap Tylah et l’interface utilisateur choisie pour recréer était l’application populaire Discord—Tylah a également rédigé l’expérience avec un référentiel GitHub pour un accès facile au code.

Discord est une application populaire et l’interface de chat générique Discord est l’interface utilisateur parfaite pour recréer un défi. Tylah décompose l’interface de chat complexe en sections d’interface utilisateur pour créer l’en-tête, l’interface de message de chat et la section de saisie de l’utilisateur en pied de page. Tylah utilise le Shell avec des couleurs et un style intégrés, mais l’utilisation de FontImageSource pour afficher les glyphes à l’aide de la famille de polices MaterialIcons est géniale.

Avec l’utilisation de Grids, StackLayouts, Frames, ScrollViews et de fausses données, l’interface de chat prend vie, avec des images circulaires et des icônes correspondant à l’interface utilisateur de Discord. Pour quelqu’un de relativement nouveau sur .NET MAUI, il est intéressant de voir une interface utilisateur de chat riche en cours de création – bravo à Tylah et à la flexibilité de .NET MAUI.

Inspiration graphique .NET MAUI

Il est difficile de détourner le regard de la série de juillet MAUI UI – il y a tellement d’inspiration pour les développeurs .NET MAUI. Fin juillet a vu Shaun Laurent à son tour – et le but était de
construire un clone pour le célèbre jeu de dessin Draw Something.

Alors que tout au long du mois, les humains moyens ont recréé des interfaces utilisateur étonnantes avec .NET MAUI, faites confiance à Shaun pour l’intensifier et créer un clone avec des fonctionnalités d’application complètes.

Shaun a commencé par décomposer l’interface Draw Something en sections, avec une Page et un ViewModel correspondants regroupant le tout. La partie la plus impliquée était la création de la surface de dessin. Shaun utilise le .NET MAUI GraphicsView intégré, qui permet de rendre des graphiques 2D sur un canevas pouvant être dessiné. Avec une implémentation C# pure, Shaun est capable de développer lentement la fonctionnalité de dessin, c’est-à-dire la possibilité de sélectionner la couleur, l’épaisseur de ligne, de suivre l’interaction de l’utilisateur et de rendre le contenu du dessin sur le canevas.

Alors que la boîte à outils de la communauté .NET MAUI offre un contrôle DrawingView qui fournit une grande partie de cette fonctionnalité intégrée, la motivation de Shaun était de montrer la puissance des graphiques .NET MAUI et de laisser le reste d’entre nous émerveillés et inspirés.

C’est tout pour le moment.

Nous vous verrons la semaine prochaine avec un contenu plus impressionnant concernant .NET MAUI.

Bravo, développeurs !