SearchView en Android con Kotlin

SearchView es un widget en Android que proporciona una interfaz de búsqueda con la ayuda de la cual los usuarios pueden realizar búsquedas dentro de la lista de datos dada. En esta vista de búsqueda, el usuario debe especificar la consulta de búsqueda. De acuerdo con la búsqueda, los resultados de la consulta se completarán dentro de la vista de lista. En este artículo, veremos cómo implementar SearchView en Android ListView en Kotlin. Construiremos una aplicación simple en la que mostraremos la lista de lenguajes de programación dentro de la vista de lista. También mostraremos una vista de búsqueda con la que los usuarios pueden filtrar los datos dentro de la vista de lista según la consulta de búsqueda. A continuación se muestra un video de muestra para tener una idea de lo que vamos a hacer en este artículo.

Nota : Para implementar la Vista de búsqueda en Android usando Java, consulte el siguiente artículo: Vista de búsqueda en Android ListView en Java

Implementación paso a paso

Paso 1: crea un nuevo proyecto en Android Studio

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Tenga en cuenta que seleccione Kotlin como lenguaje de programación.

Paso 2: trabajar con el archivo activity_main.xml

Vaya a la aplicación > res > diseño > actividad_principal.xml y agregue el siguiente código a ese archivo. A continuación se muestra el código para el archivo activity_main.xml . Se agregan comentarios dentro del código para comprender el código con más detalle.

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
 
    <!--Search view for filtering list view-->
    <SearchView
        android:id="@+id/idSV"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        android:iconifiedByDefault="false"
        android:padding="4dp"
        android:queryHint="Search Programming language" />
 
    <!--List View from which data is to be searched
         for different programming languages-->
    <ListView
        android:id="@+id/idLVProgrammingLanguages"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_below="@id/idSV" />
   
</RelativeLayout>

Paso 3: trabajar con el archivo MainActivity.kt

Vaya al archivo MainActivity.kt y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.kt . Se agregan comentarios dentro del código para comprender el código con más detalle.

Kotlin

package com.gtappdevelopers.kotlingfgproject
 
import android.os.Bundle
import android.widget.ArrayAdapter
import android.widget.ListView
import android.widget.SearchView
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
 
 
class MainActivity : AppCompatActivity() {
    // on below line we are
    // creating variables for listview
    lateinit var programmingLanguagesLV: ListView
 
    // creating array adapter for listview
    lateinit var listAdapter: ArrayAdapter<String>
 
    // creating array list for listview
    lateinit var programmingLanguagesList: ArrayList<String>;
 
    // creating variable for searchview
    lateinit var searchView: SearchView
 
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        
        // initializing variables of list view with their ids.
        programmingLanguagesLV = findViewById(R.id.idLVProgrammingLanguages)
        searchView = findViewById(R.id.idSV)
         
        // initializing list and adding data to list
        programmingLanguagesList = ArrayList()
        programmingLanguagesList.add("C")
        programmingLanguagesList.add("C#")
        programmingLanguagesList.add("Java")
        programmingLanguagesList.add("Javascript")
        programmingLanguagesList.add("Python")
        programmingLanguagesList.add("Dart")
        programmingLanguagesList.add("Kotlin")
        programmingLanguagesList.add("Typescript")
 
        // initializing list adapter and setting layout
        // for each list view item and adding array list to it.
        listAdapter = ArrayAdapter<String>(
            this,
            android.R.layout.simple_list_item_1,
            programmingLanguagesList
        )
         
        // on below line setting list
        // adapter to our list view.
        programmingLanguagesLV.adapter = listAdapter
         
        // on below line we are adding on query
        // listener for our search view.
        searchView.setOnQueryTextListener(object : SearchView.OnQueryTextListener {
            override fun onQueryTextSubmit(query: String?): Boolean {
                // on below line we are checking
                // if query exist or not.
                if (programmingLanguagesList.contains(query)) {
                    // if query exist within list we
                    // are filtering our list adapter.
                    listAdapter.filter.filter(query)
                } else {
                    // if query is not present we are displaying
                    // a toast message as no  data found..
                    Toast.makeText(this@MainActivity, "No Language found..", Toast.LENGTH_LONG)
                        .show()
                }
                return false
            }
 
            override fun onQueryTextChange(newText: String?): Boolean {
                // if query text is change in that case we
                // are filtering our adapter with
                // new text on below line.
                listAdapter.filter.filter(newText)
                return false
            }
        })
    }
}

Ahora ejecute su aplicación para ver el resultado. 

Producción: 

Publicación traducida automáticamente

Artículo escrito por chaitanyamunje y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *