Conception de votre application Microsoft Teams avec des composants Fluent’interface utilisateur de base

Vous pouvez créer votre application Teams à partir de zéro à l’aide des composants de base Fluent’interface utilisateur suivants. Conçus aussi platement que possible, ces composants peuvent fonctionner dans différents cas d’utilisation, thèmes et tailles d’écran.

Les illustrations de cette page montrent l’apparence des composants Teams thèmes par défaut (clair) et foncés.

Kit d’interface utilisateur de Microsoft Teams

Basé sur Fluent’interfaceutilisateur, le kit Microsoft Teams’interface utilisateur inclut des composants et des modèles spécifiquement conçus pour créer des applications Teams. Dans le kit d’interface utilisateur, vous pouvez récupérer et insérer les composants répertoriés ici directement dans votre conception et voir d’autres exemples d’utilisation de chaque composant.

Alerte

Exemple de composant d’interface utilisateur d’alerte.

Bouton

L’exemple montre un composant d’interface utilisateur de bouton.

Exemple de composant d’interface utilisateur de lacrumb.

Carte

L’exemple montre un composant d’interface utilisateur de carte.

Exemple de composant d’interface utilisateur carrousel.

Case à cocher

L’exemple montre un composant d’interface utilisateur de case à cocher.

Mark

L’exemple montre un composant d’interface utilisateur de signet.

Menu contextuel

Exemple de composant d’interface utilisateur de menu contextuel.

Boîte de dialogue

Exemple de composant d’interface utilisateur de boîte de dialogue.

L’exemple montre un composant d’interface utilisateur de ladown.

Liste de groupes

Exemple de composant d’interface utilisateur de liste de groupes.

Exemple de composant d’interface utilisateur de lien hypertexte.

Input

Exemple de composant d’interface utilisateur d’entrée.

Paire clé/valeur

L’exemple montre un composant d’interface utilisateur de paire clé-valeur.

Paragraphe

Exemple de composant d’interface utilisateur de paragraphe.

S picker

L’exemple montre un composant d’interface utilisateur du s’il s’agit.

Pivot

Exemple de composant d’interface utilisateur pivot.

Indicateur de progression

L’exemple montre un composant d’interface utilisateur d’indicateur de progression.

Radio

Exemple de composant d’interface utilisateur radio.

Barre de défilement

L’exemple montre un composant d’interface utilisateur de barre de défilement.

L’exemple montre un composant d’interface utilisateur de zone de recherche.

Panneau latéral

Exemple de composant d’interface utilisateur de panneau latéral.

Étiquette d’état

L’exemple montre un composant d’interface utilisateur d’étiquette d’état.

Annonce

Exemple de composant d’interface utilisateur toast.

Bouton bascule

Remarque : dans Fluent’interface utilisateur, le basculement est un type de case à cocher.

Exemple de composant d’interface utilisateur bascule.

Info-bulle

Exemple de composant d’interface utilisateur d’une boîte à outils.

Autres ressources

Obtenez des exemples de code et des détails d’implémentation pour certains des composants répertoriés ici et dans Microsoft Teams kit d’interface utilisateur.