ボトムシートを作成する

ボトムシートは、画面の下部に固定されたセカンダリ コンテンツを表示します。

バージョンの互換性

この実装では、プロジェクトの minSDK を API レベル 21 以上に設定する必要があります。

依存関係

ボトムシートを実装する

ボトムシートを実装するには、ModalBottomSheet コンポーザブルを使用します。

シートを開く / 閉じる

シートを開いたり閉じたりするには、SheetState を使用します。

要点

  • content スロットを使用すると、ColumnScope を使用してシート コンテンツのコンポーザブルを一列にレイアウトできます。
  • rememberSheetState を使用して、sheetState パラメータで ModalBottomSheet に渡す SheetState のインスタンスを作成します。
  • SheetState は、現在のシートの状態に関連するプロパティだけでなく、show 関数と hide 関数へのアクセスを提供します。これらの関数は CoroutineScoperememberCoroutineScope など)を必要とし、UI イベントに応じて呼び出すことができます。

  • ボトムシートを非表示にするときは、コンポジションから ModalBottomSheet を削除してください。

結果

図 1. 標準のボトムシート(左)とモーダル ボトムシート(右)。

このガイドを含むコレクション

このガイドは、Android 開発の幅広い目標を網羅する、厳選されたクイックガイド コレクションの一部です。

コンポーズ可能な関数を使用して、マテリアル デザインのデザイン システムに基づいて美しい UI コンポーネントを簡単に作成する方法を学びます。

ご質問やフィードバックがある場合

よくある質問のページでクイックガイドをご覧になるか、お問い合わせフォームからご意見をお寄せください。