Android - Criando uma tela de Pesquisa de dados

Neste mês continuarei a falar do Android junto com o Banco de Dados SQLite. A ideia deste artigo é de aproveitar um pouquinho do que foi aprendido nos meses anteriores, para isto vou criar uma tela para pesquisa de dados. Todo sistema, o ideal, neste caso seria criar uma tela de pesquisa padrão. Este artigo tem o intuito de dar as coordenadas para criação da mesma. Para isto usaremos uma tabela com alguns dados já cadastrados no SQLIte.

Estrutura da Tabela

CREATE TABLE [TB_CLIENTE]
(
  [COD_CLI] INT NOT NULL,
  [NOM_CLI] VARCHAR(30),
  [CID_CLI] VARCHAR(30),
  CONSTRAINT [] PRIMARY KEY ([COD_CLI] COLLATE NOCASE  ASC)
);

A seguir estão alguns dados necessários, ver Imagem 01.

Figura 01: Dados tabela de Cliente.

Criando um projeto de exemplo

Dividiremos o artigo deste mês em três partes, sendo a primeira responsável pela criação do lay-out da aplicação. A segunda definirá uma classe para armazenar nossas principais funções, eu particularmente acho prático e necessário economizando tempo e código ao decorrer do projeto. Esta classe possuirá métodos estáticos essenciais ao decorrer do desenvolvimento. A última parte terá nossa “Activity” principal, com toda a estrutura do projeto.

Para isto abra seu Eclipse e clique em “File/New/Android Project” e crie um projeto em Android, continuamos utilizando a versão 2.2 ou 2.3. Sugiro criar com o nome de “Android_PesquisarDados”.

Lay-Out da Tela de Pesquisa

Para a disposição dos componentes na tela, organizamos por “lay-outs” alternando tipos horizontais e verticais.

Adicionaremos os seguintes componentes:

Componente	Descrição
TextView – txtPesquisar	Pesquisar Por:
RadioGroup	Agrupamento de componentes RadioButton
RadioButton – rbNome	Nome
RadioButton – rbCidade	Cidade
TextView – txtPesquisa	Texto a Pesquisar:
EditText – edtPesquisar	Campo responsável pela pesquisa de dados
Button – btnPesquisar	Botão Pesquisar
TextView – txtResultado	Resultado da Pesquisa

A Imagem 02 nos disponibiliza a organização dos componentes.

Figura 02: Disposição dos componentes.

Já a Imagem 03 ilustra o resultado final da tela de pesquisa sugerida.

Figura 03: “Lay-Out” sugerido.

A seguir o código XML correspondente.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent">

    <LinearLayout android:orientation="vertical"

        android:layout_height="wrap_content"

        android:id="@+id/linearLayout2"

        android:layout_width="wrap_content">

            <LinearLayout android:layout_height="wrap_content"

                android:layout_width="match_parent"

                android:id="@+id/linearLayout5">

                <TextView android:id="@+id/txtPesquisar"

                android:text="Pesquisar por:"

                android:layout_height="wrap_content"

                android:textAppearance="?android:attr/textAppearanceMedium"

                android:layout_gravity="center"

                android:layout_width="142dp"

                android:typeface="serif" ></TextView>

                <RadioGroup android:id="@+id/rgPesquisar"

            xmlns:android="http://schemas.android.com/apk/res/android"

         android:orientation="horizontal"

                 android:layout_width="fill_parent"

                android:layout_height="wrap_content">

                <RadioButton android:text="Nome"

                android:layout_height="wrap_content"

                android:id="@+id/rbNome"

                android:layout_width="wrap_content"

                android:checked="true"

                android:typeface="serif"></RadioButton>

                <RadioButton android:text="Cidade"

                android:layout_height="wrap_content"

                android:id="@+id/rbCidade"

                android:layout_width="wrap_content"

                android:typeface="serif" ></RadioButton>

                </RadioGroup>

            </LinearLayout>

    </LinearLayout>

    <LinearLayout android:layout_height="wrap_content"

        android:layout_width="match_parent"

        android:id="@+id/linearLayout4"

        android:weightSum="1">

        <LinearLayout android:orientation="vertical"

            android:id="@+id/linearLayout3"

            android:layout_width="235dp"

            android:layout_height="wrap_content">

            <TextView android:textAppearance="?android:attr/textAppearanceMedium"

            android:id="@+id/txtPesquisa"

            android:text="Texto a Pesquisar: "

            android:layout_height="wrap_content"

            android:layout_width="wrap_content"

            android:typeface="serif" ></TextView>

            <EditText android:layout_height="wrap_content"

            android:id="@+id/edtPesquisar"

            android:layout_width="match_parent">

            <requestFocus></requestFocus>

            </EditText>

        </LinearLayout>

    <LinearLayout android:layout_height="match_parent"

        android:id="@+id/linearLayout1"

        android:orientation="vertical"

        android:layout_width="match_parent">

        <TextView android:textAppearance="?android:attr/textAppearanceMedium"

        android:id="@+id/txt"

        android:text=" "

        android:layout_height="wrap_content"

        android:layout_width="match_parent"></TextView>

        <Button android:layout_width="wrap_content"

        android:text="Pesquisar"

        android:id="@+id/btnPesquisar"

        android:layout_height="wrap_content"></Button>

    </LinearLayout>

