Return to Video

07-42 Add the Reset Button

  • 0:00 - 0:04
    Oke, jadi ini adalah gambaran dari
    aplikasi court counter kita, atau
  • 0:04 - 0:06
    setidaknya tampilan yang kita inginkan.
  • 0:06 - 0:10
    Sekarang, saya akan ikuti saran saya
    dan mulai dengan XML dulu.
  • 0:10 - 0:13
    Mari perhatikan penempatan
    tampilan terlebih dahulu.
  • 0:13 - 0:18
    Jadi, tampilan kita masih seperti ini,
    dan dalam posisi vertikal serta
  • 0:18 - 0:19
    linear layout.
  • 0:19 - 0:23
    Terdapat linear layout untuk team B
    dan juga untuk team A.
  • 0:23 - 0:27
    Dan jangan hanya punya
    dua root view , selain itu,
  • 0:27 - 0:31
    semua ini terbungkus dalam sebuah
    linear layout, yang kebetulan horizontal
  • 0:31 - 0:35
    jadi kedua anak linear layout ini
    tidak bisa berdampingan.
  • 0:35 - 0:38
    Oke, sekarang kita akan tambah
    tombol reset di bawah ini.
  • 0:38 - 0:41
    Untuk menjaga agar otak Anda tidak
    meledak karena memikirkan semua
  • 0:41 - 0:45
    tata letak yang berbeda ini, saya ingin
    Anda memikirkan kalau apapun di dalam
  • 0:45 - 0:48
    horizontal linear layout
    merupakan tampilan tunggal.
  • 0:48 - 0:53
    Dan hanya sedang mencoba menempatkan
    horizontal linear layout di sini
  • 0:53 - 0:54
    dan tombol reset ini.
  • 0:54 - 0:57
    Anda sedang mencoba
    menempatkan dua tampilan.
  • 0:57 - 1:02
    Satu ada di sebelah atas dan
    satu lagi ada di bawah layar.
  • 1:02 - 1:06
    Sekarang pertanyaannya yaitu grup tampilan
    apa yang membolehkan Anda memiliki
  • 1:06 - 1:09
    tampilan di atas dan di bawah layar?
  • 1:09 - 1:13
    Dan ternyata relative layout adalah
    kandidat yang cukup bagus untuk ini.
  • 1:13 - 1:17
    Saya bisa letakkan horizontal linear
    layout saya di sini, sesuaikan lebar
  • 1:17 - 1:20
    tampilan utama, lalu sesuaikan
    isi dengan tingginya.
  • 1:21 - 1:24
    Dan saya bisa letakkan tombol reset
    di sini, tepat di tengah dan
  • 1:24 - 1:26
    di bawah.
  • 1:26 - 1:29
    Jadi, sekarang Anda sudah memiliki
    Relative Layout, dan
  • 1:29 - 1:33
    Relative Layout ini memiliki anak
    Tombol dan Linear Layout
  • 1:33 - 1:36
    Dan anak Tombol ini adalah
    Tombol Reset, dan
  • 1:36 - 1:40
    Linear Layout ini adalah Linear Layout
    di sini, yang horizontal.
  • 1:40 - 1:44
    Selain itu, horizontal linear
    layout ini punya dua anak, dan
  • 1:44 - 1:47
    keduanya juga merupakan linear layout.
  • 1:47 - 1:50
    Mereka adalah linear layout untuk
    team A dan
  • 1:50 - 1:52
    team B yang Anda lihat di sini.
  • 1:52 - 1:57
    Linear layout untuk team A punya
    dua tampilan teks dan tiga tombol.
  • 1:57 - 2:00
    Hal yang sama juga terdapat
    pada linear layout untuk team B.
  • 2:00 - 2:03
    Lima anak, dua tampilan teks
    dan tiga tombol.
  • 2:03 - 2:05
    Bagian layout ini sudah Anda buat,
  • 2:05 - 2:09
    Anda hanya perlu menambahkan ini,
    baiklah, ayo lakukan.
  • 2:09 - 2:13
    Inilah kode XML saya dan hal pertama
    yang ingin saya lakukan adalah
  • 2:13 - 2:18
    membuat Root Relative Layout
    yang tadi Anda lihat dalam diagram.
  • 2:18 - 2:24
    Saya ketik RelativeLayout,
    dan sebenarnya saya ingin
  • 2:24 - 2:28
    memotong dan menempel dua baris ini karena
    mereka harus ada berada di root layout.
  • 2:28 - 2:34
    Jadi, saya potong dan tempel
    di sini, di dalam root layout.
  • 2:34 - 2:37
    Sekarang, saya akan tutup
    RelativeLayout di sini dan
  • 2:37 - 2:44
    saya pindah tag penutup ini
    ke bagian paling bawah.
  • 2:46 - 2:49
    Apa yang saya lakukan sekarang pada
    dasarnya adalah bagian dari diagram ini.
  • 2:49 - 2:53
    Baiklah, sepertinya
    ada kesalahan di sini.
  • 2:53 - 2:57
    Coba saya lihat, ya, saya belum mengatur
    tinggi atau lebar, jadi mari kita buat.
  • 2:59 - 3:02
    Sekarang relative layout saya punya sebuah
    tombol tepat di tengah bagian bawah layar.
  • 3:02 - 3:05
    Untuk melakukannya, sepertinya akan
    memenuhi seluruh layar.
  • 3:05 - 3:07
    Saya lakukan
    match parents di keduanya.
  • 3:09 - 3:12
    Oke, sekarang tinggal
    menambakanh tombolnya.
  • 3:12 - 3:18
    Saya akan gulir ke bawah, tepat di sini,
    tempat dimana linear layout berakhir,
  • 3:18 - 3:23
    Tapi saya masih berada di dalam relative
    layout, dan saya akan menambah tombol.
  • 3:23 - 3:27
    Saya lanjutkan dengan
    wrap content untuk tombol tersebut,
  • 3:27 - 3:30
    karena tombol ini bukanlah tombol
    yang memenuhi sisi bawah
  • 3:30 - 3:33
    layar atau mengisi layar secara penuh.
  • 3:34 - 3:37
    Induk dari tombol ini
    adalah RelativeLayout, dan
  • 3:37 - 3:40
    kita akan atur teks tombol ini
    menjadi Reset
  • 3:40 - 3:43
    Mari kita lihat seperti apa jadinya.
  • 3:43 - 3:47
    Oke, tombol reset saya ada di atas sini,
    jelas bukan yang saya inginkan,
  • 3:47 - 3:52
    tapi induk darinya adalah relative layout,
    yang mengisi seluruh layar.
  • 3:52 - 3:54
    Jadi, saya bisa selaraskan dengan induk.
  • 3:54 - 3:57
    Saya ingin menyelaraskannya
    ke bagian bawah induk, dan
  • 3:57 - 4:01
    saya menginginkannya berada di
    tengah-tengah, secara horizontal.
  • 4:01 - 4:04
    Keren, tombol saya sudah
    Berada di tempat yang tepat.
  • 4:04 - 4:06
    Saya akan pilih apapun di sini.
  • 4:06 - 4:10
    Dan saya lakukan
    pilihan perintah L pada Mac.
  • 4:10 - 4:14
    Yang artinya sama dengan Control-Alt-L
    pada Windows untuk format ulang kode
  • 4:14 - 4:16
    dan merapikannya.
  • 4:16 - 4:19
    Oke, ayo kembali
    ke program kode Java kita.
  • 4:19 - 4:23
    Saya sudah punya tombol tapi
    belum bisa saya gunakan.
  • 4:23 - 4:26
    Mari mulai dengan membuat metode untuknya.
  • 4:26 - 4:32
    Saya akan buat tepat di atas
    display method, di sini, public void.
  • 4:32 - 4:35
    Saya sebut ini sebagai
    metode resetScore,
  • 4:35 - 4:38
    karena itulah yang sedang saya buat.
  • 4:38 - 4:43
    Gulirkan ke atas, saya sesuaikan dengan
    metode yang lain
  • 4:43 - 4:47
    dengan View v, lalu, kurung kurawal.
  • 4:47 - 4:50
    Sekarang, saya belum mau memikirkan
    apa yang akan ada di sini.
  • 4:50 - 4:53
    Saya kembali ke XML kode dan
  • 4:53 - 4:57
    Saya akan lakukan bagian kedua untuk
    menghubungkan tombol dengan kode Java
  • 4:57 - 5:02
    Dengan menambahkan atribut
    onClick di sini untuk resetScore.
  • 5:02 - 5:06
    Sekarang, saat saya mengeklik tombol ini
    kode di sini akan berjalan, tapi
  • 5:06 - 5:08
    tidak ada kode di sini.
  • 5:08 - 5:09
    Mari cari yang harus ditambah
  • 5:11 - 5:14
    Oke, ayo kembali ke diskusi KodePalsu ini.
  • 5:14 - 5:17
    Saat saya menekan tombol Reset,
    kejadian apa yang saya harap terjadi?
  • 5:17 - 5:21
    Nah, saya ingin kedua
    skor ini menunjukkan 0.
  • 5:21 - 5:24
    Selain itu, saya ingin
    variable skor team A dan
  • 5:24 - 5:27
    team B kembali nol.
  • 5:27 - 5:30
    Ingat, saat saya mengeklik salah satu
    tombol ini, saya menambahkan dua
  • 5:30 - 5:32
    lalu menampilkan variabel.
  • 5:32 - 5:34
    Jika saya tidak membuat
    Variable kembali nol,
  • 5:34 - 5:36
    maka akan menunjukkan angka yang salah.
  • 5:36 - 5:39
    Inilah guna dari Kodepalsu.
  • 5:39 - 5:43
    Hal pertama yang saya ingin lakukan adalah
    mengatur skor Team A ke nol.
  • 5:43 - 5:46
    Lalu saya akan lakukan
    hal sama untuk Team B.
  • 5:46 - 5:50
    Sekarang, skor keduanya nol,
    tapi belum ada yang ditampilkan,
  • 5:50 - 5:55
    karena itu, di Langkah 3 saya akan
    tampilkan skor Team A yang di atur ke nol.
  • 5:56 - 6:00
    Dan untuk lebih spesifiknya,
    saya akan menampilkan skor
  • 6:00 - 6:04
    Team A di sini, kemudian saya
    tampilkan skor Team B di sini.
  • 6:04 - 6:08
    Dan karena dalam Langkah 1 dan 2,
    saya telah pastikan mereka diatur ke nol,
  • 6:08 - 6:10
    maka mereka akan menampilkan nol
    di sini dan di sini.
  • 6:10 - 6:14
    Lalu, saat saya mengeklik salah satu
    Tombol untuk memperbarui ScoreForTeamA
  • 6:14 - 6:18
    atau ScoreForTeamB, pembaruan tetap
    berjalan tapi dimulai dengan skor nol.
  • 6:20 - 6:24
    Dalam skor reset, saya akan ketik
    kode palsu saya sebagai kode, kode.
  • 6:24 - 6:29
    Hal pertama yang saya lakukan adalah
    mengambil skor A dan atur angkanya
  • 6:29 - 6:34
    ke nol menggunakan sama dengan
    dan angka nol.
  • 6:34 - 6:36
    Dan jangan lupa titik koma.
  • 6:37 - 6:39
    Saya lakukan hal sama pada skor B.
  • 6:42 - 6:49
    Setelahnya, saya akan tampilkan di
    sisi team A, score for team A.
  • 6:49 - 6:53
    Lalu saya akan tampilkan dalam
    sisi team B, the score for team B.
  • 6:55 - 6:57
    Saya juga akan lanjutkan di sini
    dan tambah komentar.
  • 6:59 - 7:00
    Oke, terlihat masuk akal sekarang.
  • 7:00 - 7:04
    Sudah agak lama saya tidak
    menjalankan apapun di ponsel saya,
  • 7:04 - 7:07
    jadi saya akan tekan tombol Run,
    oke, keren.
  • 7:07 - 7:08
    Saya punya tombol RESET.
  • 7:08 - 7:09
    Mari lihat hasilnya.
  • 7:13 - 7:15
    Bagus, ini nol.
  • 7:15 - 7:16
    Ayo klik lagi,
  • 7:16 - 7:19
    untuk memastikan segalanya
    berjalan dengan baik.
  • 7:24 - 7:28
    Keren, dan berfungsi, menakjubkan.
  • 7:28 - 7:30
    Sekarang, yang satu ini agak sulit.
  • 7:30 - 7:34
    Saya tunjukkan apa yang terjadi
    jika Anda mengubah urutan.
  • 7:34 - 7:35
    Melakukan sesuatu yang agak berbeda.
  • 7:36 - 7:39
    Bagaimana jika saya menukar keduanya?
  • 7:39 - 7:41
    Nah, mari kita lihat saja.
  • 7:42 - 7:46
    Oke, inilah dia,
    mari kita lihat.
  • 7:46 - 7:48
    Oke, saya tambah beberapa poin.
  • 7:49 - 7:53
    Sekaranglah saatnya,
    tombol Reset.
  • 7:53 - 7:56
    Tidak terjadi apa-apa.
  • 7:56 - 7:59
    Ayo coba klik terus, menarik.
  • 7:59 - 8:01
    Agak sulit memang,
  • 8:01 - 8:05
    tapi skor sebelumnya 19, saya tekan
    tombol reset tidak ada yang berubah.
  • 8:05 - 8:08
    Tapi saat saya tekan free
    throw muncul angka satu.
  • 8:10 - 8:12
    Mari coba sisi satunya,
    jika saya tekan plus dua poin.
  • 8:12 - 8:14
    Oh, muncul angka dua.
  • 8:14 - 8:18
    Mari lihat kode lagi
    untuk melihat sebabnya.
  • 8:18 - 8:21
    Jadi saya menukar
    tampilan dan aturan skor.
  • 8:21 - 8:25
    Hanya untuk melihat kesalahan
    seperti apa yang dapat terjadi.
  • 8:25 - 8:30
    Katakan saja skor TeamA 30 dan
    Skor TeamB 40.
  • 8:30 - 8:33
    Saat saya katakana displayForTeamA
    Akan muncul 30 dan
  • 8:33 - 8:37
    Saat saya katakan displayForTeamB
    akan muncul 40.
  • 8:37 - 8:41
    Hanya setelah itu, akankah benar-benar
    mengatur angka ke nol.
  • 8:41 - 8:46
    Tapi karena ditampilkan pertama maka
    tidak akan menunjukkan angka nol.
  • 8:46 - 8:48
    Tapi variabelnya menjadi nol.
  • 8:48 - 8:53
    Jadi saat saya menekan misalnya
    addThreeForTeamB, maka akan
  • 8:53 - 9:00
    mengambil angka nol yang sudah di atur,
    menambah tiga, lalu menampilkannya.
  • 9:00 - 9:06
    Untuk kita, akan terlihat kalau TeamB
    yang skor sebelumnya 30 kemudian
  • 9:06 - 9:12
    setelah mengeklik tombol reset, skor
    menjadi tiga, lompatan angka yang aneh.
  • 9:12 - 9:15
    Satu cara yang bisa membenarkan selain
    mengembalikan ke semula adalah
  • 9:15 - 9:19
    meletakkan angka nol di sini.
  • 9:19 - 9:22
    Dan Anda bisa mencobanya sendiri,
    tapi ini benar-benar bekerja.
  • 9:22 - 9:24
    Hanya sedikit berlawanan.
  • 9:25 - 9:29
    Saya suka contoh seperti ini karena
    seperti menunjukkan keindahan dan
  • 9:29 - 9:31
    subyektivitas kode.
  • 9:31 - 9:34
    Dalam kasus ini, saya telah berpikir keras
    tentang cara pertama
  • 9:34 - 9:36
    yang saya lakukan itu lebih baik.
  • 9:36 - 9:39
    Tapi Anda akan melihat skenario
    dimana ada dua cara berbeda
  • 9:39 - 9:43
    untuk menulis kode, dan
    keduanya sama-sama benar.
  • 9:43 - 9:45
    Karena tidak ada jawaban
    yang selalu benar,
  • 9:45 - 9:49
    jangan merasa dibatasi untuk
    melakukan dengan cara yang tepat.
  • 9:49 - 9:53
    Cobalah coding sesuatu yang sesuai dengan
    Anda dan tanya pendapat orang lain.
  • 9:53 - 9:58
    Lalu bandingkan, siapa yang lebih efisien,
    dan siapa yang lebih jelas.
  • 9:58 - 10:01
    Diskusi semacam ini merupakan
    pengalaman penting.
  • 10:01 - 10:04
    Oke, saya akan mengembalikan
    kode seperti semula
  • 10:04 - 10:05
    yang berjalan dan
  • 10:05 - 10:10
    sekarang saya punya fungsi aplikasi
    tapi belum terlihat bagus, ayo selesaikan
Cím:
07-42 Add the Reset Button
Leírás:

more » « less
Video Language:
English
Team:
Udacity
Projekt:
UD837 - Android for Beginners
Duration:
10:11

Indonesian subtitles

Felülvizsgálatok