SizedBox.expand
- Flutter course
- Beginner
- Lesson 43/99
- 4 min
Learn to fill the parent with SizedBox.expand.
SizedBox.expand
SizedBox.expand produces a SizedBox that fills all the size coming from its parent. Its width and height parameters accept double.infinity. This is used to make a widget as wide or tall as its parent.
SizedBox.expand(
child: Container(color: Colors.blue),
)
// Equivalent:
SizedBox(
width: double.infinity,
height: double.infinity,
child: Container(color: Colors.blue),
)double.infinity
double.infinity is a special value in Flutter meaning "as large as possible". SizedBox(width: double.infinity) makes the child as wide as the parent. Expanded and SizedBox.expand use this value. Inside Column and Row, the Expanded widget does a similar effect along the main axis.
Column(
children: [
SizedBox(
width: double.infinity,
child: Text('Tam genişlik'),
),
SizedBox.expand(
child: Text('Tam boyut'),
),
],
)Practice Print SizedBox.expand info
In main, print two lines with print: expand doldur and infinity sonsuz.
Starter code
void main() {
// iki satır yazdır:
// expand doldur
// infinity sonsuz
}Sample solution
void main() {
print('expand doldur');
print('infinity sonsuz');
}Expected output
expand doldur infinity sonsuz
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 What does SizedBox.expand do?
- Completely fills the parent's size Correct answer
- Keeps the child centered
- Hides the child
- Shrinks the child
Explanation: SizedBox.expand sets width and height to double.infinity and completely fills the parent's size.
2 Infinite width
SizedBox(
width: ____,
child: Text('Tam genişlik'),
)SizedBox(
width: double.infinity,
child: Text('Tam genişlik'),
)Explanation: double.infinity means as large as possible.
3 SizedBox.expand concepts
| Term | Meaning |
|---|---|
SizedBox.expand |
Fills the parent |
expand |
Full size |
double.infinity |
Infinite size value |
width + height = infinity |
Equivalent to SizedBox.expand |