</LinearLayout>

<TextView android:id="@+id/txtResultado"

android:layout_height="wrap_content"

android:text="TextView"

android:layout_width="match_parent"

android:typeface="monospace"></TextView>

</LinearLayout>

Classe de Funções

Para criar uma classe clique com o botão direito em cima do caminho “src” e escolha “New\Class” e defina o nome como “unFuncoes”, Ver Imagem 04.

Figura 04: Classe unFuncoes.

Utilizaremos neste exemplo três funções principais:

MensagemAlerta: Procedimento responsável por emitir uma mensagem informativa ao usuário.

CaracterDireita: Função para adicionar caracteres à direita de um texto.

ZeroEsquerda: Como o próprio nome já diz, insere zero à esquerda de um número.

Quando utilizamos uma classe estática não é necessário instanciá-la, ou seja, não precisamos criar o objeto em si. Ela já vem criada para utilização apenas fazendo a referência quando necessitar e é exatamente deste tipo de classe que usaremos na nossa “unFuncoes”.

O primeiro passo seria importar os seguintes pacotes necessários.

package pct.Android_PesquisarDados;

import android.app.Activity;

import android.app.AlertDialog;

public class unFuncoes

{

public static void MensagemAlerta(String titulo, String corpo, Activity Atividade)

    {   

AlertDialog.Builder infoResultado = new   AlertDialog.Builder(Atividade);

          infoResultado.setTitle(titulo);

         infoResultado.setMessage(corpo); 

          infoResultado.setNeutralButton("Ok",null);

         infoResultado.show();

    }

    

Nesta função foi passado por parâmetro o título, o corpo e a Atividade utilizada em questão.

public static String CaracterDireita(String Campo, int Quantidade, String Caracter)

    {

          int tamanho = Quantidade - Campo.length();

        

          StringBuffer sb = new StringBuffer(Campo);

         if (tamanho > 0)

          {

              for (int i=0 ; i<tamanho ; i++)

              {

                   sb.append(Caracter);

              }

         }

        

          return sb.toString();

    }  

Já a função CaracterDireita() tem como parâmetro o campo texto, a quantidade e o tipo de caractere.

    

public static String ZeroEsquerda(int Campo, int Quantidade)

    {

          return String.format("%0"+Quantidade+"d", Campo); 

    }

Temos como parâmetros o campo inteiro e a quantidade de zeros a adicionar.

}

  

Codificação da “Activity” principal

Primeiramente importaremos os pacotes:

import java.util.ArrayList;

import java.util.List;

import android.app.Activity;

import android.database.Cursor;

import android.database.sqlite.SQLiteDatabase;

import android.os.Bundle;

import android.view.View;

import android.widget.Button;

import android.widget.EditText;

import android.widget.RadioGroup;

import android.widget.TextView;

Usaremos também as seguintes variáveis globais.

Cursor ponteiro;

SQLiteDatabase bancodados;

TextView resultado;

O evento OnCreate() é disparado quando executamos o projeto. Aqui é onde fica o corpo principal onde iremos abrir o Banco de Dados e pesquisar os dados.

