Card width match with parent : flutter - dart

Question

I am new in Flutter so I want to know that how can I set a width to match parent layout width
new Scaffold(
body: new Container(
decoration: new BoxDecoration(color: AppColors.hoBlue),
child: Padding(
padding: EdgeInsets.all(20.0),
child: new Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Stack(
children: <Widget>[
Row(
children: <Widget>[
Expanded(
child: Padding(
padding: EdgeInsets.all(20.0),
child: Card(
child: Padding(
padding: EdgeInsets.fromLTRB(20, 0.0, 20.0,20.0),
child: Column(
children: <Widget>[
Card(
elevation: 10.0,
child: Padding(
padding: EdgeInsets.all(20.0),
child:
Text("Sign Up Here"),
),
),
TextField(
decoration: InputDecoration(
labelText: "Email",
hintText: "example#mail.com",
),
autofocus: true,
),
TextField(
decoration: InputDecoration(
labelText: "Password",
),
autofocus: true,
),
SizedBox(
width: double.infinity,
// height: double.infinity,
child: new RaisedButton(
color: AppColors.hoBlue,
child: Text(
"Sign In",
style: TextStyle(
color: Colors.white,
fontFamily: 'Raleway',
fontSize: 22.0,
),
),
onPressed: () => print('Sign In'),
),
)
],
)),
),
),
),
],
)
],
),
],
)),
),
));
Result From Code Above
i need help to make card stack with parent like
Result I want
i already try with using stack but the result card parent card overlaping the first card.
I know about little bit on Expanded tag but Expanded expand view to both direction, i dont know how to do it. Help me if you know, Thanks in Advance.

Answer 1

You don't need Stack to get that view - it can be done using Column & Material widget.
return Scaffold(
body: new Container(
decoration: new BoxDecoration(color: Colors.blue),
child: new Center(
child: MergeSemantics(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Card(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Material(
elevation: 24.0,
child: Padding(
padding: const EdgeInsets.all(20.0),
child: Text("Sign Up Here"),
),
),
Padding(
padding: EdgeInsets.fromLTRB(20, 10.0, 20.0, 20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
TextField(
decoration: InputDecoration(
labelText: "Email",
hintText: "example#mail.com",
),
autofocus: true,
),
TextField(
decoration: InputDecoration(
labelText: "Password",
),
autofocus: true,
),
SizedBox(
width: double.infinity,
// height: double.infinity,
child: new RaisedButton(
color: Colors.blue,
child: Text(
"Sign In",
style: TextStyle(
color: Colors.white,
fontFamily: 'Raleway',
fontSize: 22.0,
),
),
onPressed: () => print('Sign In'),
),
)
],
)),
],
),
),
],
),
),
)),
));
Output:

Answer 2

If you want to resize or alter the card view Then just put Card inside the Container view then adjust your container size.
This link will help you :https://stackoverflow.com/a/50017126/7418129

Answer 3

Just Put Card in Container
Padding(
padding: EdgeInsets.all(20),
child: Container(
height: 50,
width: double.infinity,
child: Card(
child: Align(
alignment: Alignment.centerLeft,
child: Text("Edit Profile")),
),
),
)

Answer 4

Use Material widget that will use as same as card do...and take always a full width and height as same as its parent class...