Jarak dengan Padding
Gunakan Modifier untuk jarak.
Jarak dengan Padding ialah pelajaran Android Academy percuma di CoddyKit. Ini ialah pelajaran 3 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Android Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Android Academy merangkumi sejumlah 4 pelajaran.
Apakah Padding?
Padding ialah ruang kosong yang ditambahkan di sekeliling kandungan composable. Ia menjauhkan kandungan daripada tepi supaya susun atur tidak terasa sempit.
Dalam Compose, anda menambahkan padding melalui Modifier.
Text(
text = "Hello",
modifier = Modifier.padding(16.dp)
)Unit dp
Saiz padding menggunakan dp, singkatan bagi piksel bebas ketumpatan. dp kelihatan sama dari segi saiz fizikal pada setiap skrin.
Tulis nombor diikuti .dp, seperti 8.dp atau 24.dp.
Modifier.padding(8.dp)Apakah Modifier?
Modifier menerangkan rupa dan tingkah laku composable: saiz, padding, latar belakang dan banyak lagi.
Anda membina pengubah suai dengan merangkaikan fungsi menggunakan titik.
Modifier
.padding(16.dp)
.background(Color.Yellow)Padding pada Semua Sisi
Memanggil padding(16.dp) dengan satu nilai menambahkan ruang yang sama pada keempat-empat sisi: atas, bawah, mula dan akhir.
Ini ialah cara terpantas untuk memberikan ruang yang selesa kepada kandungan.
Box(
modifier = Modifier.padding(16.dp)
) {
Text("Inside")
}Padding Mendatar dan Menegak
Anda boleh menetapkan sisi secara berasingan dengan parameter horizontal dan vertical.
Mendatar meliputi mula dan akhir; menegak meliputi atas dan bawah.
Modifier.padding(
horizontal = 24.dp,
vertical = 8.dp
)Padding pada Satu Sisi
Untuk menyasarkan satu tepi, namakannya: start, top, end atau bottom.
Ini membolehkan anda melaraskan jarak dengan tepat pada tempat yang diperlukan.
Modifier.padding(
start = 16.dp,
top = 4.dp
)Urutan Penting
Urutan Modifier mengubah hasilnya. Meletakkan padding sebelum latar belakang menyebabkan kawasan berpadding tidak dicat; selepasnya, latar belakang memenuhi padding tersebut.
Baca Modifier dari atas ke bawah, seperti lapisan.
Modifier
.background(Color.Cyan)
.padding(16.dp)Jarak antara Item
Di dalam Column atau Row, gunakan Arrangement.spacedBy untuk menambahkan jarak sama rata antara anak secara automatik.
Ini lebih kemas daripada menambahkan padding pada setiap anak secara manual.
Column(
verticalArrangement = Arrangement.spacedBy(12.dp)
) {
Text("One")
Text("Two")
}Spacer untuk Jarak
Spacer ialah composable kosong yang digunakan untuk menjauhkan item. Berikan saiz kepadanya dengan Modifier.
Ia berguna untuk menetapkan jarak tetap antara dua elemen.
Column {
Text("Top")
Spacer(Modifier.height(16.dp))
Text("Bottom")
}Padding berbanding Margin
Compose tidak mempunyai margin yang berasingan. Anda mencipta ruang luar dengan meletakkan padding lebih awal dalam rantaian Modifier, sebelum saiz atau latar belakang.
Jadi, satu alat, iaitu padding, mengendalikan jarak dalam dan luar bergantung pada urutannya.
Modifier
.padding(16.dp)
.background(Color.LightGray)
.padding(8.dp)Jarak yang Konsisten
Aplikasi yang baik menggunakan beberapa nilai berulang, seperti 4, 8, 16 dan 24 dp. Ini menjadikan susun atur kemas dan mudah dijangka.
Elakkan nombor rawak; pilih daripada skala kecil.
Modifier.padding(16.dp)Semakan Pantas
Uji pengetahuan anda tentang padding.
Ringkasan
Padding menambahkan ruang di sekeliling kandungan menggunakan Modifier.padding dengan nilai dp. Anda boleh menambahkan padding pada semua sisi, secara mendatar/menegak atau pada tepi tunggal.
Urutan Modifier penting, manakala Arrangement.spacedBy atau Spacer mengendalikan jarak antara item.
Seterusnya, anda akan meneroka warna dan MaterialTheme.
Pelajari Kotlin dengan tutor kecerdasan buatan — percuma
Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.
- Kursus
- 36
- Pelajaran
- 152
Soalan Lazim
Adakah pelajaran “Jarak dengan Padding” percuma?
Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Android Academy, termasuk “Jarak dengan Padding”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Android Academy merangkumi sejumlah 4 pelajaran.
Apakah yang akan saya pelajari dalam “Jarak dengan Padding”?
Gunakan Modifier untuk jarak. Anda berlatih Android Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.
Adakah saya memerlukan pengalaman untuk memulakan Android Academy?
Tiada pengalaman terdahulu diperlukan. Pembelajaran Android Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 3 daripada 4.
Berapa lamakah pelajaran “Jarak dengan Padding” diambil?
Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.
Bolehkah saya menulis dan menjalankan kod dalam pelajaran Android Academy ini?
Ya. Setiap pelajaran Android Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.
Semua pelajaran dalam kursus ini
- Menggayakan Teks
- Butang dan Klik
- Jarak dengan Padding
- Warna dan MaterialTheme