Post on 11-Jun-2015
description
Documentação dos componetes principais de
layout em um projeto Android
SUMÁRIO
1. Componentes Principais ............................................................................................................... 3
2. LinearLayout ................................................................................................................................. 4
3. TextView ....................................................................................................................................... 4
4. Button ........................................................................................................................................... 5
5. Toast .............................................................................................................................................. 6
6. AutoComplete ............................................................................................................................... 8
7. CheckBox ..................................................................................................................................... 9
8. Toggle Button ............................................................................................................................. 10
9. Radio Button ............................................................................................................................... 10
10. Referências .............................................................................................................................. 12
1. Componentes Principais
Existem diversos componetes de layout para o desenvolvimeto android, dentre os quais
podemos destacar:
LinearLayout;
TextView;
Button;
Toast;
AutoComplete;
ToggleButton;
RadioButton;
CheckBox;
Nesse sentido iremos especificar cada um dos itens citados acima.
Abaixo algumas propriedades dos componentes android:
android:id: É o identificador do componente, que usaremos para chamá-lo de outro lugar.
android:layout_width: É onde você define como será a largura. Para preencher a tela inteira
você deverá usar fill_parent, caso deseja que ele se adapte ao tamanho do conteúdo, utilize
wrap_content.
android:layout_height: Similar ao android:layout_width, porém, você vai ajustar a altura do
componente, seguindo o mesmo conceito.
android:text: É a propriedade que corresponde ao texto que deverá ser exibido no
componente.
android:src: É usada para localizar a imagem que irá ser carregada no botão.
style: Local onde você define qual será o estilo do botão, no nosso caso, definimos que seria
como uma estrela.
android:orientation: Onde definimos no RadioGroup, como será distribuídos os
RadioButtons, verticalmente ou horizontalmente.
android:layout_gravity: Define a posição em que o layout será exibido, são elas: top,
bottom, left, right, center-vertical, fill-vertical, center-horizontal, fill-horizontal, center,
fill.
2. LinearLayout
Atualmente existem duas variações do LinearLayout, que são:
Horizontal: Todos os widgets adicionados dentro desse layout são colocados um do lado do
outro.
Vertical: Todos os widgets adicionados dentro desse layout são colocados um abaixo do outro.
Dentro de um LinearLayout podemos acrescentar vários widgets, como:
o Button;
o TextView;
o CheckBox;
Assim como também pode conter outro LinearLayout.
Exemplo básico de um LinearLayout:
<?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="vertical" >
</LinearLayout>
fill_parent: A largura da view será igual a largura disponível no pai.
wrap_content: A largura será igual a largura do conteúdo da view. Na API nível 8, foi
rebatizada para match_parent.
3. TextView
Exibe o texto para o usuário e, opcionalmente, permite a ele editá-lo. A TextView é um editor
de texto completo, no entanto a classe básica está configurado para não permitir a edição e sim a
vizualização. O componente para a edição é EditText.
TextView no XML:
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/textView"
android:layout_width="fill_parent"
android:layout_height="54dp"
android:text="Olá" />
TextView no emulador:
4. Button
Representa um botão que pode ser clicado pelo usuário para executar uma ação.
Exemplo de um Button na XML:
<Button
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Clique" />
Exemplo de um Button sendo executado no emulador:
5. Toast
Um objeto Toast (do pacote android.widget) nos oferece uma forma de exibir uma pequena e
rápida mensagem aos usuários das aplicações Android. A mensagem exibida aparecerá como uma
view flutuante sobre a tela atual da aplicação e não receberá foco. O objetivo é alertar o usuário sobre
o sucesso ou fracasso de alguma atividade, aguardar alguns segundos e fazer a mensagem
desaparecer. Não aceita qualquer tipo de interação com o usuário, como um botão para ser clicado, e
seu tamanho é definido pela quantidade de espaço necessário para a mensagem.
Exemplo de um Toast, breve mensagem quando botão é clicado:
Activity;
package com.cunha.ifc;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
public class ToastActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
Button button = (Button) findViewById(R.id.btn);
button.setOnClickListener(new View.OnClickListener(){
public void onClick(View v) {
Toast.makeText(ToastActivity.this,
"Bem-vindo à minha aplicação Android",
Toast.LENGTH_SHORT).show();
}
});
}
}
Arquivo XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/textView"
android:layout_width="fill_parent"
android:layout_height="54dp"
android:text="@string/hello" />
<Button
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Clique" />
</LinearLayout>
Botão quando clicado:
6. AutoComplete
Uma visão de texto editável que mostra sugestões de conclusão automaticamente enquanto o
usuário está digitando. A lista de sugestões é exibida em um menu drop-down a partir do qual o
usuário pode escolher um item para substituir o conteúdo da caixa de edição que está digitando.
A lista de sugestões é obtido a partir de um adaptador de dados e aparece apenas depois de um
determinado número de caracteres definidos por “the threshold”.
O trecho de código a seguir mostra como criar uma exibição de texto que sugere vários nomes
de países, enquanto o usuário está digitando:
public class CountriesActivity extends Activity {
protected void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.paises);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_dropdown_item_1line, PAISES);
AutoCompleteTextView textView = (AutoCompleteTextView)
findViewById(R.id.countries_list);
textView.setAdapter(adapter);
}
private static final String[] PAISES = new String[] {
"Brasil", "França", "Italia", "Alemanha", "Inglaterra"
};
}
7. CheckBox
Um CheckBox é um campo de seleção que pode ser tanto marcada como desmarcada.
CheckBox no XML:
<CheckBox2 android:id="@+id/checkBox1"
android:layout_width="230dp"
android:layout_height="wrap_content"
android:text="Primeira Opção" />
<CheckBox
android:id="@+id/checkBox2"
android:layout_width="230dp"
android:layout_height="wrap_content"
android:text="Segunda Opção" />
<CheckBox
android:id="@+id/checkBox3"
android:layout_width="230dp"2
android:layout_height="wrap_content"
android:text="Terceira Opção" />
8. Toggle Button
Exibe um botão com um indicador de luz, com estados de marcado e desmarcado, sendo o
texto ON ou OFF. Alguns atributos do ToggleButton no XML:
1. android: textOff: Texto que aparece no botão quando ele não estiver marcado (OFF).
2. android: textOn: Texto que aparece no botão quando ele estiver marcado (ON);
<ToggleButton
android:id="@+id/toggleButton1"
android:layout_width="118dp"
android:layout_height="wrap_content"
android:text="ToggleButton" />
9. Radio Button
É um botão de opção semelhante ao CheckBox, mas com a diferença de poder selecionar
somente uma dessas opções, enquanto em um CheckBox pode-se marcar mais de uma opção.
RadioButton no XML:
<RadioButton
android:id="@+id/radioButton1"
android:layout_width="230dp"
android:layout_height="wrap_content"
android:text="Primeira Opção" />
<RadioButton
android:id="@+id/radioButton2"
android:layout_width="230dp"
android:layout_height="wrap_content"
android:text="Segunda Opção" />
<RadioButton
android:id="@+id/radioButton3"
android:layout_width="230dp"
android:layout_height="wrap_content"
android:text="Terceira Opção" />
10. Referências
http://developer.android.com/resources/tutorials/views/hello-linearlayout.html
http://developer.android.com/reference/android/widget/ToggleButton.html
http://developer.android.com/reference/android/widget/CheckBox.html
http://devmobilebrasil.com.br/android/checkbox-android/
http://devmobilebrasil.com.br/android/toggle-button-no-android/
http://devmobilebrasil.com.br/android/trabalhando-com-a-radiobutton-no-android/
http://developer.android.com/reference/android/widget/TextView.html
http://developer.android.com/reference/android/widget/Button.html
http://developer.android.com/reference/android/widget/Toast.html
http://developer.android.com/reference/android/widget/AutoCompleteTextView.html
http://developer.android.com/resources/tutorials/views/hello-formstuff.html