Bildschirmlokaler Overlay-Zustand

Stelle Dialoge und Sheets mit OverlayRequest? dar und rendere sie über ScreenOverlayHost oder AnimatedScreenOverlayHost.

Weiter: Deklarative Tabs Zurück zu Seiten und Resolver

Ein einzelner Overlay-Slot

Modelliere das Overlay als OverlayRequest? und lösche es, um es zu schließen.

Unterstützung für Dialoge und Sheets

Verwende DialogRequest und BottomSheetRequest mit optionalen Payload-Daten.

Kontrolle der Zurück-Reihenfolge

Schließe zuerst das Overlay und poppe dann Seiten über Back-Scope-Widgets.

Overlay-Host-Muster

Halte das Overlay im Zustand und baue die Overlay-UI über overlayBuilder.

Regel für den Overlay-Zustand

Animierter Overlay-Host

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,
  ),
);

Wichtig

Wenn das Overlay sichtbar ist, blockiere Pop-Gesten mit canPopTop um Inkonsistenzen beim Zurück-Wischen auf iOS zu vermeiden.

Zurück

Seiten als Daten

Weiter

Deklarative Tabs