Portuguese, Brazilian subtitles

← 02-12 Fixing_Overdraw_with_Canvas_API

02-12 Fixing_Overdraw_with_Canvas_API

Get Embed Code
13 Languages

Showing Revision 6 created 02/13/2016 by QA_SP_6_PT_BR.

  1. Tudo bem, então
    aqui estamos de volta no Android Studio,
  2. revisando a origem para
    nosso DroidCardsView.
  3. De novo, esta é nossa vista customizada.
  4. Apenas para relembrar, foi aqui
    que construímos nossa pilha de cartas.
  5. Por exemplo,
    cada carta tem seu bitmap, e
  6. nós as desenhamos na tela
    alterando o método onDraw.
  7. Agora, lembre,
    alterar o método onDraw,
  8. o Android não irá conseguir otimizar
    a renderização desta vista, então
  9. é nosso trabalho como desenvolvedores
    recortar apropriadamente cada carta
  10. como é desenhada na tela, para
    evitar o overdraw desnecessário.
  11. Felizmente, a API Canvas nos dá os
    métodos corretos para desenhar
  12. nossas cartas mais eficientemente.
  13. Vamos dar uma olhada na documentação.
  14. Vamos usar o método canvas.clipRect
    para melhorar nosso código.
  15. Vamo usar esta variante aqui
    que recebe quatro floats como parâmetros.
  16. Tudo bem,
    agora estamos de volta no Android Studio.
  17. Vamos ajustar como desenhamos cada cascata
    de cartas para reduzir este overdraw.
  18. Vou usar este recurso bacana
    no Android Studio para trazer o diff view
  19. para você ver o estado
    antes e depois do código.
  20. Beleza, aqui estamos em nosso
    comparison view, e vamos olhar
  21. particularmente para o método onDraw,
    que é aquele que estamos alterando.
  22. Temos o velho estado do ciclo for
    aqui na esquerda,
  23. mas vamos focar aqui nos melhoramentos
    que vamos fazer na direita.
  24. Conforme passamos pelas cartas,
    vamos ver cada passo de melhoramento.
  25. Número um, primeiro vamos
    calcular a posição da carta.
  26. De seguida, precisamos chamar esta
    função canvas.save,
  27. que vai salvar nosso
    estado existente da tela.
  28. Em outras palavras,
  29. ela mantém o estado existente de sua
    tela antes de aplicar o API clipRect.
  30. Agora, quando chamamos
    este método clipRect,
  31. nós basicamente estamos fazendo algumas
    restrições geométricas.
  32. Quando passamos por estes parâmetros,
    dizemos basicamente ao sistema
  33. para apenas desenhar uma porção da carta
    que nós queremos que seja visível.
  34. Obviamente, o resto
    estaria escondido.
  35. Agora, apenas as partes da carta
    que estão dentro dos limites
  36. da restrição que definimos,
    serão desenhadas.
  37. Finalmente, vamos chamar a
    canvas.restore,
  38. que vai reverter a tela
    para um estado de non-clipping.
  39. Em outras palavras,
    ele vai desfazer as restrições
  40. que nós fizemos quando
    chamamos o clipRect.
  41. E em seguida, repetimos este loop para
    todas as cartas exceto a de cima.
  42. Especificamente, nós processamos
    a carta de topo
  43. ou a última carta de forma diferente
    das suas semelhantes subjacentes.
  44. Para esta, não é preciso recortar,
  45. por isso vamos avançar e
    desenhar ela completamente.
  46. Você pode ver isso
    por esta afirmação aqui.
  47. Tudo bem,
    vamos construir o código melhorado e
  48. ver se reduzimos
    um monte de overdraw.
  49. Legal, impressionante.
  50. Como você pode ver aqui,
    muito menos overdraw.
  51. Espero que seja claro que com o
    API Canvas, nós temos uma simples
  52. maneira de desenhar com eficiência
    quando trabalhamos com custom views.
  53. Ah, e caso você queira
    explorar a API Canvas mais um pouco,
  54. Certifique-se de revisar a documentação
    completa nas notas do instrutor.
  55. Agora, vistas como estas são ótimas
    para nos ajudar a criar uma UX única
  56. e atraente, mas
    se lembre que devemos lembrar o sistema
  57. e ajudar o Android a renderizar essas
    views com bom desempenho.
  58. Então, quando criar uma custom view
    se certifique de verificar o overdraw, e
  59. esteja pronto para reavivar seu amigo,
    método clipRect.
  60. Tudo bem, excelente trabalho.
  61. Vamos voltar para o Colt para
    mais sabedoria de desempenho.