Cursos / Informática para Internet / Dispositivos Móveis / Aula

arrow_back Aula 05 - Interfaces Gráficas II

Buttons

O Button é o componente que representa um botão textual no Android. Diversos atributos podem ser configurados em um botão, mas aqui comentaremos apenas os principais, que tornam possível a criação de um botão simples e funcional. Vejamos a Listagem 6, demonstrado a declaração dos dois botões utilizados na nossa tela de login.

x
1
<?xml version="1.0" encoding="utf-8"?>
2
<RelativeLayout
3
    xmlns:android="http://schemas.android.com/apk/res/android"
4
    android:id="@+id/RelativeLayout1"
5
    android:layout_width="fill_parent"
6
    android:layout_height="fill_parent"
7
    android:background="#007">
8
9
    <TextView
10
        android:id="@+id/welcome_msg"
11
        android:layout_width="wrap_content"
12
        android:layout_height="wrap_content"
13
        android:layout_alignParentTop="true"
14
        android:layout_centerHorizontal="true"
15
        android:layout_marginTop="15dip"
16
        android:gravity="center"
17
        android:text="Olá! Por favor, insira seu login e senha"
18
        android:textSize="20sp"
19
        android:textStyle="bold"
20
    android:textColor="#FFF" />
21
22
    <EditText
23
        android:id="@+id/login_text"
24
        android:layout_width="wrap_content"
25
        android:layout_height="wrap_content"
26
        android:layout_alignParentLeft="true"
27
        android:layout_alignParentRight="true"
28
        android:layout_below="@+id/welcome_msg"
29
        android:layout_marginTop="50dp"
30
        android:hint="Login"
31
        android:maxLines="1" >
32
    </EditText>
33
34
    <EditText
35
        android:id="@+id/pass_text"
36
        android:layout_width="wrap_content"
37
        android:layout_height="wrap_content"
38
        android:layout_alignParentLeft="true"
39
        android:layout_alignParentRight="true"
40
        android:layout_below="@+id/login_text"
41
        android:layout_marginTop="30dp"
42
        android:hint="Senha"
43
        android:inputType="textPassword"
44
        android:maxLines="1"
45
        android:longClickable="false" />
46
47
    <Button
48
        android:id="@+id/confirmar"
49
        android:layout_width="wrap_content"
50
        android:layout_height="wrap_content"
51
        android:layout_alignParentLeft="true"
52
        android:layout_below="@+id/pass_text"
53
        android:text="Confirmar" />
54
55
56
    <Button
57
        android:id="@+id/limpar"
58
        android:layout_width="wrap_content"
59
        android:layout_height="wrap_content"
60
        android:layout_alignParentRight="true"
61
        android:layout_below="@+id/pass_text"
62
        android:text="Limpar" />
63
</RelativeLayout>
Listagem 6 - Declaração dos botões do layout

Apenas com os atributos que já estudamos anteriormente, é possível criar os botões que precisamos para tornar a nossa tela de login funcional. O principal ponto em relação aos botões não é a declaração deles no XML, mas sim a programação e tratamento dos cliques na Activity, afinal, é isso que os torna funcionais. Vejamos, então, na Listagem 7, a implementação do comportamento dos botões em nossa Activity. O botão Confirmar irá indicar sucesso apenas se o usuário e a senha digitados forem iguais a “aluno”. Já o botão limpar vai, simplesmente, limpar o valor dos campos.

48
1
package br.ufrn.imd.aula05f;
2
3
import android.app.Activity;
4
import android.os.Bundle;
5
import android.view.View;
6
import android.widget.Button;
7
import android.widget.EditText;
8
9
public class Aula05Activity extends Activity {
10
    @Override
11
    protected void onCreate(Bundle savedInstanceState) {
12
        super.onCreate(savedInstanceState);
13
        setContentView(R.layout.activity_main);
14
15
        Button confirmar = (Button) findViewById (R.id.confirmar);
16
        Button limpar = (Button) findViewById (R.id.limpar);
17
18
        final EditText login = (EditText) findViewById(R.id.login_text);
19
        final EditText senha = (EditText) findViewById(R.id.pass_text);
20
21
        confirmar.setOnClickListener(new View.OnClickListener() {
22
23
            @Override
24
            public void onClick(View v) {
25
                String loginStr = login.getText().toString();
26
                String senhaStr = senha.getText().toString();
27
                if (loginStr != null && loginStr.equals("aluno")) {
28
                    if (senhaStr != null && senhaStr.equals("aluno")) {
29
                        //Sucesso
30
                    } else {
31
                        //Falha senha
32
                    }
33
                } else {
34
                    //Falha login
35
                }
36
            }
37
        });
38
39
        limpar.setOnClickListener(new View.OnClickListener() {
40
41
            @Override
42
            public void onClick(View v) {
43
                login.setText("");
44
                senha.setText("");
45
            }
46
        });
47
    }
48
}
Listagem 7 - Implementando o comportamento dos botões

Como se pode ver na Listagem 7, para implementar o comportamento dos botões após um clique, é necessário, primeiramente, referenciar os componentes Button no código Java por meio do método findViewById, utilizando o ID configurado no XML de layout. Uma vez que tenhamos a referência desses botões, é possível configurar o onClickListener deles para executar alguma ação que queiramos. Como precisaríamos dos valores dos EditTexts para tomarmos as decisões após o clique no botão de confirmar, utilizamos novamente o método findViewById para encontrar e referenciar os componentes e, então, utilizando o método getText(), podemos pegar o valor contido no campo do EditText e, após convertê-lo para string utilizando o toString(), verificá-lo.

Agora que já temos uma tela capaz de simular um login, vamos adicionar uma imagem que possa representar o sucesso ou não do login para que o usuário tenha uma resposta após clicar no botão Confirmar. Em outras aulas, estudaremos a comunicação entre Activities e poderemos, então, passar para outra Activity, caso o login esteja correto.

Versão 5.3 - Todos os Direitos reservados