Flutter BottomNavigationBar await async function

Question

I have a bottom navigation bar in a StatefulWidget, and a dialog with 3 options open camera, gallery or cancel.

Here is my code: navigation bar

Widget build(BuildContext context) {
    return new Scaffold(
      body: PageView(
        children: [
          Container(
            color: Colors.white,child: HomePage(),),
          Container(
            color: Colors.white,child: AddPost(),),
        ],
        controller: pageController,
        physics: NeverScrollableScrollPhysics(),
        onPageChanged: onPageChanged,
      ),
      bottomNavigationBar: CupertinoTabBar(
        backgroundColor: Colors.white,
        items: <BottomNavigationBarItem>[
          BottomNavigationBarItem(
              icon: Icon(Icons.home,
              title: Container(height: 0.0),
              backgroundColor: Colors.white),
          BottomNavigationBarItem(
              icon: Icon(Icons.add_circle,
              title: Container(height: 0.0),
          )
        ],
        onTap: navigationTapped,
        currentIndex: _page,
      ),
    );
  }

dialog

  File file;
  _selectImage( ) async {
    return showDialog<Null>(
      context: context,
      barrierDismissible: false, // user must tap button!
      builder: (BuildContext context) {
        return SimpleDialog(
          title: const Text('Create a Post'),
          children: <Widget>[
            SimpleDialogOption(
                child: const Text('Take a photo'),
                onPressed: () async {
                  Navigator.pop(context);
                  File imageFile =
                      await ImagePicker.pickImage(source: ImageSource.camera, maxWidth: 1920, maxHeight: 1200, imageQuality: 80);
                  setState(() {
                    file = imageFile;
                  });
                }),
            SimpleDialogOption(
                child: const Text('Choose from Gallery'),
                onPressed: () async {
                  Navigator.of(context).pop();
                  File imageFile =
                      await ImagePicker.pickImage(source: ImageSource.gallery, maxWidth: 1920, maxHeight: 1200, imageQuality: 80);
                  setState(() {
                    file = imageFile;
                  });
                }),
            SimpleDialogOption(
              child: const Text("Cancel"),
              onPressed: () {
                Navigator.pop(context);
              },
            )
          ],
        );
      },
    );
  }

I want to do something like this, i can open the dialog but it didn't wait til option is selected

void navigationTapped(int page) async{
    if(page != 1){
      pageController.jumpToPage(page);
    }else{
      await _selectImage(); //opens dialog
    }
    //Handle button tap
  }

How can i do to await until option is select by the user on tap the navigation bar?

Thanks in advance!

Answer 1

In your _selectImage function, you can wait the dialog to be closed to do some code like this :

await showDialog(
  context: context,
  barrierDismissible: false, // user must tap button!
  builder: (BuildContext context) {
    return SimpleDialog(
      title: const Text('Create a Post'),
      children: <Widget>[
        SimpleDialogOption(
          child: const Text('Take a photo'),
          onPressed: () async {
            Navigator.pop(context);
            File imageFile = await ImagePicker.pickImage(source: ImageSource.camera, maxWidth: 1920, maxHeight: 1200, imageQuality: 80);
            setState(() {
              file = imageFile;
            });
          }),
        SimpleDialogOption(
          child: const Text('Choose from Gallery'),
          onPressed: () async {
            Navigator.of(context).pop();
            File imageFile = await ImagePicker.pickImage(source: ImageSource.gallery, maxWidth: 1920, maxHeight: 1200, imageQuality: 80);
            setState(() {
              file = imageFile;
            });
          }),
        SimpleDialogOption(
          child: const Text("Cancel"),
          onPressed: () {
            Navigator.pop(context);
          },
        )
      ],
    );
  },
).then((onValue) {
  if (onValue != null) {
    /// Code you want to do
  }
});

The onValue can be set using this function :

Navigator.pop(context, valueYouWantToReturn);

If you want to do some code even if onValue is null (Navigator.pop(context)), delete the condition