如何在 Flutter 中将 CachedNetworkImageProvider 的列表方法调用到轮播专业版中

Question

我想在旋转木马İn Flutter内使用CachedNetworkImageProvider列表中的图像。

但是我得到了这个错误类型

你能在这个问题上提供帮助吗?

编辑

Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.black,
appBar: AppBar(
backgroundColor: Colors.black,
title: Text("Home"),
),
body: ListView(
children: [
SizedBox(
height: 200.0,
width: double.infinity,
child: Carousel(
images: [
//CachedNetworkImageProvider('https://cdn-images-1.medium.com/max/2000/1*GqdzzfB_BHorv7V2NV7Jgg.jpeg'),
//CachedNetworkImageProvider('https://cdn-images-1.medium.com/max/2000/1*wnIEgP1gNMrK5gZU7QS0-A.jpeg'),
getOtherUserPhoto(),
],
),
),
],
),
);

}

Future<List<CachedNetworkImageProvider>> getOtherUserPhoto() async {
try{
List<CachedNetworkImageProvider> _userPhotosWidgetList = [];
final _userModel = Provider.of<OtherUserViewModel>(context, listen: false);
List<String> _userPhotosList = await _userModel.getOtherUserPhoto();
for(int i = 0; i < _userPhotosList.length; i++){
_userPhotosWidgetList.add(CachedNetworkImageProvider(_userPhotosList[i].toString()));
}
return _userPhotosWidgetList;
}catch(e){
print("Exception cause : " + e.toString());
return null;
}

}

错误日志:

======== 例外被小部件库 =======================================================下面的_TypeError在构建Carousel(dirty, state: CarouselState#3294f)时抛出:类型'Future'不是'Widget'类型的子类型

Answer 1

你不能直接给一个列表分配一个future，你必须等待一个响应，所以我们将使用这样的FutureBuilder:

SizedBox(
height: 200.0,
width: double.infinity,
child: FutureBuilder<List<Widget>>(
future: getOtherUserPhoto(),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return LinearProgressIndicator();
}
return Carousel(images: snapshot.data);
}),
),

，你需要改变你的函数类型，因为CachedNetworkImageProvider不是一个小部件，而是使用CachedNetworkImage:

Future<List<Widget>> getOtherUserPhoto() async {
List<CachedNetworkImage> _userPhotosWidgetList = [];
final _userModel = Provider.of<OtherUserViewModel>(context, listen: false);
List<String> _userPhotosList = await _userModel.getOtherUserPhoto();
for(int i = 0; i < _userPhotosList.length; i++){
_userPhotosWidgetList.add(CachedNetworkImage(imageUrl: _userPhotosList[i].toString()));
}
return _userPhotosWidgetList;
}

Answer 2

从getOtherUserPhoto()符号中删除Future