如何将 Future<Widget> 转换为 Widget

Question

如何将 Future<Widget> 转换为 Widget

3

下面的代码可能看起来有点复杂，但基本上这个函数使用了switch case来根据导航栏的索引号返回正确的小部件。我遇到的问题是，当scaffold的主体根据导航栏的索引号获取正确的页面时，它告诉我不能将类型Future<Widget>作为scaffold的主体，而不是Widget类型。我预料到会出现这种情况，但我不知道如何添加await关键字，以使类型成为有效的widget。感谢您的帮助。附注：请查看注释，其中说明了我想在以下代码中调用函数的位置。

Future<Widget> getCorrespondingPage(int index) async {
    bool isFromGoogleSignIn;
    String displayName = await InformationFinder().getUserName(_auth);
    String provider = await ProviderFinder().getProvider(_auth);
    String profilePicture = await InformationFinder().getProfilePicture(_auth);
    if (provider == 'Google') {
      setState(() {
        isFromGoogleSignIn = true;
      });
    } else {
      setState(() {
        isFromGoogleSignIn = false;
      });
    }
    switch (index) {
      case 0:
        return SideBarLayoutStateful(
          app: SmartVetScreen(),
          isFromGoogleSignIn: isFromGoogleSignIn,
          profilePicture: profilePicture,
          displayName: displayName,
        );
        break;
      case 1:
        return SideBarLayoutStateful(
          app: SmartReminderScreen(),
          isFromGoogleSignIn: isFromGoogleSignIn,
          profilePicture: profilePicture,
          displayName: displayName,
        );
      default:
        return null;
    }
  }

这是我的已完成的有状态控件:

class _NavigationBarScreenState extends State<NavigationBarScreen> {
  int currentIndex = 0;
//THIS IS WHERE THE ABOVE FUNCTION WAS CREATED
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        bottomNavigationBar: BottomNavigationBar(
          currentIndex: currentIndex,
          type: BottomNavigationBarType.shifting,
          iconSize: 27.0,
          elevation: 10.0,
          selectedFontSize: 18.0,
          unselectedFontSize: 15.0,
          items: [
            BottomNavigationBarItem(
              icon: Icon(FontAwesomeIcons.stethoscope),
              title: Text('Smart Vet'),
              backgroundColor: Colors.green.shade200,
            ),
            BottomNavigationBarItem(
              icon: Icon(FontAwesomeIcons.bell),
              title: Text('Smart Remind'),
              backgroundColor: Colors.purple.shade100,
            ),
          ],
          onTap: (index) {
            setState(() {
              currentIndex = index;
            });
          },
        ),
//THIS IS WHERE I NEED TO GET BACK THE WIDGET FROM THE getCorrespondingPage() method
        body: ,
      ),
    );
  }
}

- XtremeDevX

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Frenco · Accepted Answer

需要等待future。在你的情况下，你正在渲染过程中使用futures，在等待future时由于future在widget树的中间，所以必须使用一些特殊方法从widget树中等待future。可以使用FutureBuilder来实现。

将数据获取和小部件渲染分开，并使用FutureBuilder等待Future。

Future<Map<String, String>> getData() async {
  String displayName = await InformationFinder().getUserName(_auth);
  String provider = await ProviderFinder().getProvider(_auth);
  String profilePicture = await InformationFinder().getProfilePicture(_auth);

  return {
    'displayName': displayName,
    'provider': provider,
    'profilePicture': profilePicture
  };
}

Widget getCorrespondingPage(int index) {
  return FutureBuilder<Map<String, String>>(
    future: getData,
    builder: (context, snapshot) {
      if (snapshot.hasData) {
        final displayName = snapshot.data['displayName'];
        final provider = snapshot.data['provider'];
        final profilePicture = snapshot.data['profilePicture'];

        bool isFromGoogleSignIn = provider == 'google';
        switch (index) {
          case 0:
            return SideBarLayoutStateful(
              app: SmartVetScreen(),
              isFromGoogleSignIn: isFromGoogleSignIn,
              profilePicture: profilePicture,
              displayName: displayName,
            );
            break;
          case 1:
            return SideBarLayoutStateful(
              app: SmartReminderScreen(),
              isFromGoogleSignIn: isFromGoogleSignIn,
              profilePicture: profilePicture,
              displayName: displayName,
            );
          default:
            return null;
        }
      }
    },
  );
}