SizedBox
- Flutter course
- Beginner
- Lesson 41/99
- 4 min
Learn to give fixed size or spacing with SizedBox.
SizedBox
SizedBox is a widget that creates a fixed-size box. Its width and height parameters give exact dimensions; the child sits inside that box. When used without a child, it acts as a fixed spacing tool.
SizedBox(
width: 100,
height: 50,
child: Text('Kutu'),
)
// Without child: fixed spacing
SizedBox(height: 16)width and height
SizedBox's width parameter sets the horizontal dimension and height the vertical. If you provide one and leave the other empty, the missing dimension stays flexible to match the child. For example SizedBox(height: 20) leaves only vertical spacing; the horizontal size adjusts to the child or parent.
// Height only
SizedBox(height: 20, child: Text('İnce'))
// Both width and height
SizedBox(
width: 200,
height: 100,
child: Container(color: Colors.blue),
)Practice Print SizedBox info
In main, print two lines with print: sizedbox sabit and width height.
Starter code
void main() {
// iki satır yazdır:
// sizedbox sabit
// width height
}Sample solution
void main() {
print('sizedbox sabit');
print('width height');
}Expected output
sizedbox sabit width height
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 What is the SizedBox widget used for?
- For a fixed-size box or spacing Correct answer
- To give color
- To play animations
- To display text
Explanation: SizedBox creates a fixed-size box; when used without a child it acts as a fixed spacing tool.
2 Give a fixed height
SizedBox(
____: 50,
child: Text('Kısa'),
)SizedBox(
height: 50,
child: Text('Kısa'),
)Explanation: The height parameter gives SizedBox its vertical dimension.
3 SizedBox concepts
| Term | Meaning |
|---|---|
SizedBox |
Fixed-size box |
width |
Horizontal dimension |
height |
Vertical dimension |
çocuksuz SizedBox |
Fixed spacing tool |