YouTube

Got a YouTube account?

New: enable viewer-created translations and captions on your YouTube channel!

Indonesian subtitles

← 02-12 Fixing_Overdraw_with_Canvas_API

02-12 Fixing_Overdraw_with_Canvas_API

Get Embed Code
13 Languages

Showing Revision 3 created 01/19/2016 by QA_SP_3_IND.

  1. Baik, kita kembali ke Android Studio,
  2. meninjau sumber untuk
    DroidCardsView kami.
  3. Sekali lagi, inilah tampilan khusus kami.
  4. Sebagai pengingat, di tampilan khusus ini
    kami membuat kartu permainan bertumpuk.
  5. Contohnya,
    setiap kartu punya bitmap sendiri, dan
  6. kita menariknya ke layar dengan
    mengesampingkan metode OnDraw.
  7. Ingat, dengan
    mengesampingkan metode onDraw,
  8. Android tidak akan dapat mengoptimalkan
    render tampilan ini, sehingga
  9. itu tugas kami sebagai pengembang
    untuk menjepit setiap kartu dengan benar
  10. seperti ketika ditarik ke layar untuk
    menghindari overdraw yang tidak perlu.
  11. Untungnya, Canvas API memberi kita
    metode tepat yang diperlukan untuk
  12. menarik kartu dengan lebih efisien.
  13. Mari kita lihat dokumentasi.
  14. Mari kita gunakan metode canvas.clipRect
    untuk meningkatkan kode kita.
  15. Kita akan menggunakan varian di sini,
    mengambil empat apungan sebagai parameter.
  16. Baiklah,
    kita kembali ke Android Studio.
  17. Kita lihat cara menarik setiap tumpukan
    kartu sehingga mengurangi overdraw ini.
  18. Saya akan menggunakan fitur bagus ini
    dalam Android Studio untuk membuka
  19. tampilan diff, sehingga Anda dapat melihat
    kondisi sebelum dan sesudah kode.
  20. Oke, sekarang kita ada di tampilan
    perbandingan, dan mari kita lihat
  21. khususnya pada metode onDraw,
    yang kita kesampingkan.
  22. Terdapat kondisi lama untuk
    loop di sini di sebelah kiri,
  23. tapi mari kita fokus pada perbaikan
    yang akan kita buat di kanan.
  24. Sekarang, karena kita
    membolak-balik kartu,
  25. mari kita bahas setiap
    langkah peningkatan.
  26. Pertama, kita akan
    menghitung bagian kartu.
  27. Kita harus mengaktifkan
    fungsi canvas.save ini,
  28. yang akan menyimpan
    keberadaan keadaan kanvas.
  29. Dengan kata lain,
  30. mempertahankan kondisi pada layar
    Anda sebelum kita menerapkan clipRect API.
  31. Kini, saat kita munculkan
    metode clipRect ini,
  32. pada dasarnya kita melakukan
    beberapa pembatasan geometris.
  33. Saat kita melewati parameter ini,
    pada dasarnya kita membicarakan sistem
  34. untuk menggambar pembagian kartu
    yang ingin kita tunjukkan.
  35. Yang jelas, sisanya akan disembunyikan.
  36. Kini, hanya bagian kartu yang terletak
    dalam ikatan pembatasan
  37. yang kita buat yang akan ditarik.
  38. Akhirnya, kita akan
    memunculkan canvas.restore,
  39. yang akan mengembalikan kanvas
    ke kondisi tidak dijepit.
  40. Dengan kata lain,
  41. ini akan membatalkan pembatasan yang kita
    terapkan saat memunculkan clipRect.
  42. Lalu, kita ulangi loop ini untuk semua
    kartu, keculi kartu yang paling atas.
  43. Sekarang, kita akan
    memproses kartu teratas
  44. dan terakhir secara terpisah, dari
    kartu yang mendasarinya.
  45. Untuk yang satu ini, tidak perlu dijepit,
  46. jadi kita akan melanjutkan dan
    menariknya secara keseluruhan.
  47. Anda dapat melihatnya pada
    pernyataan di sini.
  48. Kalau begitu,
    mari kita buat kode yang ditingkatkan dan
  49. lihat jika kita telah mengurangi
    serangkaian overdraw.
  50. Menakjubkan sekali.
  51. Seperti yang terlihat,
    overdraw berkurang.
  52. Kini, saya harap sudah jelas bahwa dengan
    Canvas API, kita punya cara sederhana
  53. untuk menarik secara efisien ketika
    bekerja dengan tampilan khusus.
  54. Oh iya, ketika Anda ingin
    mengeksplorasi Canvas API lagi,
  55. pastikan Anda memeriksa dokumentasi
    di catatan instruktur.
  56. Sekarang, tampilan seperti ini akan
    membantu kita untuk membuat UX yang unik
  57. dan rumit, namun ingat bahwa
    kita harus mengerti sistem
  58. untuk membantu Android merender tampilan
    tersebut dalam mode berkualitas tinggi.
  59. Jadi, kapan pun Anda membuat tampilan
    khusus, periksa overdraw, dan
  60. bersiaplah untuk memulihkan kembali
    teman Anda, metode clipRect.
  61. Baiklah, kerja yang menakjubkan.
  62. Mari kita kembali ke Colt untuk
    mengetahui kebijakan perf lebih lanjut.