画面ローカルなオーバーレイ状態
OverlayRequest? を状態として持ち、ScreenOverlayHost / AnimatedScreenOverlayHost で描画します。
単一オーバーレイスロット
OverlayRequest? を null に戻すだけでクローズを表現できます。
Dialog / BottomSheet 対応
DialogRequest と BottomSheetRequest を同一パターンで扱えます。
戻る優先順位を固定
オーバーレイ閉じる -> ページpop の順を守ると挙動が安定します。
オーバーレイホストの基本形
overlayBuilder で要求に応じたUIを返し、可視性を状態で一元化します。
オーバーレイ状態ルール
AnimatedScreenOverlayHost
return AnimatedScreenOverlayHost(
overlay: _overlay,
onDismiss: _dismissOverlay,
overlayBuilder: (context, req, dismiss) => switch (req) {
DialogRequest(key: 'hello') => AlertDialog(
title: const Text('Hello'),
actions: [TextButton(onPressed: dismiss, child: const Text('Close'))],
),
_ => null,
},
child: DeclarativePagesNavigator(
pages: _pages,
buildPage: _buildPage,
onPopTop: _popTop,
canPopTop: () => _overlay == null,
),
);
重要
オーバーレイ表示中は canPopTop でジェスチャーpopを抑止 して、iOSの戻るスワイプとの競合を避けてください。