Panduan Menggunakan Padding dalam Flutter

In Flutter, Padding ialah salah satu alat penting untuk mencipta jarak antara elemen dalam antara muka pengguna anda. Ini membantu anda mencapai reka letak yang lebih menarik secara visual dan berkesan. Artikel ini akan membimbing anda tentang cara menggunakan Padding untuk mencipta jarak antara elemen dalam Flutter aplikasi anda.

Penggunaan Asas

Padding digunakan dengan membungkus yang widget anda ingin tambahkan jarak di sekeliling. Di bawah ialah cara anda boleh gunakan Padding untuk menambah padding sekitar widget:

Padding(
  padding: EdgeInsets.all(16.0), // Adds 16 points of padding around the child widget  
  child: YourWidgetHere(),  
)  

Menyesuaikan Jarak

Anda boleh menyesuaikan jarak untuk setiap sisi(kiri, kanan, atas, bawah, menegak, mendatar) menggunakan sifat EdgeInsets:

Padding(
  padding: EdgeInsets.only(left: 10.0, right: 20.0), // Adds 10 points of padding on the left and 20 points on the right  
  child: YourWidgetHere(),  
)  

Padding(
  padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0), // Adds vertical and horizontal padding  
  child: YourWidgetHere(),  
)  

Menggabungkan dengan Reka Letak

Padding sering digunakan untuk melaraskan jarak antara widget dalam reka letak seperti Column, Row, ListView, dsb.

Column(  
  children: [  
    Padding(  
      padding: EdgeInsets.only(bottom: 10.0),  
      child: Text('Element 1'),  
   ),  
    Padding(  
      padding: EdgeInsets.only(bottom: 10.0),  
      child: Text('Element 2'),  
   ),  
    // ...  
  ],  
)  

Fleksibiliti dengan Saiz

Padding bukan sahaja menambah jarak tetapi juga boleh mencipta kesan yang serupa dengan margin. Apabila menggunakan Padding, ia tidak menjejaskan ruang di luar widget.

 

Kesimpulan:

Padding ialah alat yang berguna untuk mencipta jarak dan melaraskan kedudukan elemen dalam Flutter UI anda. Dengan menggunakan Padding, anda boleh membuat reka letak yang lebih menarik dan tersusun dengan baik untuk aplikasi anda.