Flutter BottomNavigationBar 等待异步函数

Question

我在 StatefulWidget 中有一个底部导航栏，以及一个包含 3 个选项的对话框：打开相机、画廊或取消。

这是我的代码： 导航栏

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

对话框

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

我想做这样的事情，我可以打开对话框，但它没有等到选项 selected

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

我怎样才能等待直到用户点击导航栏的选项 select？

提前致谢！

Answer 1

在您的 _selectImage 函数中，您可以等待对话框关闭以执行如下代码：

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

onValue可以用这个函数设置:

Navigator.pop(context, valueYouWantToReturn);

如果即使 onValue 为 null (Navigator.pop(context)) 也想执行一些代码，请删除条件

Flutter BottomNavigationBar 等待异步函数

Flutter BottomNavigationBar await async function

dialog

async-await

navigation-drawer

flutter