Search Interface para ListView


A veces es interesante darle opción al usuario, cuando hay muchas entradas mostradas en forma de ListView, a que pueda navegar por ellas, especialmente cuando busca una en concreto, aunque no sepa exactamente cuál de ellas es. Una forma básica de hacer esto, es por coincidencia.

Supongamos el siguiente main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="@+id/LinearLayout01"
                android:layout_width="fill_parent"
android:layout_height="fill_parent"
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:orientation="vertical">
<EditText android:id="@+id/EditText01"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:hint="Search">
</EditText>

<ListView android:id="@+id/ListView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>

Tal como se puede ver, es sencillo, un EditText y un ListView.

Ahora supongamos que la actividad principal tiene un String array constante, de la siguiente forma:

package com.ListViewSearchExample;

import java.util.ArrayList;
import android.app.Activity;
import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.widget.ArrayAdapter;
import android.widget.EditText;
import android.widget.ListView;

public class ListViewSearchExample extends Activity
{
private ListView lv;
private EditText et;
private String listview_array[] = { "ONE", "TWO", "THREE", "FOUR", "FIVE",
"SIX", "SEVEN", "EIGHT", "NINE", "TEN" };
private ArrayList<String> array_sort= new ArrayList<String>();
int textlength=0;

public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

lv = (ListView) findViewById(R.id.ListView01);
et = (EditText) findViewById(R.id.EditText01);
lv.setAdapter(new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_1, listview_array));

et.addTextChangedListener(new TextWatcher()
{
public void afterTextChanged(Editable s)
{
                                                                // Abstract Method of TextWatcher Interface.
}
public void beforeTextChanged(CharSequence s,
int start, int count, int after)
{
// Abstract Method of TextWatcher Interface.
}
public void onTextChanged(CharSequence s,
int start, int before, int count)
{
textlength = et.getText().length();
array_sort.clear();
for (int i = 0; i < listview_array.length; i++)
{
if (textlength <= listview_array[i].length())
{
if(et.getText().toString().equalsIgnoreCase(
(String)
listview_array[i].subSequence(0,
textlength)))
{
                                                                                                                array_sort.add(listview_array[i]);
                                                                                                }
                                                                                }
                                                                }
lv.setAdapter(new ArrayAdapter<String>
(ListViewSearchExample.this,
android.R.layout.simple_list_item_1, array_sort));
}
});
}
}

La idea es asociarle un listener de cambio al EditText, de forma que antes de que se produzca el cambio, se limpie el array, y se vuelva a recrear con las opciones por coincidencia (ver método beforeTextChanged()).

De esta forma tan sencilla, se emularía tal comportamiento, y puede ser un buen punto de partida para complicarlo tanto como se quiera.

🙂

Acerca de José Manuel Vega

Ingeniero Superior en Telecomunicaciones Ingeniero Técnico en Informática de Sistemas

Publicado el 17/02/2012 en Ejemplos básicos. Añade a favoritos el enlace permanente. Deja un comentario.

Hay un ANDROIDe suelto...