YouTube

Got a YouTube account?

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

Portuguese, Brazilian subtitles

← LinearLayout

Get Embed Code
13 Languages

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

  1. Vimos como esse layout linear
    contém duas views de texto filhas.
  2. Note que estas cores de fundo
    são apenas uma ferramenta de ensino
  3. para ajudar a perceber que estas duas
    TextView filhas estão dentro deste pai.
  4. Na verdade, o vermelho e o azul
    não vão aparecer no dispositivo,
  5. a menos que você especifique essas cores, como cores de fundo destas views.
  6. Vou mostrar o que eu quero dizer
    no Visualizador de XML.
  7. Se largarmos o código no Visualizador de XML,
  8. é assim que fica no dispositivo.
  9. Primeiro temos um ViewGroup de LinearLayout,
  10. e é transparente porque não tem
    uma cor de fundo definida.
  11. A primeira filha é a TextView
    que diz "Lista de Convidados",
  12. e que aparece no topo aqui.
  13. A segunda filha é uma TextView que diz Kunal,
  14. e aparece sob a primeira TextView.
  15. Agora, se eu copiar esta TextView
    e colá-la abaixo desta,
  16. o que irá acontecer?
  17. É isso aí, temos outro Kunal
    que aparece logo abaixo do primeiro.
  18. Então parece que o padrão é,
    se adicionarmos mais TextViews aqui,
  19. então elas aparecerão,
    uma após a outra, nesta lista.
  20. Vamos olhar para o código mais de perto.
  21. Começa com um sinal de menor, seguido do nome da view, que é LinearLayout.
  22. Depois lista um monte de atributos e,
    então, tem um sinal de maior.
  23. Observe que não há barra porque isto é só
    a tag de abertura do LinearLayout.
  24. A tag de fechamento está bem aqui no fundo,
  25. pois queremos inserir elementos filhos entre a tag de abertura e a tag de fechamento.
  26. Mas, por exemplo, para esta TextView,
    como não contém filhos,
  27. então podemos usar uma tag de auto-fechamento.
  28. O mesmo para esta TextView aqui,
    e para essa TextView aqui.
  29. Quando dizemos que um ViewGroup
    contém views filhas,
  30. então precisamos inseri-las
    entre as tags de abertura e fechamento.
  31. A outra coisa que você pode ter notado é este atributo chamado android:orientation=vertical.
  32. Nós não vimos isso antes,
  33. então vamos ver a documentação do Android,
    como eu mostrei anteriormente.
  34. Vou abrir uma nova janela do navegador,
    e digitar "android orientation".
  35. O primeiro resultado é sobre LinearLayout,
    no site developer.android.com, então clicamos nele.
  36. Como a documentação sobre TextViews
    foi um pouco intimidante,
  37. podemos ignorar a maior parte deste texto.
  38. Apenas precisamos verificar se esta é,
    de fato, a página sobre LinearLayout,
  39. e aí rolamos a página
    e olhamos os atributos XML.
  40. Agora buscamos o atributo
    que é chamado android:orientation.
  41. E olha ele aqui, então vamos
    clicar para ver mais detalhes.
  42. A descrição diz que este atributo
  43. determina se o layout deve ser
    uma coluna ou uma fileira.
  44. O valor deste atributo deve ser
    horizontal para uma fileira,
  45. ou o valor deve ser vertical para uma coluna.
  46. E então lista esses dois valores aqui.
  47. Legal, atualmente nosso código diz que
    o android:orientation é vertical.
  48. Isso explica por que as views
    estão aparecendo em uma coluna.
  49. Agora, para satisfazer a nossa curiosidade, devemos também tentar o outro valor.
  50. Vamos definir a orientação para horizontal
    e ver o que acontece.
  51. Eu vou entrar no código e deletar o valor vertical.
  52. Vou digitar horizontal, e olha só,
    agora as views estão em uma fileira horizontal.
  53. Não sei de você, mas eu não gosto de ler minha lista de convidados na horizontal.
  54. Mas ainda há muitos outros casos úteis
  55. onde você vai querer um layout linear horizontal.
  56. Por exemplo, se você está criando um item de lista,
  57. você pode querer uma imagem no lado esquerdo e uma descrição no lado direito.
  58. Eu vou deixar você experimentar isso de seguida,
  59. mas primeiro quero reforçar
    esta linha adicional de código.
  60. Esta é a instrução namespace XML.
  61. Usamos este namespace para especificar que todos os atributos aqui pertencem ao Android.
  62. Por isso que todos começam com android:
  63. É essencialmente a abreviação desta URL
    específica e exclusiva ao Android.
  64. Você pode criar seus próprios atributos customizados.
  65. Para evitar conflitos de nome,
  66. quando dois atributos têm nomes iguais,
    mas diferentes comportamentos,
  67. sempre adicionamos o prefixo android:
    para indicar que são atributos do Android.
  68. Assim, não esqueça nunca de adicionar
    este namespace XML
  69. na tag de abertura da view raiz
    de seu arquivo XML.
  70. Chegou a sua vez e nós gostaríamos que
    experimentasse com o código do LinearLayout agora.
  71. Tente adicionar mais TextViews
    para que haja mais itens nesta coluna.
  72. Quem você colocaria na lista de convidados
    exclusivos da sua festa?
  73. Também tente alterar o atributo
    de orientação do layout linear.
  74. Lembre que pode ser definido como vertical ou horizontal.