સ્ક્રીન-સ્થાનિક Overlay State

dialogs અને sheets ને OverlayRequest? તરીકે રજૂ કરો અને ScreenOverlayHost અથવા AnimatedScreenOverlayHost દ્વારા રેન્ડર કરો.

આગળ: Declarative Tabs Pages and Resolver પર પાછા જાઓ

એકમાત્ર overlay slot

overlay ને OverlayRequest? તરીકે મોડેલ કરો અને dismiss કરવા માટે તેને clear કરો.

Dialog અને sheet સપોર્ટ

વૈકલ્પિક payload data સાથે DialogRequest અને BottomSheetRequest નો ઉપયોગ કરો.

Back order નિયંત્રણ

back-scope widgets દ્વારા પહેલાં overlay dismiss કરો, પછી pages pop કરો.

Overlay Host પેટર્ન

overlay ને state માં રાખો અને overlayBuilder દ્વારા overlay UI બનાવો.

ઓવરલે સ્ટેટ નિયમ

એનિમેટેડ ઓવરલે હોસ્ટ

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,
  ),
);
મહત્વપૂર્ણ

જ્યારે overlay દેખાતું હોય, canPopTop વડે pop gestures રોકો જેથી iOS પર back-swipe અસંગતતા ટાળી શકાય.

પાછળ

પેજો અને રિઝોલ્વર

આગળ

ડેકલેરેટિવ ટૅબ્સ