-
Title:
-
Description:
-
Sebelum saya mulai coding,
saya akan jawab pertanyaan ini.
-
Saya hanya mengetahui dua
view groups, LinearLayouts dan
-
RelativeLayouts.
-
Kata kuncinya adalah keduanya harus
menempati ruang yang sama.
-
Menggunakan layout weight adalah
cara paling mudah digunakan.
-
Oke, ayo kerjakan dan perhatikan kodenya.
-
Saya tidak lagi bekerja dalam
Java, jadi akan saya lanjutkan dan
-
pindah ke activity_main.xml.
-
Inilah berkas XML saya.
-
Saya akan mulai dengan meletakkan semua
kode ini pada LinearLayout lain.
-
Dan ini adalah induk LinearLayout untuk
dua LinearLayouts mini saya.
-
Saya pindah dua baris ini ke atas sini,
-
karena mereka harus menempel pada
root view, tambahkan kurung kurawal.
-
Oke, Android Studio secara otomatis
akan membuat tag penutup untuk saya.
-
Jadi, saya lanjutkan dan
-
memotong tag penutup, gulir
ke bawah dan tempel.
-
Oke, muncul garis merah dan
jika saya lihat kesalahannya,
-
dikatakan kalau saya harus menentukan
layout_height dan layout_width.
-
Baiklah, ayo kerjakan.
-
Jadi karena ini adalah root view,
saya akan membuat match_parent.
-
Oke, jadi
-
Saya punya satu LinearLayout mengelilingi
anak LinearLayout sekarang.
-
Dan jika saya buka Preview,
terlihat sama.
-
Oke, yang akan saya lakukan
adalah menyalin semuanya yang ada
-
di dalam Team A LinearLayout, dan
disebelah Team A, saya akan tempel.
-
Dan akan menjadi LinearLayout Team B.
-
Sekarang, semuanya mulai
terlihat berantakan.
-
Saya akan lakukan Cmd+A,
atau pilih semua, kemudian
-
menggunakan jalan pintas papan ketik
Cmd+Option+L untuk memformat kode saya.
-
Pada Windows, Ctrl+Alt+L,
terlihat sedikit lebih baik.
-
Saya hanya ingin memastikan kalau Anda
memahami apa yang kini sedang terjadi.
-
Gulir ke atas,
ada root LinearLayout di sini
-
Dimulai dari sini, dan jika kita
gulir ke bawah, berakhir di sini.
-
Di dalam root LinearLayout,
saya gulir ke atas lagi.
-
Ada satu anak tata letak di sini,
yang mulai dari sini.
-
Saya akan gulir perlahan.
-
Dan berakhir di sini.
-
Ini untuk TeamA.
-
Dan saya ada anak LinearLayout lain
yang mulai dari sini.
-
Gulir ke bawah perlahan,
akhiri di sini untuk TeamB.
-
Baiklah, saya menemukan beberapa
tanda merah di sebelah atas,
-
Saya akan gulir ke atas lagi
dan melihat kesalahannya.
-
Orientasi salah, tidak ada orientasi
ditetapkan, dan defaultnya horizontal.
-
Namun tata letak ini memiliki banyak anak,
-
dimana setidaknya memiliki setidaknya
satu width match_parent.
-
Saya juga ingin membuatnya horizontal,
tapi ayo lanjutkan dulu dan
-
tetapkan orientasinya.
-
Sekali lagi, secara teknis ini tidak
dibutuhkan karena defaultnya horizontal
-
tapi akan bagus jika lebih jelas.
-
Oke, ini tentang anak
yang saling menutupi.
-
Saya akan klik Pratinjau.
-
Tidak terlihat berubah
terlalu banyak, meskipun
-
saya sudah menyalin dan
menempel LinearLayout lain.
-
Pasti ada hubungannya
dengan kesalahan yang tadi.
-
Dikatakan kalau ini adalah
tata letak horizontal.
-
Jadi, dia mencoba meletakkan
dua LinearLayouts berdampingan
-
tapi LinearLayout itu
punya layout_width dari
-
match_parent yang mengisi layar.
-
Jadi, intinya LinearLayout
pertama saya memenuhi layar
-
lalu LinearLayout lain berada
di sebelahnya di luar layar.
-
Mari pikirkan tentang apa yang
sebenarnya kita mau di sini.
-
Kita mau dua tata letak menempati
ruang sama dan berdampingan.
-
Inilah saatnya untuk kita
memberi layout_weights.
-
Saya akan ambil LinearLayout pertama dan
-
memberinya layout_weight 1.
-
Saya juga akan atur width ke 0.
-
Oke, kita bisa lihat kalau
kita punya dua LinearLayouts,
-
hanya saja mereka tidak
tertata dengan baik.
-
Tapi sekarang sudah lebih baik.
-
Saya juga beri layout_weight
pada LinearLayout kedua,
-
di sebelah sini.
-
Saya gulir ke bawah.
-
Inilah LinearLayout kedua saya.
-
Saya akan lakukan hal yang sama.
-
layout_weight juga 1
-
jadi, sekarang mereka punya
layout_weight yang setara.
-
dan saya atur lebar ke 0.
-
Alasan saya mengatur lebar keduanya ke 0,
-
adalah jika kedua sisi tidak diberi lebar.
-
Maka mereka akan menguasai seluruh ruang,
-
yaitu seluruh layar, dibagi menjadi dua
-
karena keduanya memiliki lebar yang sama.
-
Jika semua ini membingungkan,
saya sudah menautkan beberapa video
-
dalam catatan instruktur yang
membahas tentang layout_weight.
-
Ini sudah terlihat lumayan bagus,
kecuali di sini disebut Team A.
-
Saya akan gulir ke bawah dan
mengubahnya menjadi Team B.
-
Anda mungkin juga menyadari kalau
ada kesalahan di sini dan
-
kesalahan itu muncul karena
adanya ID ganda.
-
Ingat, saya baru saja menyalin
dan menempel kode.
-
Jadi, pada dasarnya kita punya dua hal
yang sedang mencoba memiliki id sama
-
dari team_a_score.
-
Saya akan menggantinye ke team_b_score.
-
Oke, sudah lumayan bagus.
-
Agak kurang jelas.
Saya perbesar.
-
Tertulis di sini Team B.
-
Tombol dan semua tampilan teks yang benar.
-
Saya akan mencobanya di ponsel.
-
Oke, sudah lumayan bagus.
-
Sekarang, jika saya menekan tombol
Team A, dia bertambah. Bagus.
-
Jika saya tekan tombol Team B,
dia juga bertambah.
-
Ini spesial.
-
Tapi ingat, kita hanya ingin
mendapatkan XML yang tepat.
-
Kita tidak terlalu peduli dengan Java.
-
Tapi sekarang XML sudah bisa berjalan,
kenapa tidak sekalian kita perbaiki Java?