Label, Pemegang Tempat & Ikon Hadapan
Jadikan input jelas dan mesra.
Label, Pemegang Tempat & Ikon Hadapan ialah pelajaran Jetpack Compose Academy percuma di CoddyKit. Ini ialah pelajaran 2 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Jetpack Compose Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Jetpack Compose Academy merangkumi sejumlah 4 pelajaran.
Jadikan Input Mesra Pengguna
Kotak kosong membuatkan pengguna tertanya-tanya. Label, teks ruang letak dan ikon mengubah medan biasa menjadi medan yang membimbing pengguna. 🧭
Slot Label
label menamakan medan tersebut. Ia berada di dalam medan apabila kosong, kemudian terapung ke sempadan apabila medan difokuskan atau diisi.
OutlinedTextField(
value = email,
onValueChange = { email = it },
label = { Text("Email") }
)Tambah Teks Ruang Letak
placeholder ialah teks petunjuk yang hanya dipaparkan semasa medan kosong. Gunakannya untuk contoh, bukan untuk nama medan.
placeholder = { Text("you@example.com") }Label berbanding Ruang Letak
label sentiasa kelihatan untuk mengenal pasti medan. Ruang letak hilang sebaik sahaja pengguna mula menaip. Gunakan kedua-duanya bersama.
Ikon Awalan
leadingIcon berada di permulaan medan. Sampul surat di sebelah kotak e-mel menjadikan tujuannya jelas sepintas lalu.
leadingIcon = {
Icon(Icons.Default.Email, contentDescription = null)
}Ikon Akhiran Juga
trailingIcon berada di hujung medan. Ia sesuai untuk butang kosongkan atau togol keterlihatan kata laluan.
trailingIcon = {
Icon(Icons.Default.Clear, contentDescription = "Clear")
}Sentiasa Terangkan Ikon
Berikan setiap Ikon contentDescription supaya pembaca skrin boleh menyebutkannya. Hantar null hanya apabila ikon itu semata-mata hiasan.
Jadikan Ikon Akhiran Boleh Diketuk
Bungkus ikon akhiran dalam IconButton supaya pengguna boleh mengetiknya, contohnya untuk mengosongkan medan dengan satu ketikan.
trailingIcon = {
IconButton(onClick = { email = "" }) {
Icon(Icons.Default.Clear, "Clear")
}
}Teks Sokongan
supportingText memaparkan petunjuk kecil di bawah medan, seperti peringatan format atau had aksara, tanpa memenuhi ruang input.
supportingText = { Text("We never share your email.") }Gabungkan dengan Bijak
Label bersama ikon dan ruang letak yang pendek sudah mencukupi. Terlalu banyak petunjuk menambah gangguan, jadi pastikan setiap medan tenang dan jelas.
Slot Hanyalah Composable
Setiap slot, seperti label dan leadingIcon, ialah lambda yang mengandungi Composable. Ini bermakna anda boleh meletakkan apa-apa UI yang diingini di dalamnya.
Semakan Pantas
Bilakah ruang letak hilang daripada medan teks?
Ulang Kaji
Anda telah memperkemas input dengan label, petunjuk ruang letak, ikon awalan dan akhiran serta teks sokongan. Medan mesra, pengguna gembira. 😊
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
- 30
- Pelajaran
- 120
Soalan Lazim
Adakah pelajaran “Label, Pemegang Tempat & Ikon Hadapan” percuma?
Ya — teks penuh “Label, Pemegang Tempat & Ikon Hadapan” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus Jetpack Compose Academy, tingkat taraf kepada CoddyKit PRO. Kursus Jetpack Compose Academy merangkumi sejumlah 4 pelajaran.
Apakah yang akan saya pelajari dalam “Label, Pemegang Tempat & Ikon Hadapan”?
Jadikan input jelas dan mesra. Anda berlatih Jetpack Compose 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 Jetpack Compose Academy?
Tiada pengalaman terdahulu diperlukan. Pembelajaran Jetpack Compose 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 2 daripada 4.
Berapa lamakah pelajaran “Label, Pemegang Tempat & Ikon Hadapan” 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 Jetpack Compose Academy ini?
Ya. Setiap pelajaran Jetpack Compose 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
- TextField & OutlinedTextField
- Label, Pemegang Tempat & Ikon Hadapan
- Jenis Papan Kekunci & Tindakan IME
- Pengesahan Sebaris & State Ralat