Cara Membuat Filter SearchView pada ListView Android

  • Post
    codeorayo
    Keymaster
    none
    SearchView  adalah salah satu komponen widget  yang digunakan oleh user (pengguna) , untuk memasukan dan menquery pencarian dari list kumpulan  data. ListView adalah Sebuah tampilan daftar atau juga disebut daftar list dari sebuah konten atau data yang memungkinkan kalian bisa melihatnya secara berurutan ke bawah dengan gaya vertikal di  tampilan Aplikasi Android. ListView berguna jika kita membuat Aplikasi Android dan ingin menampilkan suatu list misal daftar nama,nomor hp,nama-nama binatang dll. 

    ListView adalah versi deprecated  (versi lama ) dari ReyclerView. ListView menggunakan ArrayList yang berguna untuk menyimpan data ke dalam list obyek dalam bentuk array ,yang ukuranya tergantung dengan jumlah data yang akan diinput. Serta menggunakan Adapter untuk mengatur akses dan resource view dari item data atau Dataset(kumpulan data) ,yang akan ditampilkan pada screen(layar)

    [img]https://4.bp.blogspot.com/-vg6Ju60l6jc/VvfWbSWPARI/AAAAAAAAFLI/MnHlLSNuEm4DwLTyBlhw2oO1-TTP7zyQw/s1600/android-studio-tutorial-development-apps-by-okedroid.png[/img]

    Nah pada tutorial belajar android kali ini, kita akan membuat widget SearchView, untuk pencarian dari daftar  nama-nama negara di dunia, yang akan ditampilkan dalam bentuk ListView. Kita akan menggunakan class Locale dari bawaan bahasa pemrograman  Java.

    1. Pertama buka project Android Studio kalian

    2. Pada bagian layout kalian salin baris instruksi (codingan) di bawah pada activity_main.xml

    Disini kita akan membuat widget SearchView dan ListView

    activity_main.xml


    1.     xmlns:android=”http://schemas.android.com/apk/res/android

    2.     android:layout_width=”fill_parent”

    3.     android:layout_height=”fill_parent”

    4.     android:orientation=”vertical”

    5.     android:padding=”10dp” >

    6.  

    7.     

    8.     

    9.         android:id=”@+id/search_view”

    10.         android:layout_width=”match_parent”

    11.         android:layout_height=”wrap_content”

    12.         android:background=”@drawable/search_view”

    13.         android:iconifiedByDefault=”false”

    14.         android:padding=”2dp”

    15.         android:queryHint=”Cari disini….” />

    16.  

    17.  

    18.     

    19.     

    20.         android:id=”@+id/list_view”

    21.         android:layout_width=”fill_parent”

    22.         android:layout_height=”wrap_content” >

    23.     

    24.  



    25. Pada bagian SearchView kalian juga dapat mengcustom backgroundnya , yang akan kita buat pada folder drawable.

      Untuk membuatnya kalian hanya perlu klik kanan pada folder drawable  > lalu pilih New > Drawable resource file.

      Sebagai contoh saya akan menamainya dengan nama search_view.xml

      Lalu salin baris instruksi (codingan) berikut:

      search_view.xml


      1.     xmlns:android=”http://schemas.android.com/apk/res/android

      2.     android:shape=”rectangle”>

      3.  

      4.     

      5.     

      6.         android:color=”@android:color/transparent” >

      7.     

      8.  

      9.     

      10.     

      11.         android:width=”1dp”

      12.         android:color=”#2ecc71″ >

      13.     

      14.  

      15.  

      16.     

      17.     

      18.         android:radius=”5dp”   >

      19.     

      20.  



      21. Disini kita akan membuat data yang akan ditampilkan dalam bentuk ListView.

        Pada tutorial ini daftar negara yang akan ditampilkan dalam bentuk TextView.

        Sebagai contoh saya akan menamainya dengan nama daftar_negara.xml

        Lalu salin baris instruksi (codingan) berikut:

        BACA JUGA:

         daftar_negara.xml


        1.     xmlns:android=”http://schemas.android.com/apk/res/android

        2.     android:layout_width=”match_parent”

        3.     android:layout_height=”match_parent”

        4.     android:orientation=”horizontal”

        5.     android:padding=”10dp” >

        6.  

        7.  

        8.     

        9.     

        10.         android:id=”@+id/name”

        11.         android:layout_width=”match_parent”

        12.         android:layout_height=”wrap_content”

        13.         android:layout_weight=”1″

        14.         android:padding=”5dp”

        15.         android:textColor=”#2ecc71″

        16.         android:textSize=”18dp” />

        17.  



        18. 3. Pada file class Activity di MainActivity.java.

          Kalian bisa salin baris instruksi (codingan) berikut:

          MainActivity.java.

          1. package com.okedroid.searchviewlistview;

          2.  

          3.  

          4. import android.os.Bundle;

          5. import android.support.v7.app.AppCompatActivity;

          6. import android.widget.ArrayAdapter;

          7. import android.widget.ListView;

          8. import android.widget.SearchView;

          9.  

          10. import java.util.ArrayList;

          11. import java.util.Locale;

          12.  

          13. public class MainActivity extends AppCompatActivity implements SearchView.OnQueryTextListener {

          14.  

          15.     ListView lv;  //deklarasi variabbel listview

          16.     SearchView search_view;//deklarasi variabbel searchview

          17.  

          18.     ArrayList negara;

          19.     //deklarasi variabel negara di dalam arraylist untuk menyimpan data ke dalam list obyek

          20.     ArrayAdapter adapter;

          21.     //deklarasi array adapter untuk menghubunkan data ke dalam resource view

          22.  

          23.     @Override

          24.     protected void onCreate(Bundle savedInstanceState) {

          25.         super.onCreate(savedInstanceState);

          26.  

          27.         setContentView(R.layout.activity_main);

          28.  

          29.         lv = (ListView) findViewById(R.id.list_view);//menginisiasi widget listview dengan variabel lv

          30. //menginisiasi widget listview dengan variabel lv

          31.         search_view = (SearchView) findViewById(R.id.search_view);

          32. //menginisiasi widget searchview dengan search_view

          33.         String[] locales = Locale.getISOCountries();

          34.         negara = new ArrayList();

          35. //memanggil class locale java yang berguna untuk menampilkan data negara

          36.         for (String countryCode : locales) {

          37.             Locale obj = new Locale(“”, countryCode);

          38.             negara.add(obj.getDisplayCountry());

          39.         }

          40.         //menampilkan data code negara dari class locale secara berulang-ulang

          41.  

          42.         adapter = new ArrayAdapter(getApplicationContext(),

          43.                 R.layout.daftar_negara, R.id.name, negara);

          44.  

          45.         //menghubungkan data negara di arrayadapter berdasarkan tampilan textview di layout daftar_negara

          46.  

          47.         lv.setAdapter(adapter);

          48.  

          49.         search_view.setOnQueryTextListener(this);

          50.         //menquery data text dari widget searchview di class saat ini this = MainActivity

          51.     }

          52.  

          53.     @Override

          54.     public boolean onQueryTextChange(String newText) {

          55.         adapter.getFilter().filter(newText);//memfilter adapter pada textbaru

          56.         return false;

          57.     }

          58.  

          59.     @Override

          60.     public boolean onQueryTextSubmit(String query) {

          61.         return false; //submit query

          62.     }

          63.  

          64. }


            4. Setelah itu kita coba jalankan Aplikasinya lewat Android Studio

          • You must be logged in to reply to this topic.