Is there a way to include Multiple Children inside a Container? - flutter

Question

This is full code:
class Application extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Scaffold(
body: new Container(
color: Color(0xff258DED),
height: 400.0,
alignment: Alignment.center,
child: new Container(
height: 200.0,
width: 200.0,
decoration: new BoxDecoration(
image: DecorationImage(
image: new AssetImage('assets/logo.png'),
fit: BoxFit.fill
),
shape: BoxShape.circle
),
),
child: new Container(
child: new Text('Welcome to Prime Message',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Aleo',
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 25.0,
color: Colors.white
),
),
),
),
),
);
}
}
I tried to add a Container on top and then added two children inside it. First child works fine, but second child giving me error like "the argument for the named parameter 'child' was already specified".

Answer 1

If you try to put more than one child in a container, you want to look as Row() or Column() class for linear ones. Stack() is used if you want to have floating children on top of each other.
Eg:
class Application extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Scaffold(
body: new Container(
color: Color(0xff258DED),
height: 400.0,
alignment: Alignment.center,
child: new Column(
children: [
new Container(
height: 200.0,
width: 200.0,
decoration: new BoxDecoration(
image: DecorationImage(
image: new AssetImage('assets/logo.png'),
fit: BoxFit.fill
),
shape: BoxShape.circle
),
),
new Container(
child: new Text('Welcome to Prime Message',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Aleo',
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 25.0,
color: Colors.white
),
),
),
],
),
),
),
);
}
}

Answer 2

Container is a Single-child layout widget. But it can have multiple children by using a Multi-child layout widget as its child.

Answer 3

In the container can be only child.
You have to use Column widget and add Container widgets as children if you want them position vertically.
#override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Scaffold(
body: new Container(
color: Color(0xff258DED),
height: 400.0,
alignment: Alignment.center,
child: Column(
children: <Widget>[
Container(
height: 200.0,
width: 200.0,
decoration: new BoxDecoration(
image: DecorationImage(
image: new AssetImage('assets/logo.png'),
fit: BoxFit.fill
),
shape: BoxShape.circle
),
),
Container(
child:Text('Welcome to Prime Message',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Aleo',
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 25.0,
color: Colors.white
),
),
),
],
),
),
),
);
}
tip #1 You don't have to use 'new' word to create object.
tip #2 Read about Column, Row and Stack on flutter.dev

Answer 4

Please check below code:-
#override
Widget build(BuildContext mContext) {
return MaterialApp(
home: Scaffold(
body: Container(
color: Color(0xff258DED),
height: 400.0,
alignment: Alignment.center,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
height: 200.0,
width: 200.0,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/logo.png'),
fit: BoxFit.fill
),
shape: BoxShape.circle
),
),
Container(
child: Text('Welcome to Prime Message',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Aleo',
fontStyle: FontStyle.normal,
fontWeight: FontWeight.bold,
fontSize: 25.0,
color: Colors.white
),
),
),
],
),
),
),
);
}