I have a Container
widget inside a Wrap
widget, and I want the Container
to have the maximum width inside the Wrap
, but when I use width: double.infinity
for the width of the Container
, it throws an error. How can I achieve my target? The code is below:
Container(
width: 150,
color: Colors.grey.shade300,
child: Wrap(
direction: Axis.vertical,
children: [
Text("Hi there!"),
Text("This is a very long long string to show!"),
Container(
color: Colors.teal,
height: 5,
width: double.infinity,
),
Text("The end."),
],
),
),
CodePudding user response:
Use a row to get full width
Container(
width: 150,
color: Colors.grey.shade300,
child: Wrap(
direction: Axis.vertical,
children: [
Text("Hi there!"),
Text("This is a very long long string to show!"),
Row(
children: [
Container(
color: Colors.teal,
height: 5,
),
]),
Text("The end."),
],
),
),
CodePudding user response:
You've define the top level width, To have the same width, you can just put it inside the container instead of adding widgets. like
Container(
width: 150, //from here
color: Colors.grey.shade300,
child: Wrap(
direction: Axis.vertical,
children: [
Text("Hi there!"),
Text("This is a very long long string to show!"),
Container(
color: Colors.teal,
height: 5,
width: 150, //to here
),
Text("The end."),
],
),
),