@Override

public void onCreate(Bundle savedInstanceState)

{

     super.onCreate(savedInstanceState);

     setContentView(R.layout.main);

       

     abreoucriaBD();             

        

Button btPesquisar = (Button) findViewById(R.id.btnPesquisar);

btPesquisar.setOnClickListener(new View.OnClickListener()

     {

         @Override

         public void onClick(View v)

         {

resultado = (TextView) findViewById(R.id.txtResultado);

RadioGroup rgPesquisar = (RadioGroup)  findViewById(R.id.rgPesquisar);

           String strPesquisa = "";

                 

            switch (rgPesquisar.getCheckedRadioButtonId())

           {

case R.id.rbNome : strPesquisa = "NOM_CLI LIKE ?";

              break;

                           

case R.id.rbCidade : strPesquisa = "CID_CLI LIKE ?";

              break;

           }

                  

              List<String> dados =  

              PesquisarDados("TB_CLIENTE", strPesquisa,

                            "COD_CLI",

"COD_CLI", "NOM_CLI", "CID_CLI");

                

              StringBuilder sb = new StringBuilder();

sb.append("Cod.| "+unFuncoes.CaracterDireita("Nome", 15," ") +" | Cidade \n");

sb.append(unFuncoes.CaracterDireita("-", 35,"-")+"\n");

                     

              for (String registros : dados)

              {

                   sb.append(registros + "\n");

              }

                        

              resultado.setText(sb.toString());

         }   

        });

}

public void abreoucriaBD()

{

    try

    {

bancodados = openOrCreateDatabase("DBTHECLUB", MODE_WORLD_READABLE, null);

String sql = "CREATE TABLE IF NOT EXISTS TB_CLIENTE"

                  +"(COD_CLI INTEGER PRIMARY KEY, " +

"NOM_CLI TEXT, CID_CLI TEXT, EST_CLI TEXT,  PRO_CLI TEXT)";

         bancodados.execSQL(sql);

     }

     catch (Exception e)

     {

unFuncoes.MensagemAlerta("Erro", "Ocorreu algum erro ao abrir ou criar o Banco de Dados!", Android_PesquisarDadosActivity.this);  

     }

}

   

public List<String> PesquisarDados(String NomeTabela, String ClausulaWhere, String  OrdemCampo, String...TipoCampos)

{

EditText edtPesq = (EditText) findViewById(R.id.edtPesquisar);

    List<String> list = new ArrayList<String>();

    ponteiro = bancodados.query(NomeTabela,

                              TipoCampos,

                              ClausulaWhere,

new String[]  {"%"+edtPesq.getText().toString() + "%"},

                              null,

                              null,

                              OrdemCampo);

   

if (ponteiro.moveToFirst())

    {

         do

         {

           list.add(unFuncoes.ZeroEsquerda(Integer.parseInt(ponteiro.getString(0)),3) +

" | " + unFuncoes.CaracterDireita(ponteiro.getString(1),15," ") +

" | "+ unFuncoes.CaracterDireita(ponteiro.getString(2),10," "));

         }

          while (ponteiro.moveToNext());

    }

     

    if (ponteiro != null && !ponteiro.isClosed())

    {

         ponteiro.close();

    }

    return list;

}

Inicialmente é executado o método “AbreoucriaBD()” que é responsável por criar ou abrir o Database “DBTHECLUB”. No botão pesquisar criamos uma variável do tipo “RadioGroup” para permitir a escolha de pesquisa por Nome ou Cidade e finalmente chamamos o método “PesquisarDados” que tem como parâmetros: o nome da tabela, a cláusula “Where”,  o campo onde iremos fazer a ordenação dos registros e um vetor dos campos utilizados. Armazenamos em um StringBuilder para depois lermos usando o comando “For”. Figura 05 e 06.

Figura 05: Exemplo em “Run-Time”.

Figura 06: Exemplo em “Run-Time”.

Conclusão

A intenção deste artigo foi de aprimorar o que foi aprendido nos meses anteriores e criar um “lay-out” para pesquisa de dados. Fiquem a vontade para dar ideias e sugestões para criação de artigos.

Abraços e até o mês que vem!