Créer une bottom sheet

Une bottom sheet affiche du contenu secondaire, ancré en bas de l'écran.

Compatibilité des versions

Cette implémentation nécessite que la version minimale du SDK de votre projet soit définie sur le niveau d'API 21 ou supérieur.

Dépendances

Implémenter une bottom sheet

Pour implémenter une bottom sheet, utilisez le composable ModalBottomSheet:

Développer et réduire la feuille

Pour développer et réduire la feuille, utilisez SheetState:

Points essentiels

  • Utilisez l'emplacement content, qui utilise ColumnScope pour mettre en page les composables de contenu d'une bottom sheet dans une colonne.
  • Utilisez rememberSheetState pour créer une instance de SheetState que vous transmettez à ModalBottomSheet avec le paramètre sheetState.
  • SheetState fournit un accès aux fonctions show et hide, ainsi qu'aux propriétés liées à l'état actuel de l'élément sheet. Ces fonctions nécessitent de définir leur CoroutineScope (par exemple, rememberCoroutineScope) et peuvent être appelées en réponse à des événements d'interface utilisateur.

  • Veillez à supprimer ModalBottomSheet de la composition lorsque vous masquez la bottom sheet.

Résultats

Figure 1 Une bottom sheet standard (à gauche) et une bottom sheet modale (à droite).

Collections contenant ce guide

Ce guide fait partie de ces collections de guides rapides sélectionnées qui couvrent des objectifs de développement Android plus larges:

Découvrez comment les fonctions composables peuvent vous permettre de créer facilement de beaux composants d'interface utilisateur basés sur le système de conception Material Design.

Vous avez des questions ou des commentaires ?

Consultez notre page des questions fréquentes et découvrez les guides rapides, ou contactez-nous pour nous faire part de vos commentaires.