Após algumas semanas sem escrever venho com mais um post interessante sobre desenvolvimento Android, vou falar sobre a utilização de layouts. Antes é importante entender que a programação para desenvolvimento Android trás conceitos de nomes diferentes dos que já estamos acostumados, mas com funcionalidades muito semelhantes. Os controles que conhecemos como objetos visíveis uteis para a interação entre o usuário e o aplicativo no Android são chamados de Views. Como disse no post anterior, as Activities funcionam de modo muito parecido ao que chamamos de forms. Bom estes são dois conceitos fáceis de entender pois são muito parecidos com os que os programadores já conhecem de outras linguagens e tipos de programação.
Além destes há também as View Groups que são extensões das Views que podem conter outras views internamente. A partir do Android 3.0 foram introduzidos também os Fragments que são partes da interface com "vida própria" e que interagem com a Activity.
Neste post vou falar de Layouts que são extensões de View Groups, que por sua vez são extensões de Views.
Os Layouts são utilizados para posicionar as Views dentro da interface visível ao usuário. As classes mais comuns de layout são:
- LinearLayout
- RelativeLayout
- GridLayout
Vamos falar um pouco de cada uma delas com exemplo de código.
LinearLayout
A classe LinearLayout permite que sejam construídas interfaces alinhando controles na orientação horizontal ou vertical. É um tipo de layout muito simples de utilizar, porém limitado e geralmente é utilizado em conjunto com outros tipos de layout. No nosso exemplo teremos 3 botões na horizontal preenchendo completamente a largura da tela do dispositivo. Repare no código que não há nenhum número definindo explicitamente a posição ou largura dos botões.<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<Button
android:id="@+id/btn1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/bt1txt"
android:layout_weight="1"
/>
<Button
android:id="@+id/btn2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="@string/bt2txt"
/>
<Button
android:id="@+id/btn3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="@string/bt3txt"
/>
</LinearLayout>
Repare no resultado:
Vamos as considerações. Se você reparar no código, irá notar que o parametro android:orientation="horizontal" define a orientação do nosso layout. Todos os botões utilizam a largura como fill_parent, que é uma constante que define que a view utilizará a medida do parent para se redimensionar. Pensando assim, teriamos um problema de layout, pois todos os botões ficariam sobrepostos e apenas o último adicionado seria visível. Mas o que acontece aqui? Estamos utilizando uma propriedade muito interessante, o layout_weight que define o "peso" que cada controle tem dentro do layout. Como defini o valor 1 para cada um dos botões, todos eles ficaram um ao lado do outro ocupando a largura da tela.
A propriedade height está definida como wrap_content que define a altura como o tamanho suficiente para caber o conteúdo interno da view.
RelativeLayout
Com o RelativeLayout você pode posicionar suas Views dentro da Activity relacionando com outras Views ou com o seu parent. No nosso exemplo abaixo, estou alinhando os botões de acordo com posições relativas na tela.<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="@string/bt1txt" />
<Button
android:id="@+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="@string/bt2txt" />
<Button
android:id="@+id/btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="@string/bt3txt" />
</RelativeLayout>
GridLayout
O GridLayout é um dos layouts mais flexíveis e com ele podemos alinhar nossos controles utilizando linhas e colunas arbitrárias. Repare que no caso do GridLayout nós utilizamos a propriedade gravity para definir o tamanho dos botões.
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="fill_horizontal"
android:text="@string/bt1txt" />
<Button
android:id="@+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="fill"
android:text="@string/bt2txt" />
<Button
android:id="@+id/btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="fill_horizontal"
android:text="@string/bt3txt" />
</GridLayout>
Todos estes layouts estão no arquivo deste artigo. Eu deixei comentada as linhas que carregam os layouts no arquivo MainActivity.java, você pode descomentá-los para testar. Eu separei os arquivos propositalmente.
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//setContentView(R.layout.linear_layout);
//setContentView(R.layout.relative_layout);
setContentView(R.layout.grid_layout);
}
Abraço