1 00:00:00,450 --> 00:00:03,650 Sebelum saya mulai coding, saya akan jawab pertanyaan ini. 2 00:00:03,650 --> 00:00:07,460 Saya hanya mengetahui dua view groups, LinearLayouts dan 3 00:00:07,460 --> 00:00:08,626 RelativeLayouts. 4 00:00:08,626 --> 00:00:13,710 Kata kuncinya adalah keduanya harus menempati ruang yang sama. 5 00:00:13,710 --> 00:00:16,260 Menggunakan layout weight adalah cara paling mudah digunakan. 6 00:00:17,480 --> 00:00:20,070 Oke, ayo kerjakan dan perhatikan kodenya. 7 00:00:20,070 --> 00:00:22,880 Saya tidak lagi bekerja dalam Java, jadi akan saya lanjutkan dan 8 00:00:22,880 --> 00:00:24,775 pindah ke activity_main.xml. 9 00:00:25,830 --> 00:00:27,150 Inilah berkas XML saya. 10 00:00:28,270 --> 00:00:33,875 Saya akan mulai dengan meletakkan semua kode ini pada LinearLayout lain. 11 00:00:33,875 --> 00:00:38,334 Dan ini adalah induk LinearLayout untuk dua LinearLayouts mini saya. 12 00:00:39,360 --> 00:00:43,900 Saya pindah dua baris ini ke atas sini, 13 00:00:43,900 --> 00:00:49,670 karena mereka harus menempel pada root view, tambahkan kurung kurawal. 14 00:00:49,670 --> 00:00:53,990 Oke, Android Studio secara otomatis akan membuat tag penutup untuk saya. 15 00:00:53,990 --> 00:00:55,060 Jadi, saya lanjutkan dan 16 00:00:55,060 --> 00:00:59,370 memotong tag penutup, gulir ke bawah dan tempel. 17 00:01:01,160 --> 00:01:06,450 Oke, muncul garis merah dan jika saya lihat kesalahannya, 18 00:01:06,450 --> 00:01:10,660 dikatakan kalau saya harus menentukan layout_height dan layout_width. 19 00:01:10,660 --> 00:01:12,040 Baiklah, ayo kerjakan. 20 00:01:13,210 --> 00:01:17,580 Jadi karena ini adalah root view, saya akan membuat match_parent. 21 00:01:20,050 --> 00:01:21,140 Oke, jadi 22 00:01:21,140 --> 00:01:25,610 Saya punya satu LinearLayout mengelilingi anak LinearLayout sekarang. 23 00:01:25,610 --> 00:01:30,500 Dan jika saya buka Preview, terlihat sama. 24 00:01:30,500 --> 00:01:35,510 Oke, yang akan saya lakukan adalah menyalin semuanya yang ada 25 00:01:35,510 --> 00:01:41,100 di dalam Team A LinearLayout, dan disebelah Team A, saya akan tempel. 26 00:01:42,160 --> 00:01:47,026 Dan akan menjadi LinearLayout Team B. 27 00:01:47,026 --> 00:01:52,209 Sekarang, semuanya mulai terlihat berantakan. 28 00:01:52,209 --> 00:01:57,264 Saya akan lakukan Cmd+A, atau pilih semua, kemudian 29 00:01:57,264 --> 00:02:03,520 menggunakan jalan pintas papan ketik Cmd+Option+L untuk memformat kode saya. 30 00:02:03,520 --> 00:02:07,930 Pada Windows, Ctrl+Alt+L, terlihat sedikit lebih baik. 31 00:02:07,930 --> 00:02:11,560 Saya hanya ingin memastikan kalau Anda memahami apa yang kini sedang terjadi. 32 00:02:11,560 --> 00:02:16,640 Gulir ke atas, ada root LinearLayout di sini 33 00:02:16,640 --> 00:02:21,930 Dimulai dari sini, dan jika kita gulir ke bawah, berakhir di sini. 34 00:02:23,320 --> 00:02:26,550 Di dalam root LinearLayout, saya gulir ke atas lagi. 35 00:02:28,220 --> 00:02:31,919 Ada satu anak tata letak di sini, yang mulai dari sini. 36 00:02:31,919 --> 00:02:35,459 Saya akan gulir perlahan. 37 00:02:35,459 --> 00:02:37,150 Dan berakhir di sini. 38 00:02:37,150 --> 00:02:38,860 Ini untuk TeamA. 39 00:02:38,860 --> 00:02:42,260 Dan saya ada anak LinearLayout lain yang mulai dari sini. 40 00:02:42,260 --> 00:02:47,418 Gulir ke bawah perlahan, akhiri di sini untuk TeamB. 41 00:02:47,418 --> 00:02:49,956 Baiklah, saya menemukan beberapa tanda merah di sebelah atas, 42 00:02:49,956 --> 00:02:52,750 Saya akan gulir ke atas lagi dan melihat kesalahannya. 43 00:02:54,400 --> 00:02:58,440 Orientasi salah, tidak ada orientasi ditetapkan, dan defaultnya horizontal. 44 00:02:58,440 --> 00:03:00,965 Namun tata letak ini memiliki banyak anak, 45 00:03:00,965 --> 00:03:03,793 dimana setidaknya memiliki setidaknya satu width match_parent. 46 00:03:03,793 --> 00:03:08,092 Saya juga ingin membuatnya horizontal, tapi ayo lanjutkan dulu dan 47 00:03:08,092 --> 00:03:10,010 tetapkan orientasinya. 48 00:03:11,360 --> 00:03:15,400 Sekali lagi, secara teknis ini tidak dibutuhkan karena defaultnya horizontal 49 00:03:15,400 --> 00:03:16,730 tapi akan bagus jika lebih jelas. 50 00:03:17,950 --> 00:03:22,168 Oke, ini tentang anak yang saling menutupi. 51 00:03:22,168 --> 00:03:24,334 Saya akan klik Pratinjau. 52 00:03:24,334 --> 00:03:27,901 Tidak terlihat berubah terlalu banyak, meskipun 53 00:03:27,901 --> 00:03:30,842 saya sudah menyalin dan menempel LinearLayout lain. 54 00:03:31,905 --> 00:03:34,345 Pasti ada hubungannya dengan kesalahan yang tadi. 55 00:03:35,525 --> 00:03:38,915 Dikatakan kalau ini adalah tata letak horizontal. 56 00:03:38,915 --> 00:03:42,615 Jadi, dia mencoba meletakkan dua LinearLayouts berdampingan 57 00:03:42,615 --> 00:03:46,591 tapi LinearLayout itu punya layout_width dari 58 00:03:46,591 --> 00:03:49,940 match_parent yang mengisi layar. 59 00:03:49,940 --> 00:03:54,510 Jadi, intinya LinearLayout pertama saya memenuhi layar 60 00:03:54,510 --> 00:03:58,510 lalu LinearLayout lain berada di sebelahnya di luar layar. 61 00:04:00,000 --> 00:04:03,360 Mari pikirkan tentang apa yang sebenarnya kita mau di sini. 62 00:04:03,360 --> 00:04:08,090 Kita mau dua tata letak menempati ruang sama dan berdampingan. 63 00:04:08,090 --> 00:04:11,860 Inilah saatnya untuk kita memberi layout_weights. 64 00:04:11,860 --> 00:04:16,267 Saya akan ambil LinearLayout pertama dan 65 00:04:16,267 --> 00:04:19,579 memberinya layout_weight 1. 66 00:04:21,140 --> 00:04:26,160 Saya juga akan atur width ke 0. 67 00:04:26,160 --> 00:04:29,940 Oke, kita bisa lihat kalau kita punya dua LinearLayouts, 68 00:04:29,940 --> 00:04:32,940 hanya saja mereka tidak tertata dengan baik. 69 00:04:32,940 --> 00:04:34,560 Tapi sekarang sudah lebih baik. 70 00:04:34,560 --> 00:04:37,807 Saya juga beri layout_weight pada LinearLayout kedua, 71 00:04:37,807 --> 00:04:38,877 di sebelah sini. 72 00:04:38,877 --> 00:04:40,500 Saya gulir ke bawah. 73 00:04:40,500 --> 00:04:42,190 Inilah LinearLayout kedua saya. 74 00:04:42,190 --> 00:04:44,250 Saya akan lakukan hal yang sama. 75 00:04:44,250 --> 00:04:48,186 layout_weight juga 1 76 00:04:48,186 --> 00:04:51,080 jadi, sekarang mereka punya layout_weight yang setara. 77 00:04:52,650 --> 00:04:55,630 dan saya atur lebar ke 0. 78 00:04:55,630 --> 00:05:00,160 Alasan saya mengatur lebar keduanya ke 0, 79 00:05:00,160 --> 00:05:04,588 adalah jika kedua sisi tidak diberi lebar. 80 00:05:04,588 --> 00:05:06,850 Maka mereka akan menguasai seluruh ruang, 81 00:05:06,850 --> 00:05:11,340 yaitu seluruh layar, dibagi menjadi dua 82 00:05:11,340 --> 00:05:14,950 karena keduanya memiliki lebar yang sama. 83 00:05:14,950 --> 00:05:17,650 Jika semua ini membingungkan, saya sudah menautkan beberapa video 84 00:05:17,650 --> 00:05:20,350 dalam catatan instruktur yang membahas tentang layout_weight. 85 00:05:20,350 --> 00:05:24,162 Ini sudah terlihat lumayan bagus, kecuali di sini disebut Team A. 86 00:05:24,162 --> 00:05:29,310 Saya akan gulir ke bawah dan mengubahnya menjadi Team B. 87 00:05:30,460 --> 00:05:35,420 Anda mungkin juga menyadari kalau ada kesalahan di sini dan 88 00:05:35,420 --> 00:05:39,760 kesalahan itu muncul karena adanya ID ganda. 89 00:05:39,760 --> 00:05:42,340 Ingat, saya baru saja menyalin dan menempel kode. 90 00:05:42,340 --> 00:05:46,090 Jadi, pada dasarnya kita punya dua hal yang sedang mencoba memiliki id sama 91 00:05:46,090 --> 00:05:48,030 dari team_a_score. 92 00:05:48,030 --> 00:05:51,800 Saya akan menggantinye ke team_b_score. 93 00:05:51,800 --> 00:05:53,840 Oke, sudah lumayan bagus. 94 00:05:53,840 --> 00:05:55,420 Agak kurang jelas. Saya perbesar. 95 00:05:56,800 --> 00:05:58,150 Tertulis di sini Team B. 96 00:05:59,290 --> 00:06:02,420 Tombol dan semua tampilan teks yang benar. 97 00:06:02,420 --> 00:06:03,870 Saya akan mencobanya di ponsel. 98 00:06:05,490 --> 00:06:07,960 Oke, sudah lumayan bagus. 99 00:06:07,960 --> 00:06:13,418 Sekarang, jika saya menekan tombol Team A, dia bertambah. Bagus. 100 00:06:13,418 --> 00:06:18,840 Jika saya tekan tombol Team B, dia juga bertambah. 101 00:06:18,840 --> 00:06:20,910 Ini spesial. 102 00:06:20,910 --> 00:06:23,480 Tapi ingat, kita hanya ingin mendapatkan XML yang tepat. 103 00:06:23,480 --> 00:06:25,630 Kita tidak terlalu peduli dengan Java. 104 00:06:25,630 --> 00:06:29,140 Tapi sekarang XML sudah bisa berjalan, kenapa tidak sekalian kita perbaiki Java?