Set text to match column width in flutter - dart

Question

I have an image and a text in a column.
I want the text container to expand to the column width, creating a black border with the text centered.
This is what i got now.
Code.
List<Container> getMediaItem(List<Media> mediaItems) {
List<Container> mediaContainers = [];
for (Media media in mediaItems) {
mediaContainers.add(
Container(
padding: EdgeInsets.only(left: 8, right: 8, bottom: 8),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
media.image,
Container(
color: Colors.black,
padding: EdgeInsets.only(top: 8, bottom: 8),
child: Text(media.title),
)
],
),
),
);
}
return mediaContainers;
}
If you know how to solve it please share.
Update:
The full code (I'm trying to make a nested scroll view to display a gallery of media items, like Netflix):
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Live Tree',
theme: ThemeData(
brightness: Brightness.dark,
),
home: Scaffold(
appBar: AppBar(
title: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Text("LiveTree"),
Icon(Icons.check_circle_outline),
],
),
),
body: HomePage(),
),
);
}
}
class HomePage extends StatefulWidget {
HomePage({Key key}) : super(key: key);
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
#override
Widget build(BuildContext context) {
List<Column> getMediaItem(List<Media> mediaItems) {
List<Column> mediaContainers = [];
for (Media media in mediaItems) {
mediaContainers.add(
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
media.image,
Container(
color: Colors.black,
padding: EdgeInsets.only(top: 8, bottom: 8),
child: Text(media.title),
)
],
),
);
}
return mediaContainers;
}
List<Widget> getCategoryRows(List<CategoryModel> categoryModels) {
List<Widget> categoryRows = [];
for (CategoryModel category in categoryModels) {
final mediaItemsForCategory = getMediaItem(category.media);
categoryRows.add(
ListView(scrollDirection: Axis.horizontal,
children: mediaItemsForCategory,
),
);
}
return categoryRows;
}
Widget gallerySection = Column(
mainAxisSize: MainAxisSize.min,
children: getCategoryRows(mockCategoryDataSet),
);
return Scaffold(
body: ListView(
children: <Widget>[
gallerySection,
],
),
);
}

Answer 1

Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
media.image,
Container(
color: Colors.black,
padding: EdgeInsets.only(top: 8, bottom: 8),
child: Text(media.title),
),
],
);
or
Column(
children: [
media.image,
Container(
color: Colors.black,
padding: EdgeInsets.only(top: 8, bottom: 8),
child: Center(
child: Text(media.title),
),
),
],
);