Drawer

コンテンツに合うモーダルシート、またはビューポート比率でスワイプできるドロワーを論理方向の各辺から表示します。

主なプロパティ

上端と下端のドロワーはデフォルトでコンテンツの高さに合い、最大でビューポート全体まで広がります。ビューポート比率の固定サイズには snapPoints を 1 つ、ドラッグスナップには複数指定してください。デフォルトの TRDrawerDragBehavior.surface は、ヘッダーとコンテンツの全体でシート移動と登録済みコンテンツのスクロール領域を連携させます。コンテンツが専用のスクロール領域を持つ場合は handleOnly を選んでください。この場合、表示中のハンドルだけがドロワーを動かし、コンテンツ上で始まったジェスチャーはそのスクロール領域に残ります。showDragHandle を false にすると、コンテンツのスクロールを保ったままハンドルとシートのドラッグを無効にします。開始側と終了側のドロワーにはハンドルがないため、サーフェス全体での水平方向ドラッグを維持します。ドロワーのサーフェスはビューポートの端まで広がり、接する可能性があるシステムの安全領域を保護します。

インストール

パッケージを追加し、公開ライブラリをインポートしてください。

flutter pub add tinyrack_ui

import 'package:tinyrack_ui/tinyrack_ui.dart';

プレイグラウンド

使用方法

import 'package:material_ui/material_ui.dart';
import 'package:tinyrack_ui/tinyrack_ui.dart';

showTRDrawer<void>(
  context: context,
  builder: (_) => const TRDrawer(
    maxExtent: 0.7,
    content: Text('Settings'),
  ),
)

API