下面的代码可能看起来有点复杂,但基本上下面的函数使用 switch case 来根据导航栏的索引号返回正确的小部件。我面临的问题是,当脚手架的主体必须根据导航栏的索引号获得正确的页面时,它告诉我我不能拥有 Future <Widget>
的类型。
而不是一种 Widget 作为我的脚手架的主体。我预计会发生这种情况,但是我不知道如何添加 await 关键字,以便该类型是一个有效的小部件。谢谢你的帮助。附言。请查看评论,它告诉我想在下面的代码中调用该函数的位置。
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: ,
),
);
}
}
最佳答案
future 将不得不等待。在您的情况下,您在渲染过程中使用 future ,并且由于 future 位于小部件树的中间,因此当您等待 future 时该过程已经开始,您必须等待 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;
}
}
},
);
}
关于flutter - 如何将 Future<Widget> 作为 Widget 返回,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62674417/