O Android possui duas formas para exibir mensagens para o usuário, uma através de mensagens simples de texto que são exibidas de forma temporizada, e outra através de telas de mensagens utilizando o componente AlertDialog, que pode ser customizado para exibir por exemplo, caixas de texto, barra de progresso, lista de itens entre outros componentes.
Este post detalha como criar uma tela de mensagem utilizando o AlertDialog customizado no formato de uma tela de login, com caixas de texto para inserir o nome de usuário e a senha. A tela de login vai ser apresentada como ilustrado na figura abaixo.
Para exibir o AlertDialog com uma tela customizada é necessário criar a tela com as caixas de texto para o nome do usuário e a senha. Os botões Ok e Cancelar são configurados programaticamente no momento da configuração do AlertDialog. A Listagem 1 mostra o arquivo Xml com o layout da tela de login.
Listagem 1
<?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" > <EditText android:id="@+id/textUsuario" android:layout_width="wrap_content" android:layout_height="wrap_content" android:hint="Digite o usuário"> <requestFocus /> </EditText> <EditText android:id="@+id/textSenha" android:layout_width="wrap_content" android:layout_height="wrap_content" android:hint="Digite a senha"> </EditText> </LinearLayout>
Para criar o AlertDialog foi criada a classe LoginFragment que herda da classe DialogFragment. No método onCreateDialog(Bundle) foi feita toda a configuração do AlertDialog, conforme mostrado na Listagem 2.
Listagem 2
public class LoginFragment extends DialogFragment { private EditText editSenha; private EditText editUsuario; @Override public Dialog onCreateDialog(Bundle savedInstanceState) { // Cria o objeto para configurar o AlertDialog AlertDialog.Builder builder = new AlertDialog.Builder(getActivity()); // Define o layout do AlertDialog LayoutInflater inflater = getActivity().getLayoutInflater(); View dialogView = inflater.inflate(R.layout.login, null); builder.setView(dialogView); // Título do AlertDialog builder.setTitle("Login"); // Define os campos de usuário e senha editSenha = (EditText)dialogView.findViewById(R.id.textSenha); editUsuario = (EditText)dialogView.findViewById(R.id.textUsuario); // Configura o botão de Ok builder.setPositiveButton("Ok", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { // Se digitada a senha 1234 informa que a // senha está correta if(editSenha.getText().toString().equals("1234")){ Toast.makeText(getActivity(), "Senha correta", Toast.LENGTH_SHORT).show(); } else { Toast.makeText(getActivity(), "Senha incorreta", Toast.LENGTH_SHORT).show(); } } }); // Configura o botão de Cancelar builder.setNegativeButton("Cancelar", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { // Fecha o AlertDialog dismiss(); } }); // Cria o objeto AlertDialog return builder.create(); } }Para exibir a Tela de Login foi criado o método exibirAlertDialog() que será chamado quando o botão Exibir AlertDialog for clicado, conforme mostrado na Listagem 3.
Listagem 3
private void exibirAlertDialog(){ DialogFragment login = new LoginFragment(); login.show(getFragmentManager(), "login"); }
O método exibirAlertDialog() deve ser inserido no método onClick(View) do botão Exibir AlertDialog.
Quando o botão Exibir AlertDialog for clicado a Tela de Login será exibida. O usuário deve então digitar o nome de usuário e a senha 1234 para que seja exibida a mensagem “Senha correta”.
