I am trying to create container widget with full width and fixed height. My text keeps overflowing to the right side instead of being in a scroll. What am I doing wrong? The parent widget is Positioned
in stack.
A RenderFlex overflowed by 176 pixels on the right.
@override
Widget build(BuildContext context) {
return Material(
child: Container(
width: MediaQuery.of(context).size.width,
height: 150,
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.3),
spreadRadius: 5,
blurRadius: 7,
offset: const Offset(0, 3), // changes position of shadow
),
],
image: const DecorationImage(
image: AssetImage("assets/images/texture_big.jpg"),
fit: BoxFit.cover)),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
children: [
if (image)
Container(
width: 80,
height: 80,
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage('$imageUrl'),
fit: BoxFit.cover)),
),
SingleChildScrollView(
child: Text('daw dadwa dadadada dawdadawod wauhjdwaijh awujid jiuoawdd ada',
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16,
color: Colors.black,
fontFamily: 'Montserrat')),
),
const SizedBox(height: 8.0),
],
)
],
),
],
)),
);
}
CodePudding user response:
I think that, while you using a stack
widget, the text widget doesn't have a parent widget with width to inherit it,
please can you try to wrap the SignleChildScrollView
with Container Widget and give it a width of MediaQuery.of(context).size.width