YouTube

Got a YouTube account?

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

Portuguese, Brazilian subtitles

← Width and Height

Get Embed Code
14 Languages

Showing Revision 1 created 10/21/2015 by sp2.

  1. Estamos fazendo a
    lista de convidados da festa.
  2. Esta é a lista de convidados para
    a festa de aniversário?
  3. - Certo, Katherine?
    - Sim.
  4. Espero que eu esteja nesta lista.
  5. Bem, precisamos ver isso.
  6. Puxa, eu me sinto bem pequeno agora.
  7. Bem, falando sobre pequeno,
  8. Vamos falar sobre tamanho
    de views em uma tela.
  9. Nós usámos a altura escrita fixa.
  10. - Que é o dp, certo?
    - Sim, a largura e a altura.
  11. - Muito bem.
    - E poderíamos também
  12. definir wrap_content na view.
  13. Que é uma forma estranha de dizer
  14. que a view irá se modelar
    em torno do conteúdo.
  15. O conteúdo cresce,
    a view também cresce.
  16. O conteúdo diminui,
    a view....
  17. Sim, tem também um terceiro,
    chamado de match_parent.
  18. Isso soa um pouco estranho.
  19. Soa a site amoroso para pais solteiros.
  20. Não é bem assim.
  21. match_parent significa que a view será
    tão larga ou tão alta quanto o pai.
  22. Isso faz sentido.
  23. Eu sou uma view, tenho um pai,
  24. e minha largura e altura
    serão como as de meu pai.
  25. - Ok.
    - Exato, resumindo,
  26. os diferentes valores que pode definir
    no tamanho de uma view são:
  27. dp fixo para a largura e altura.
  28. - Correto.
    - Também pode usar wrap_content.
  29. E o próximo que nós vamos
    experimentar... match_parent.
  30. Aqui estão alguns exemplos de como
    views filhas de diferentes larguras
  31. em um LinearLayout podem afetar a UI final.
  32. Neste exemplo, definimos cada view filha
    para ter uma largura fixa de 200 dp.
  33. Se o conteúdo de cada view
    for maior que 200 dp,
  34. então você corre risco de cortar
    algum conteúdo como este.
  35. Neste exemplo, definimos a largura de cada
    view filha para wrap_content.
  36. Agora todo o conteúdo é mostrado,
  37. mas a largura de cada view realmente varia
    conforme o conteúdo de cada uma.
  38. Neste exemplo, definimos a largura de cada
    view filha para match_parent.
  39. Agora pode ver que a largura de cada filha
    é tão larga quanto o ViewGroup pai,
  40. independentemente de seu conteúdo.
  41. Esses mesmos valores também podem
    ser aplicados à altura de cada view.
  42. Neste exemplo, definimos a altura
    da TextView filha para 200 dp.
  43. Se o conteúdo for mais alto que isso,
  44. então corre risco de cortar
    parte do conteúdo.
  45. Neste exemplo, definimos a altura
    da TextView filha para wrap_content.
  46. Desse modo, todo o conteúdo
    será exibido na tela
  47. e nada será cortado porque o tamanho da TextView
  48. é dependente de seu conteúdo.
  49. Neste exemplo, definimos a altura da
    TextView filha para ser match_parent.
  50. Desse modo, a view filha será
    tão alta quanto o pai,
  51. independentemente de seu conteúdo.
  52. Vamos abrir agora o visualizador XML
  53. e entar ser mais como nossos pais, no código.
  54. Estamos fornecendo um link para o
    visualizador XML e algum código inicial
  55. nas notas do instrutor abaixo.
  56. Neste caso, o LinearLayout é a view raiz
  57. porque é a primeira view e a mais exterior.
  58. Se definirmos a largura e a altura
    desta view raiz como match_parent,
  59. e definirmos este como o principal
    layout do nosso app,
  60. então o LinearLayout aqui será tão alto e
    largo quanto a tela do dispositivo.
  61. Posso mostrar isso definindo
    o fundo do LinearLayout
  62. para uma cor não transparente.
  63. Se eu definir a cor cinza para
    o fundo deste LinearLayout
  64. então poderá ver como a cor cinza se estende
    a toda a largura e altura do dispositivo.
  65. O que acontece se eu
    tentar mudar a largura e altura
  66. destas TextViews para match_parent?
  67. Para deixar clara a delimitação de cada view,
  68. Vou definir uma cor de fundo
    para cada uma das views.
  69. Agora vou mudar a altura desta
    TextView para ser match_parent.
  70. A propósito, escreve-se "match_parent".
  71. Agora você pode ver que esta
    TextView ocupa toda a altura do pai.
  72. Infelizmente empurra tudo o resto
    para fora da tela,
  73. e realmente nós não queremos isso.
  74. Então vamos mudar de volta para wrap_content.
  75. Feito, agora vamos mudar a largura para
    match_parent e ver o que faz.
  76. Agora a TextView é tão larga quanto o pai,
  77. que, por sua vez, é tão largo
    quanto a tela do dispositivo.
  78. Se eu também mudar as outras
    TextViews para match_parent,
  79. pode ver que também começam
    a ocupar toda a largura do pai.
  80. Gostaria de fazer mais uma observação.
  81. Cada vez que você vê um atributo
    que comece por layout_,
  82. como layout_height ou layout_width,
  83. na verdade está vendo parâmetros
    de layout de ViewGroups.
  84. Estes são usados pelo ViewGroup pai para
    determinar o tamanho e a posição destas views.
  85. Enquanto isso, os outros atributos como
    fundo, tamanho de texto, texto,
  86. são tratados pela TextView
    para estilizar sua própria view.
  87. Mas estes parâmetros de layout
    do ViewGroup são tratados pelo pai.
  88. Agora é sua vez de tentar
    outros valores de largura e altura.
  89. Para o link do visualizador XML
    com código inicial,
  90. ver as notas do instrutor abaixo.
  91. Tente mudar a largura e
    altura de cada TextView.
  92. Pode definir um valor dp fixo,
    wrap_content ou match_parent.
  93. Os valores de largura e altura não
    precisam ser iguais para cada view,
  94. Quando terminar,
    marque esta caixa para continuar.