Ad
Flutter & AlertDialog : How To Stretch A Container So That It Has The Same Width With The AlertDialog Box?
I have been trying to make a button in AlertDialog
box in Flutter. But I cannot find a way to stretch the button container. Please check my code and see the example picture below.
AlertDialog(
title: Center(child: Text("Picture")),
content: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
width: width,
//height: height,
child: FadeInImage.memoryNetwork(
placeholder: kTransparentImage,
image: image.url,
),
),
SizedBox(
height: 10,
),
InkWell(
onTap: () {
Navigator.pop(context);
},
child: Container(
alignment: Alignment.center,
height: 50,
width: width,
color: primaryColor,
child: Text(
'Okay',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold),
),
),
),
],
),
);
Please help me in this. I am looking forward to hearing your opinion. Thank you in advance.
Ad
Answer
The AlertDialog
has a default content padding
of 24
logical pixels to the right, left and bottom of the AlertDialog
to separate the content from the other edges of the dialog..
To Make the Button
fit the AlertDialog
width, you will need to give the AlertDialog
a padding
of zero
and apply paddings
to others widgets except the Button
.
I added an example using your code:
AlertDialog(
// change the default padding to zero
contentPadding: EdgeInsets.zero,
title: Center(child: Text("Picture")),
content: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
// wrap your container with a padding widget
Padding(
padding: const EdgeInsets.all(20.0), // give a preferred padding
child: Container(
width: width,
//height: height,
placeholder: kTransparentImage,
image: image.url,
),
),
),
SizedBox(
height: 10,
),
InkWell(
onTap: () {
Navigator.pop(context);
},
child: Container(
alignment: Alignment.center,
height: 50,
width: width,
color: primaryColor,
child: Text(
'Okay',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold),
),
),
),
],
),
);
Ad
source: stackoverflow.com
Related Questions
- → How do you create a 12 or 24 mnemonics code for multiple cryptocurrencies (ETH, BTC and so on..)
- → Flutter: input text field don't work properly in a simple example..... where am I wrong?
- → Can I customize the code formatting of Dart code in Atom?
- → Is it possible to develop iOS apps with Flutter on a Linux virtual machine?
- → Display SnackBar in Flutter
- → JSON ObjectMapper in Flutter
- → Material flutter app source code
- → TabBarSelection No such method error
- → How do I set the animation color of a LinearProgressIndicator?
- → Add different routes/screens to Flutter app
- → Is there a way to get the size of an existing widget?
- → How to share a file using flutter
- → Is there an easy way to find particular text built from RichText in a Flutter test?
Ad