Afficher un SnackBar au-dessus de la feuille de fond modale

Avez-vous essayé de définir la propriété de comportement sur flottant?

SnackBar(
  behavior: SnackBarBehavior.floating

Cela devrait résoudre le problème

Utilisez la propriété de comportement du snack.

SnackBar(
    behavior: SnackBarBehavior.floating,)

Si vous souhaitez utiliser un package tiers, vous pouvez facilement le faire avec GetX .

pubspec.yaml simplement le package dans votre fichier pubspec.yaml :

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Snackbar above Bottom Modal Sheet'),
      ),
      body: SafeArea(
        child: Center(
          child: RaisedButton(
            child: Text('Open Modal Sheet'),
            onPressed: () {
              // Bottom Modal Sheet
              Get.bottomSheet(
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text('My bottom modal sheet'),
                    RaisedButton(
                      child: Text('Show SnackBar'),
                      onPressed: () {
                        // Snackbar
                        Get.snackbar(
                          'Hey',
                          'I am a snackbar',
                          snackPosition: SnackPosition.BOTTOM,
                          backgroundColor: Colors.red,
                        );
                      },
                    ),
                  ],
                ),
                backgroundColor: Colors.green,
              );
            },
          ),
        ),
      ),
    );
  }
}

Changez votre MaterialApp en GetMaterialApp .

GetMaterialApp est nécessaire pour les itinéraires, les barres-collations, l'internationalisation, les bottomSheets, les dialogues et les API de haut niveau liés aux itinéraires et à l'absence de contexte.

Et utilisez Get.bottomSheet() et Get.snackbar() . Vous avez un tas de propriétés pour personnaliser les deux méthodes. Si un BottomModalSheet est ouvert et que vous créez un Snackbar, il s'affiche automatiquement au-dessus de la feuille.

Exemple simple:

dependencies:
  get: ^3.17.0

Vous devrez utiliser GlobalKey<ScaffoldState> pour afficher le Snackbar dans l'échafaudage souhaité, pour cela, vous pouvez ajouter Scaffold dans votre showModalBottomSheet comme ci-dessous snip;

Définissez votre GlobalKey dans votre classe de widget Statefull ou Stateless

                showModalBottomSheet(
                  context: context,
                  builder: (_) => Scaffold(
                      extendBody: false,
                      key: _modelScaffoldKey,
                      resizeToAvoidBottomInset: true,
                      body: FlatButton(
                        child: Text("Snackbar"),
                        onPressed: () {
                          _modelScaffoldKey.currentState.showSnackBar(SnackBar(
                            content: Text("Snackbar"),
                          ));
                        },
                      )),
                );

Et sur le button , vous pouvez avoir;

final GlobalKey<ScaffoldState> _modelScaffoldKey = GlobalKey<ScaffoldState>();

DartPad

Essayez de définir une marge pour le Snackbar fonction de la hauteur des BottomSheets :

SnackBar(behavior: SnackBarBehavior.floating, margin: EdgeInsets.fromLTRB(0, 0, 0, 500),)