quarta-feira, setembro 26, 2012

Desenvolvendo para Android: Layout das Activities

Como vimos na parte anterior, tipicamente as telas da nossa aplicação correspondem a uma classe derivada de Activity. Uma tarefa importante desta classe é apresentar o conteúdo da tela. Embora isto possa ser feito totalmente por código, o mais comum é usarmos um arquivo de layout.

Os arquivos de layout são arquivos XML escrito com um vocabulário próprio do Android. Cada elemento especifica uma View, algumas Views são usadas apenas para controlar o posicionamento das demais (XxxxxLayout) e outras correspondem a widgets (um elemento da interface com operador, o que em outros ambientes costuma ser chamado de "controle").

Num primeiro momento tudo isto pode parecer confuso e o posicionamento dos elementos totalmente misterioso. A forma que encontrei para entender o layout é considerar que estamos arrumando caixas dentro de caixas. Cada caixa é uma View.

Você controla de forma independente a largura (layout_width) e altura (layout_height) de cada caixa. Existem três opções:
  • Um tamanho fixo
  • fill_parent (renomeado nas versões mais novas para match_parent): a caixa ocupará todo o espaço da caixa onde está contida
  • wrap_content: a caixa ocupará apenas o espaço necessário para conter o que estiver dentro
No caso do tamanho fixo, existem cinco unidades disponíveis: pixels (px), milímetros (mm), polegadas (in), proporcional ao tamanho do fonte usado (sp) ou independente da densidade (dp ou dip). É fortemente recomendado usar dp para as dimensões "serem automaticamente acertadas conforme o tamanho da tela". Na verdade o dp pode te deixar na mão, por exemplo se você passar a sua aplicação de um Galaxy Tab de 7" com Android 2.2 para outro com Android 3.2.verá que tudo fica bem menor, apesar de você usar dp (tem um explicação não muito explicativa aqui).

Além do tamanho, podemos especificar margens (espaço vazio fora da caixa) e paddings (espaço vazio dentro da caixa). Por exemplo, se você especificar uma View com largura 100dp, margens direita e esquerda de 10dp e paddings direito e esquerdo de 3dp, esta View vai ocupar uma largura de 120dp na caixa onde está contida e terá 94dp para o que estiver dentro dela.


Os tipos mais usados de layout são o linear e relativo. O linear vem em dois modelos:
  • horizontal: as caixas vão sendo colocadas uma do lado da outra
  • vertical: as caixas vão sendo colocadas uma em cima da outra
No layout relativo você dá "pistas" da posição relativa das caixas. Por exemplo, você pode dizer que uma caixa está embaixo ou a direita de outra ou que está alinhada a outra por uma das bordas. Se as suas "pistas" forem muito vagas, pode ocorrer do elemento não ficar onde você esperava.

Normalmente você vai ter que colocar layouts dentro de layouts para obter o posicionamento desejado. Cuidado somente para não exagerar e colocar layouts desnecessários. O ambiente de desenvolvimento roda um verificador (lint) que avisa quando detecta algumas más práticas:
  • layouts desnecessários
  • textos colocados diretamente no arquivo de layout (o recomendado é usar @string/nome e definir nome em strings.xml)
  • cores colocadas diretamente no arquivo de layout (o recomendado é usar @color/nome e definir nome em colors.xml)

Nenhum comentário: