Flutter Card Color - flutter

Question

I want to make this card which i have divided into columns (Expanded widget), The problem i am facing is : i am unable to set color container (parent of right column) to full height, so only part of it shows colored background.
What I Have:
What I Want:
I tried Flutter Inspector tool and noticed that Container and its child Column are not getting full height (Even after typing mainAxisSize: MainAxisSize.max)
Instead of Using Expanded i also tried using FractionSized.. but not luck.
Code :
import 'package:flutter/material.dart';
class SubjectPage extends StatelessWidget {
final String dayStr;
SubjectPage(this.dayStr);
#override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.fromLTRB(20.0, 40.0, 20.0, 0),
child: Column(
children: <Widget>[
Card(
child: Row(
children: <Widget>[
// Column 1
Expanded(
flex: 7,
child: Padding(
padding: EdgeInsets.all(20.0),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
getTitle("UEC607"),
getSubName("Data Communication & Protocol"),
getVenue("E-204"),
],
),
),
),
// Column 2
// The Place where I am Stuck//
Expanded(
flex: 3,
child: Container(
color: Colors.blue,
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
getType("L"),
getTime("9:00"),
],
),
),
)
// COlumn 2 End
],
),
)
],
),
);
}
// Get Title Widget
Widget getTitle(String title) {
return Padding(
padding: EdgeInsets.only(bottom: 8.0),
child: Text(title),
);
}
// Get Subject Name
Widget getSubName(String subName) {
return Padding(
padding: EdgeInsets.only(bottom: 25.0),
child: Text(subName),
);
}
// Get Venue Name
Widget getVenue(String venue) {
return Padding(
padding: EdgeInsets.only(bottom: 0.0),
child: Text(venue),
);
}
Widget getType(String type) {
return Padding(
padding: EdgeInsets.only(bottom: 10.0),
child: Text(type),
);
}
Color getColor(String type) {
if (type == "L") {
return Color(0xff74B1E9);
}
}
Widget getTime(String time) {
return Text(time);
}
}

Answer 1

Set the container height
Expanded(
flex: 3,
child: Container(
height: double.infinity,
color: Colors.blue,
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
getType("L"),
getTime("9:00"),
],
),
),
)

Answer 2

For me it helps to make sure which Widget should be using a fixed space / size and which should expand to fit a space / size
Then I build the layout of the widget using Column and Row (this makes it easy to prepair and decide where to wrap widgets in a Expanded or Flexible widget)
But here is the short example:
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
centerTitle: true,
title: Text('Stackoverflow'),
),
body: Container(
margin: EdgeInsets.all(10),
width: double.infinity,
height: 100,
child: Row(
children: <Widget>[
// Texts
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
// UEC607 & Digital communication text
Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Text(
'UEC607',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Colors.grey
),
),
],
),
SizedBox(
height: 5,
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Text(
'Digital communication',
style: TextStyle(
fontSize: 20,
color: Colors.black
),
),
],
)
],
),
Expanded(
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
Text(
'E-206',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Colors.black
),
),
],
),
)
],
),
),
// Card
Container(
width: 90,
color: Colors.lightBlue.withOpacity(.8),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'L',
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
color: Colors.white
),
),
SizedBox(
height: 5,
),
Text(
'09:00',
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
color: Colors.white
),
),
],
),
)
],
),
),
);
}
And it will look like this:

Answer 3

Use a FittedBox for wrapping the blue container
Expanded(
flex: 2,
child: FittedBox(
child: Container(
color: Colors.blue,
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
getType("L"),
getTime("9:00"),
],
),
),
),
)

Answer 4

You should put your Row widget inside an IntrinsicHeight widget and set crossAxisAlignment property of your Row equal to CrossAxisAlignment.stretch. It will solve your problem.
IntrinsicHeight(
child: Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[]
),
)