Я хотел создать 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);
},
);
}
Снимок экрана: снимок экрана
Обновление: в соответствии с ответом Сахара Ачарьи я использовал
if (index == 0) {
return StaggeredTile.fit(1);
}
return StaggeredTile.fit(2);
, и это что происходит: скриншот2