我想构建一个StaggeredGridView,在第0个索引处带有横幅视频,每行2张卡片。但是视频没有填充屏幕宽度,因为每一行的高度都相同。
这是我在做什么。
static final videoPlayerController = VideoPlayerController.network(
"https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4");
static final chewieController = ChewieController(
videoPlayerController: videoPlayerController,
aspectRatio: 3 / 2,
autoPlay: true,
looping: true,
allowMuting: true,
allowFullScreen: false,);
final playerWidget = Chewie(
controller: chewieController,);
构建小部件的代码:
Widget buildStaggeredListing(BuildContext context) {
return StaggeredGridView.countBuilder(
crossAxisCount: 2,
crossAxisSpacing: 4.0,
itemCount: 10,
itemBuilder: (BuildContext buildContext, int index) {
if (index == 0) {
return playerWidget;
}
return Card(
child: Padding(
padding: EdgeInsets.all(16.0),
child: Text(
index.toString(),
style: TextStyle(fontSize: 22.0),
),
),
);
},
staggeredTileBuilder: (int index) {
if (index == 0) {
return StaggeredTile.count(2, 1);
}
return StaggeredTile.count(1, 1);
},
);
}
截图:screenshot
更新:根据萨加尔·阿查里亚的回答,我用
if (index == 0) {
return StaggeredTile.fit(1);
}
return StaggeredTile.fit(2);
这就是正在发生的事情:screenshot2
最佳答案
只需检查此代码是否有效:
staggeredTileBuilder: (int index) {
if (index == 0) {
return StaggeredTile.fit(2);
}
return StaggeredTile.count(1,1);
},
关于flutter - StaggeredGridView的动态高度在Flutter项目中不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/60410348/