showModalBottomSheet stacking when using a Switch

Question

I'm trying to show a privacy policy banner on the login screen of my app. Whenever I click the switch another ModalBottomSheet stacks on top of the other one though.

I've tried to extract the button in an seperated Statefullwidget no change.

Any suggestions, hints or ideas?

    var setting = Provider.of<SettingProvider>(context);
    WidgetsBinding.instance!.addPostFrameCallback((timeStamp) {
      if (setting.data == false) {
        showModalBottomSheet(
            barrierColor: Colors.blueGrey.withOpacity(0.1),
            isDismissible: false,
            context: context,
            builder: (BuildContext context) {
              return Container(
                padding: EdgeInsets.fromLTRB(30, 10, 30, 0),
                height: 300,
                child: ListView(
                  children: [
                    Center(
                      child: Text(
                        'Datenschutz',
                        style: TextStyle(
                          fontFamily: 'Caveat',
                          fontSize: 25,
                        ),
                      ),
                    ),
                    Text(
                      'Description.',
                      style: TextStyle(fontSize: 10),
                      textAlign: TextAlign.justify,
                    ),
                    SwitchListTile(
                        title: Text(
                          'I agree.',
                          style: TextStyle(fontSize: 10),
                        ),
                        value: setting.initdata,
                        onChanged: (bool value) {
                          setting.changeInitData(value);
                        }),
                    SizedBox(
                      height: 10,
                    ),
                    ElevatedButton(
                        onPressed: () {
                          if (setting.initdata == true) {
                            setting.changeData(setting.initdata);
                            Navigator.pop(context, 'Sichern');
                          } else {
                            Fluttertoast.showToast(
                                msg:
                                    'Error.',
                                gravity: ToastGravity.TOP);
                          }
                        },
                        child: Text('Sichern')),
                  ],
                ),
              );
            });
      }
    });````

score 0 · Accepted Answer · answered Aug 13 '21 at 18:37

I just found one way to solve it. Might not be the most elegant way but it works.

In the button to save privacy settings I used Navigator.of(context).pushReplacementNamed(LogInScreen.routeName); instead of Navigator.pop.

The modals are still stacking when pressing the Switch, but the user doesn't have to click through multiple modals..

showModalBottomSheet stacking when using a Switch

1 Answers1