Single Child Layout
Sesuai dengan namanya, Widget ini hanya bisa menampung 1 (satu) buah child saja, misalnya : Padding, Container, Card, Expanded, Flexible, Center, GestureDetector, Positioned, SafeArea, SingleChildScrollView, dll.
(untuk lebih lengkap lihat. https://flutter.dev/docs/development/ui/widgets/layout).![]() |
Ilustrasi Single Layout Widget |
Tidak semua widget akan kita bahas, tujuan dari tutorial ini adalah untuk memberikan pengetahuan tentang konsep Single Child Layout, yaitu hanya 1 Widget saja yang bisa dibungkus (wrapp).
Padding
Padding digunakan untuk memberikan jarak (ruang) atas, bawah, kanan dan kiri dari child widgetnya, untuk memberikan jarak gunakan property padding dengan nilai dari EdgeInsets...(double).
misalnya padding: EdgeInsets.all(16.0) akan memberikan jarak disemua sisi 16.0, padding: EdgeInsets.only(left: 16.0) hanya bagian kiri saja, padding: EdgeInsets.only(left:16.0, right: 16.0) memberikan jarak kiri dan kanan 16.0.
![]() |
Paddign (
padding: EdgeInsets...
child: Widget...
)
Center
Seperti namanya, widget ini digunakan untuk meletakkan childnya di tengah.![]() |
Center(
child: Widget...
)
Expanded
Widget ini digunakan jika kita ingin memenuhi ruang yang ada pada, Misalnya: Row, Column, atau Flex, jika child widget yang menggunakan Expanded lebih dari 1 maka ukurannya akan dibagi sesuai dengan flex factor.
![]() |
Sebelum Menggunakan Expanded |
![]() |
Setelah Menggunakan Expanded |
Expanded(
child: Widget...
)
09.Flutter - Single Child Layout Widget
Reviewed by jc
on
September 06, 2019
Rating:

No comments: