Showing Revision 1 created 10/12/2015 by sp4.

1. Title:
2. Description:

3. 450 0:00 - 0:04
   Sebelum saya mulai coding,
   saya akan jawab pertanyaan ini.
4. 3650 0:04 - 0:07
   Saya hanya mengetahui dua
   view groups, LinearLayouts dan
5. 7460 0:07 - 0:09
   RelativeLayouts.
6. 8626 0:09 - 0:14
   Kata kuncinya adalah keduanya harus
   menempati ruang yang sama.
7. 13710 0:14 - 0:16
   Menggunakan layout weight adalah
   cara paling mudah digunakan.
8. 17480 0:17 - 0:20
   Oke, ayo kerjakan dan perhatikan kodenya.
9. 20070 0:20 - 0:23
   Saya tidak lagi bekerja dalam
   Java, jadi akan saya lanjutkan dan
10. 22880 0:23 - 0:25
    pindah ke activity_main.xml.
11. 25830 0:26 - 0:27
    Inilah berkas XML saya.
12. 28270 0:28 - 0:34
    Saya akan mulai dengan meletakkan semua
    kode ini pada LinearLayout lain.
13. 33875 0:34 - 0:38
    Dan ini adalah induk LinearLayout untuk
    dua LinearLayouts mini saya.
14. 39360 0:39 - 0:44
    Saya pindah dua baris ini ke atas sini,
15. 43900 0:44 - 0:50
    karena mereka harus menempel pada
    root view, tambahkan kurung kurawal.
16. 49670 0:50 - 0:54
    Oke, Android Studio secara otomatis
    akan membuat tag penutup untuk saya.
17. 53990 0:54 - 0:55
    Jadi, saya lanjutkan dan
18. 55060 0:55 - 0:59
    memotong tag penutup, gulir
    ke bawah dan tempel.
19. 61160 1:01 - 1:06
    Oke, muncul garis merah dan
    jika saya lihat kesalahannya,
20. 66450 1:06 - 1:11
    dikatakan kalau saya harus menentukan
    layout_height dan layout_width.
21. 70660 1:11 - 1:12
    Baiklah, ayo kerjakan.
22. 73210 1:13 - 1:18
    Jadi karena ini adalah root view,
    saya akan membuat match_parent.
23. 80050 1:20 - 1:21
    Oke, jadi
24. 81140 1:21 - 1:26
    Saya punya satu LinearLayout mengelilingi
    anak LinearLayout sekarang.
25. 85610 1:26 - 1:30
    Dan jika saya buka Preview,
    terlihat sama.
26. 90500 1:30 - 1:36
    Oke, yang akan saya lakukan
    adalah menyalin semuanya yang ada
27. 95510 1:36 - 1:41
    di dalam Team A LinearLayout, dan
    disebelah Team A, saya akan tempel.
28. 102160 1:42 - 1:47
    Dan akan menjadi LinearLayout Team B.
29. 107026 1:47 - 1:52
    Sekarang, semuanya mulai
    terlihat berantakan.
30. 112209 1:52 - 1:57
    Saya akan lakukan Cmd+A,
    atau pilih semua, kemudian
31. 117264 1:57 - 2:04
    menggunakan jalan pintas papan ketik
    Cmd+Option+L untuk memformat kode saya.
32. 123520 2:04 - 2:08
    Pada Windows, Ctrl+Alt+L,
    terlihat sedikit lebih baik.
33. 127930 2:08 - 2:12
    Saya hanya ingin memastikan kalau Anda
    memahami apa yang kini sedang terjadi.
34. 131560 2:12 - 2:17
    Gulir ke atas,
    ada root LinearLayout di sini
35. 136640 2:17 - 2:22
    Dimulai dari sini, dan jika kita
    gulir ke bawah, berakhir di sini.
36. 143320 2:23 - 2:27
    Di dalam root LinearLayout,
    saya gulir ke atas lagi.
37. 148220 2:28 - 2:32
    Ada satu anak tata letak di sini,
    yang mulai dari sini.
38. 151919 2:32 - 2:35
    Saya akan gulir perlahan.
39. 155459 2:35 - 2:37
    Dan berakhir di sini.
40. 157150 2:37 - 2:39
    Ini untuk TeamA.
41. 158860 2:39 - 2:42
    Dan saya ada anak LinearLayout lain
    yang mulai dari sini.
42. 162260 2:42 - 2:47
    Gulir ke bawah perlahan,
    akhiri di sini untuk TeamB.
43. 167418 2:47 - 2:50
    Baiklah, saya menemukan beberapa
    tanda merah di sebelah atas,
44. 169956 2:50 - 2:53
    Saya akan gulir ke atas lagi
    dan melihat kesalahannya.
45. 174400 2:54 - 2:58
    Orientasi salah, tidak ada orientasi
    ditetapkan, dan defaultnya horizontal.
46. 178440 2:58 - 3:01
    Namun tata letak ini memiliki banyak anak,
47. 180965 3:01 - 3:04
    dimana setidaknya memiliki setidaknya
    satu width match_parent.
48. 183793 3:04 - 3:08
    Saya juga ingin membuatnya horizontal,
    tapi ayo lanjutkan dulu dan
49. 188092 3:08 - 3:10
    tetapkan orientasinya.
50. 191360 3:11 - 3:15
    Sekali lagi, secara teknis ini tidak
    dibutuhkan karena defaultnya horizontal
51. 195400 3:15 - 3:17
    tapi akan bagus jika lebih jelas.
52. 197950 3:18 - 3:22
    Oke, ini tentang anak
    yang saling menutupi.
53. 202168 3:22 - 3:24
    Saya akan klik Pratinjau.
54. 204334 3:24 - 3:28
    Tidak terlihat berubah
    terlalu banyak, meskipun
55. 207901 3:28 - 3:31
    saya sudah menyalin dan
    menempel LinearLayout lain.
56. 211905 3:32 - 3:34
    Pasti ada hubungannya
    dengan kesalahan yang tadi.
57. 215525 3:36 - 3:39
    Dikatakan kalau ini adalah
    tata letak horizontal.
58. 218915 3:39 - 3:43
    Jadi, dia mencoba meletakkan
    dua LinearLayouts berdampingan
59. 222615 3:43 - 3:47
    tapi LinearLayout itu
    punya layout_width dari
60. 226591 3:47 - 3:50
    match_parent yang mengisi layar.
61. 229940 3:50 - 3:55
    Jadi, intinya LinearLayout
    pertama saya memenuhi layar
62. 234510 3:55 - 3:59
    lalu LinearLayout lain berada
    di sebelahnya di luar layar.
63. 240000 4:00 - 4:03
    Mari pikirkan tentang apa yang
    sebenarnya kita mau di sini.
64. 243360 4:03 - 4:08
    Kita mau dua tata letak menempati
    ruang sama dan berdampingan.
65. 248090 4:08 - 4:12
    Inilah saatnya untuk kita
    memberi layout_weights.
66. 251860 4:12 - 4:16
    Saya akan ambil LinearLayout pertama dan
67. 256267 4:16 - 4:20
    memberinya layout_weight 1.
68. 261140 4:21 - 4:26
    Saya juga akan atur width ke 0.
69. 266160 4:26 - 4:30
    Oke, kita bisa lihat kalau
    kita punya dua LinearLayouts,
70. 269940 4:30 - 4:33
    hanya saja mereka tidak
    tertata dengan baik.
71. 272940 4:33 - 4:35
    Tapi sekarang sudah lebih baik.
72. 274560 4:35 - 4:38
    Saya juga beri layout_weight
    pada LinearLayout kedua,
73. 277807 4:38 - 4:39
    di sebelah sini.
74. 278877 4:39 - 4:40
    Saya gulir ke bawah.
75. 280500 4:40 - 4:42
    Inilah LinearLayout kedua saya.
76. 282190 4:42 - 4:44
    Saya akan lakukan hal yang sama.
77. 284250 4:44 - 4:48
    layout_weight juga 1
78. 288186 4:48 - 4:51
    jadi, sekarang mereka punya
    layout_weight yang setara.
79. 292650 4:53 - 4:56
    dan saya atur lebar ke 0.
80. 295630 4:56 - 5:00
    Alasan saya mengatur lebar keduanya ke 0,
81. 300160 5:00 - 5:05
    adalah jika kedua sisi tidak diberi lebar.
82. 304588 5:05 - 5:07
    Maka mereka akan menguasai seluruh ruang,
83. 306850 5:07 - 5:11
    yaitu seluruh layar, dibagi menjadi dua
84. 311340 5:11 - 5:15
    karena keduanya memiliki lebar yang sama.
85. 314950 5:15 - 5:18
    Jika semua ini membingungkan,
    saya sudah menautkan beberapa video
86. 317650 5:18 - 5:20
    dalam catatan instruktur yang
    membahas tentang layout_weight.
87. 320350 5:20 - 5:24
    Ini sudah terlihat lumayan bagus,
    kecuali di sini disebut Team A.
88. 324162 5:24 - 5:29
    Saya akan gulir ke bawah dan
    mengubahnya menjadi Team B.
89. 330460 5:30 - 5:35
    Anda mungkin juga menyadari kalau
    ada kesalahan di sini dan
90. 335420 5:35 - 5:40
    kesalahan itu muncul karena
    adanya ID ganda.
91. 339760 5:40 - 5:42
    Ingat, saya baru saja menyalin
    dan menempel kode.
92. 342340 5:42 - 5:46
    Jadi, pada dasarnya kita punya dua hal
    yang sedang mencoba memiliki id sama
93. 346090 5:46 - 5:48
    dari team_a_score.
94. 348030 5:48 - 5:52
    Saya akan menggantinye ke team_b_score.
95. 351800 5:52 - 5:54
    Oke, sudah lumayan bagus.
96. 353840 5:54 - 5:55
    Agak kurang jelas.
    Saya perbesar.
97. 356800 5:57 - 5:58
    Tertulis di sini Team B.
98. 359290 5:59 - 6:02
    Tombol dan semua tampilan teks yang benar.
99. 362420 6:02 - 6:04
    Saya akan mencobanya di ponsel.
100. 365490 6:05 - 6:08
     Oke, sudah lumayan bagus.
101. 367960 6:08 - 6:13
     Sekarang, jika saya menekan tombol
     Team A, dia bertambah. Bagus.
102. 373418 6:13 - 6:19
     Jika saya tekan tombol Team B,
     dia juga bertambah.
103. 378840 6:19 - 6:21
     Ini spesial.
104. 380910 6:21 - 6:23
     Tapi ingat, kita hanya ingin
     mendapatkan XML yang tepat.
105. 383480 6:23 - 6:26
     Kita tidak terlalu peduli dengan Java.
106. 385630 6:26 - 6:29
     Tapi sekarang XML sudah bisa berjalan,
     kenapa tidak sekalian kita perbaiki Java?