Este é um post disponível para assinantes MVPEste post também está disponível para assinantes da Mobile magazine DIGITAL ou para quem possui Créditos DevMedia. Clique aqui para saber mais!
Artigo WebMobile 27 - Layouts no Android
Construindo interfaces gráficas utilizando XML na plataforma Google
Mobile magazine 27
[Artigo já está disponível no Leitor Digital DevMedia®. Clique aqui para acessá-lo]
> Clique aqui para ler todos os artigos da Mobile magazine 27
[Artigo já está disponível no Leitor Digital DevMedia®. Clique aqui para acessá-lo]
> Clique aqui para ler todos os artigos da Mobile magazine 27
Android
Layouts no Android
Construindo interfaces gráficas utilizando XML na plataforma Google
Um dos grandes diferenciais do Android é a forma como construímos a interface de usuário. No Android ela é montada usando dois tipos de objetos: View e ViewGroup.
A classe View representa os componentes básicos para a criação da UI. View é a classe base para os widgets, que são objetos usados na criação de componentes interativos com o usuário, como botões, caixa de texto, etc. A classe ViewGroup é um tipo especial de view que pode conter outras views (filhos). ViewGroup é a classe base para os layouts, que possibilitam uma série de arquiteturas para a UI, como tabular, linear, etc.
A UI será definida, então, por uma hierarquia de Views e ViewGroups, semelhante a uma árvore (Figura 1).
Figura 1. Hierarquia de Views e ViewGroups
Então, ao definirmos a UI, podemos usar os widgets e layouts disponibilizados pela própria plataforma Android, que resolvem uma série de situações comuns em layouts, como a criação de tabelas, botões, caixas de texto, etc. Porém, nem sempre os widgets e layouts Android são suficientes para a criação de uma UI. Para esses casos, podemos criar views customizadas para atender uma situação específica, como a criação de uma barra de volume na tela.
É importante salientar que cada hierarquia em árvore representa uma tela da aplicação. A forma que definimos essa tela na aplicação é através do método setContentView(), que recebe o nó raiz da árvore. Como cada tela possui apenas uma árvore, não é permitido ter dois elementos raízes na mesma tela.
A maneira mais comum de definir uma UI em Android é através de arquivos XML, entretanto, também é possível definir uma UI diretamente no código Java.
A próxima seção explicará com mais detalhes a criação de uma UI em Android, mostrar como devem ser feitos os arquivos XML e como estes devem ser referenciados no código.
Layout
No Android, o layout é uma extensão da classe ViewGroup, ele irá definir a estrutura da tela e controlar os elementos que estarão visíveis para o usuário. O layout serve como estrutura de uma determinada atividade, ou seja, define a organização e as propriedades da tela, e o modo como os elementos irão se relacionar. Existem duas maneiras para declarar seu layout em Android:
• Declarar os elementos da UI em XML;
• Instanciar os elementos da UI em runtime.
O Android fornece um vocabulário em XML correspondente às classes Views e suas subclasses, ou seja, existe uma estrutura de nomes de classes e métodos que irão fazer a correspondência do código XML com suas respectivas classes e métodos.
Os objetos do tipo View e Viewgroup também podem ser criados pela aplicação em tempo runtime, essa opção é normalmente usada quando queremos modificar dinamicamente o conteúdo de nosso layout. Quando desenvolvemos em Android podemos escolher uma entre essas duas maneiras ou ambas para criarmos a UI da aplicação.
A vantagem de declarar a UI em XML é a possibilidade de poder separar a descrição da interface do código da aplicação, ou seja, podemos realizar modificações na UI sem nos preocuparmos com alterações no código fonte e com recompilação. A separação da UI em XML também permite uma melhor visualização da estrutura de layout, tornando mais fácil localizar e resolver possíveis problemas.
Criando um arquivo de layout em XML
Cada arquivo de layout deve conter apenas um elemento raiz, e a partir dele a hierarquia em árvore é montada com a adição de widgets e objetos de layouts. Após ser criado, o arquivo de layout deve ser salvo com a extensão .xml na pasta res/layout que está presente em todos os projetos em Android. Apenas nessa pasta é que o compilador irá reconhecer os arquivos XML como sendo arquivos de layout, e assim tratá-los da forma adequada.
Após a compilação, os arquivos de layout devem ser carregados na aplicação, ou seja, a interface de usuário deve ser associada à atividade. Isso é feito através do método setContentView(), passando a referência do seu arquivo XML no formato R.layout.nome_do_arquivo.
Objetos de Layout comuns
Como dito anteriormente, as UIs em Android são compostas por diversos layouts. Essa seção irá descrever as características de alguns dos principais layouts existentes, e mostrar pequenas aplicações que irão ajudar a entender melhor o funcionamento desses layouts.
A criação dos arquivos XML é muito simples. Os objetos adicionados na tela são representados por que podem conter objetos do tipo View e ViewGroup. Essas
tags ao serem aninhadas formam a hierarquia do nosso layout.
Todas as tags que serão usadas nos exemplos são apresentadas na Tabela 1.
Objeto Tags Descrição
FrameLayout Cria um layout do tipo FrameLayout.
LinearLayout Cria um layout do tipo LinearLayout.
TableLayout Cria um layout do tipo TableLayout.
AbsoluteLayout Cria um layout do tipo AbsoluteLayout.
RelativeLayout Cria um layout do tipo RelativeLayout.
EditText Exibe uma caixa para entrada de texto.
Button
Layouts no Android
Construindo interfaces gráficas utilizando XML na plataforma Google
Um dos grandes diferenciais do Android é a forma como construímos a interface de usuário. No Android ela é montada usando dois tipos de objetos: View e ViewGroup.
A classe View representa os componentes básicos para a criação da UI. View é a classe base para os widgets, que são objetos usados na criação de componentes interativos com o usuário, como botões, caixa de texto, etc. A classe ViewGroup é um tipo especial de view que pode conter outras views (filhos). ViewGroup é a classe base para os layouts, que possibilitam uma série de arquiteturas para a UI, como tabular, linear, etc.
A UI será definida, então, por uma hierarquia de Views e ViewGroups, semelhante a uma árvore (Figura 1).
Figura 1. Hierarquia de Views e ViewGroups
Então, ao definirmos a UI, podemos usar os widgets e layouts disponibilizados pela própria plataforma Android, que resolvem uma série de situações comuns em layouts, como a criação de tabelas, botões, caixas de texto, etc. Porém, nem sempre os widgets e layouts Android são suficientes para a criação de uma UI. Para esses casos, podemos criar views customizadas para atender uma situação específica, como a criação de uma barra de volume na tela.
É importante salientar que cada hierarquia em árvore representa uma tela da aplicação. A forma que definimos essa tela na aplicação é através do método setContentView(), que recebe o nó raiz da árvore. Como cada tela possui apenas uma árvore, não é permitido ter dois elementos raízes na mesma tela.
A maneira mais comum de definir uma UI em Android é através de arquivos XML, entretanto, também é possível definir uma UI diretamente no código Java.
A próxima seção explicará com mais detalhes a criação de uma UI em Android, mostrar como devem ser feitos os arquivos XML e como estes devem ser referenciados no código.
Layout
No Android, o layout é uma extensão da classe ViewGroup, ele irá definir a estrutura da tela e controlar os elementos que estarão visíveis para o usuário. O layout serve como estrutura de uma determinada atividade, ou seja, define a organização e as propriedades da tela, e o modo como os elementos irão se relacionar. Existem duas maneiras para declarar seu layout em Android:
• Declarar os elementos da UI em XML;
• Instanciar os elementos da UI em runtime.
O Android fornece um vocabulário em XML correspondente às classes Views e suas subclasses, ou seja, existe uma estrutura de nomes de classes e métodos que irão fazer a correspondência do código XML com suas respectivas classes e métodos.
Os objetos do tipo View e Viewgroup também podem ser criados pela aplicação em tempo runtime, essa opção é normalmente usada quando queremos modificar dinamicamente o conteúdo de nosso layout. Quando desenvolvemos em Android podemos escolher uma entre essas duas maneiras ou ambas para criarmos a UI da aplicação.
A vantagem de declarar a UI em XML é a possibilidade de poder separar a descrição da interface do código da aplicação, ou seja, podemos realizar modificações na UI sem nos preocuparmos com alterações no código fonte e com recompilação. A separação da UI em XML também permite uma melhor visualização da estrutura de layout, tornando mais fácil localizar e resolver possíveis problemas.
Criando um arquivo de layout em XML
Cada arquivo de layout deve conter apenas um elemento raiz, e a partir dele a hierarquia em árvore é montada com a adição de widgets e objetos de layouts. Após ser criado, o arquivo de layout deve ser salvo com a extensão .xml na pasta res/layout que está presente em todos os projetos em Android. Apenas nessa pasta é que o compilador irá reconhecer os arquivos XML como sendo arquivos de layout, e assim tratá-los da forma adequada.
Após a compilação, os arquivos de layout devem ser carregados na aplicação, ou seja, a interface de usuário deve ser associada à atividade. Isso é feito através do método setContentView(), passando a referência do seu arquivo XML no formato R.layout.nome_do_arquivo.
Objetos de Layout comuns
Como dito anteriormente, as UIs em Android são compostas por diversos layouts. Essa seção irá descrever as características de alguns dos principais layouts existentes, e mostrar pequenas aplicações que irão ajudar a entender melhor o funcionamento desses layouts.
A criação dos arquivos XML é muito simples. Os objetos adicionados na tela são representados por
Todas as tags que serão usadas nos exemplos são apresentadas na Tabela 1.
Objeto Tags Descrição
FrameLayout
LinearLayout
TableLayout
AbsoluteLayout
RelativeLayout
EditText
Button




0
0
