Contoh Implementasi SearchView Java

bundet

Di Android, widget SearchView menyediakan antarmuka pengguna pencarian di mana pengguna bisa memasukkan permintaan pencarian dan kemudian mengirimkan permintaan ke penyedia pencarian. Ini menunjukkan daftar saran atau hasil kueri jika tersedia dan memungkinkan pengguna untuk memilih saran atau hasil untuk diluncurkan.

Contoh

<SearchView
android:id="@+id/simpleSearchView"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

Mari kita bahas beberapa metode penting SearchView yang mungkin digunakan untuk mengelola tampilan pencarian.

1. getQuery()

Fungsi ini digunakan untuk mendapatkan string kueri saat ini di bidang teks tampilan pencarian. Metode ini mengembalikan nilai jenis CharSequence. Di bawah ini kita mendapatkan String kueri dari tampilan pencarian.

SearchView simpleSearchView = (SearchView) findViewById(R.id.simpleSearchView); // inititate a search view
CharSequence query = simpleSearchView.getQuery(); // get the query string currently in the text field

2. getQueryHint()

Fungsi ini digunakan untuk mendapatkan teks petunjuk yang akan ditampilkan di bidang teks kueri. Metode ini mengembalikan nilai jenis CharSequence.

Di bawah ini adalah contoh kode yang mendapatkan teks petunjuk yang akan ditampilkan di bidang teks kueri pada tampilan pencarian.

SearchView simpleSearchView = (SearchView) findViewById(R.id.simpleSearchView); // inititate a search view
CharSequence queryHint = simpleSearchView.getQueryHint(); // get the hint text that will be displayed in the query text field

3. isIconfiedByDefault()

Metode ini mengembalikan status ikonik default dari bidang pencarian. Metode ini mengembalikan nilai Boolean benar atau salah. Di bawah ini kami mendapatkan status default dari bidang pencarian.

SearchView simpleSearchView = (SearchView) findViewById(R.id.simpleSearchView); // inititate a search view
boolean isIconfied=simpleSearchView.isIconfiedByDefault(); // checks default iconified state of the search field

4. setIconifiedByDefault(Boolean iconify)

Metode ini digunakan untuk mengatur default atau keadaan istirahat dari bidang pencarian. Dalam metode ini kami menetapkan nilai Boolean benar atau salah.

Catatan Penting: Saat SearchView digunakan dalam Bilah Tindakan sebagai tampilan tindakan untuk item menu yang dapat diciutkan, maka perlu disetel ke ikonifikasi secara default menggunakan fungsi setIconfiedByDefault (true). Jika Anda ingin bidang pencarian selalu terlihat, panggil setIconifiedByDefault (false). true adalah nilai default untuk fungsi ini. Anda juga dapat menyetel iconfied dari xml dengan menggunakan properti iconfiedByDefault ke true atau false.

Di bawah ini kami menyetel ikonified by default value menjadi false.

SearchView simpleSearchView = (SearchView) findViewById(R.id.simpleSearchView); // inititate a search view
simpleSearchView.setIconifiedByDefault(false);  // set the default or resting state of the search field

5. setQueryHint(CharSequence hint)

Metode ini digunakan untuk menyetel teks petunjuk untuk ditampilkan di bidang teks kueri. Metode ini mendukung nilai tipe CharSequence. Di bawah ini kami menetapkan petunjuk kueri untuk SearchView.

SearchView simpleSearchView = (SearchView) findViewById(R.id.simpleSearchView); // inititate a search view
simpleSearchView.setQueryHint("Search View"); // set the hint text to display in the query text field

6. setOnQueryTextFocusChangeListener(OnFocusChangeListenerlistener)

Pendengar ini menginformasikan ketika fokus bidang teks kueri berubah. Dalam kode di bawah ini kami menunjukkan penggunaan setOnQueryTextFocusChangeListener() dari SearchView.

SearchView simpleSearchView = (SearchView) findViewById(R.id.simpleSearchView); // inititate a search view

// perform set on query text focus change listener event
simpleSearchView.setOnQueryTextFocusChangeListener(new View.OnFocusChangeListener() {
@Override
public void onFocusChange(View v, boolean hasFocus) {
// do something when the focus of the query text field changes
}
});

7. setOnQueryTextListener(OnQueryTextListenerlistener)

Ini adalah tindakan pengguna dalam SearchView. Di bawah ini kami menunjukkan penggunaan setOnQueryTextListener() dari tampilan pencarian.

SearchView simpleSearchView = (SearchView) findViewById(R.id.simpleSearchView); // inititate a search view

// perform set on query text listener event
simpleSearchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
@Override
public boolean onQueryTextSubmit(String query) {
// do something on text submit
return false;
}

@Override
public boolean onQueryTextChange(String newText) {
// do something when text changes
return false;
}
});

Atribut SearchView

Sekarang mari kita bahas beberapa atribut umum dari tampilan penelusuran yang membantu kita mengonfigurasinya dalam tata letak (xml) kita.

1. Id

Atribut id digunakan untuk mengidentifikasi tampilan pencarian secara unik.

<!--  id of an search view used to uniquely identify it -->
<SearchView
android:id="@+id/simpleSearchView"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

2. queryHint

Atribut ini digunakan untuk menyetel string petunjuk kueri opsional yang akan ditampilkan di bidang kueri kosong. Petunjuk kueri sama dengan atribut petunjuk untuk teks editan. Di bawah ini kami mengatur petunjuk permintaan dari tampilan pencarian.

<SearchView
    android:id="@+id/simpleSearchView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:iconifiedByDefault="false"
    android:queryHint="Search Here" /><!-- set query string of an search view -->

3. iconifiedByDefault

Atribut tampilan pencarian ini digunakan untuk menyetel default atau status istirahat dari bidang pencarian. Anda dapat menyetel nilai Boolean untuk atribut ini dan nilai defaultnya benar. Nilai sebenarnya menunjukkan Anda dapat mengikonkan atau memperluas tampilan pencarian. Di bawah ini kami menetapkan nilai palsu untuk atribut ini.

<SearchView
    android:id="@+id/simpleSearchView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:iconifiedByDefault="false"
    android:queryHint="Search here"/> <!-- set iconified by default to false -->

4. background

Atribut background digunakan untuk mengatur latar belakang tampilan pencarian. Anda dapat menyetel warna atau drawable di latar belakang tampilan pencarian. Anda juga dapat mengatur warna latar belakang di kelas java. Di bawah ini kami mengatur warna merah untuk latar belakang tampilan pencarian.

<SearchView
    android:id="@+id/simpleSearchView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:iconifiedByDefault="false"
    android:queryHint="Search here"
    android:background="#f00"/><!-- red color for the background of search view -->

Setting background SearchView di kelas Java

SearchView simpleSearchView=(SearchView)findViewById(R.id.simpleSearchView);
simpleSearchView.setBackgroundColor(Color.RED);

5. padding

Atribut padding digunakan untuk mengatur padding dari kiri, kanan, atas atau bawah. paddingRight: mengatur pengisi dari sisi kanan tampilan pencarian. paddingLeft: mengatur pengisi dari sisi kiri tampilan pencarian. paddingTop: mengatur pengisi dari sisi atas tampilan pencarian. paddingBottom: setel padding dari sisi bawah tampilan pencarian Padding: setel padding dari semua sisi tampilan pencarian. Di bawah ini kami menetapkan pengisi 40dp dari semua sisi tampilan pencarian.

<SearchView
    android:id="@+id/simpleSearchView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:iconifiedByDefault="false"
    android:queryHint="Search View"
    android:background="#f00"
    android:padding="40dp"/> <!-- set 40 dp padding from all the sides of a search view -->

Dalam contoh SearchView di bawah ini, kami menampilkan SearchView dan ListView. Dalam hal ini kita membuat daftar nama binatang dan kemudian mengatur Adaptor untuk mengisi data di ListView. Akhirnya kami menerapkan SearchView.OnQueryTextListener untuk memfilter daftar hewan menurut kueri penelusuran. Di bawah ini Anda dapat mengunduh kode proyek Android Studio SearchView lengkap, lihat keluaran akhir dan penjelasan langkah demi langkah contoh:

1. Kode Layout activity_main

Pada langkah ini kita membuka file xml dan menambahkan kode untuk menampilkan SearchView dan ListView dengan menggunakan atribut yang berbeda.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <SearchView
        android:id="@+id/search"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:iconifiedByDefault="false">

        <requestFocus />
    </SearchView>

    <ListView
        android:id="@+id/listview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@+id/search" />

</RelativeLayout>

2. Kode MainActivity.java

Pada langkah ini kita membuka MainActivity dan menambahkan kode untuk memulai SearchView dan ListView. Dalam hal ini kita membuat daftar nama Hewan dan kemudian mengatur adaptor untuk mengisi data di ListView. Dalam hal ini kami juga mengimplementasikan SearchView.OnQueryTextListener untuk memfilter daftar hewan menurut kueri penelusuran.

package example.abhiandroid.searchviewexample;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ListView;
import android.widget.SearchView;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity implements SearchView.OnQueryTextListener {

    // Declare Variables
    ListView list;
    ListViewAdapter adapter;
    SearchView editsearch;
    String[] animalNameList;
    ArrayList<AnimalNames> arraylist = new ArrayList<AnimalNames>();

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Generate sample data

        animalNameList = new String[]{"Lion", "Tiger", "Dog",
                "Cat", "Tortoise", "Rat", "Elephant", "Fox",
                "Cow","Donkey","Monkey"};

        // Locate the ListView in listview_main.xml
        list = (ListView) findViewById(R.id.listview);

        for (int i = 0; i < animalNameList.length; i++) {
            AnimalNames animalNames = new AnimalNames(animalNameList[i]);
            // Binds all strings into an array
            arraylist.add(animalNames);
        }

        // Pass results to ListViewAdapter Class
        adapter = new ListViewAdapter(this, arraylist);

        // Binds the Adapter to the ListView
        list.setAdapter(adapter);

        // Locate the EditText in listview_main.xml
        editsearch = (SearchView) findViewById(R.id.search);
        editsearch.setOnQueryTextListener(this);
    }

    @Override
    public boolean onQueryTextSubmit(String query) {

        return false;
    }

    @Override
    public boolean onQueryTextChange(String newText) {
        String text = newText;
        adapter.filter(text);
        return false;
    }
}

3. Kode ListViewAdapter.java

Sekarang buat Kelas Baru. Buka app -> java -> klik kanan pada package-> New -> Java Class dan buat ListViewAdapter.java dan tambahkan kode berikut. Di sini kita memperluas BaseAdapter di kelas ListViewAdapter dan kemudian menyetel data di ListView dengan menggunakan kelas Modal.

package example.abhiandroid.searchviewexample;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
import java.util.Locale;

public class ListViewAdapter extends BaseAdapter {

    // Declare Variables

    Context mContext;
    LayoutInflater inflater;
    private List<AnimalNames> animalNamesList = null;
    private ArrayList<AnimalNames> arraylist;

    public ListViewAdapter(Context context, List<AnimalNames> animalNamesList) {
        mContext = context;
        this.animalNamesList = animalNamesList;
        inflater = LayoutInflater.from(mContext);
        this.arraylist = new ArrayList<AnimalNames>();
        this.arraylist.addAll(animalNamesList);
    }

    public class ViewHolder {
        TextView name;
    }

    @Override
    public int getCount() {
        return animalNamesList.size();
    }

    @Override
    public AnimalNames getItem(int position) {
        return animalNamesList.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    public View getView(final int position, View view, ViewGroup parent) {
        final ViewHolder holder;
        if (view == null) {
            holder = new ViewHolder();
            view = inflater.inflate(R.layout.listview_item, null);
            // Locate the TextViews in listview_item.xml
            holder.name = (TextView) view.findViewById(R.id.name);
            view.setTag(holder);
        } else {
            holder = (ViewHolder) view.getTag();
        }
        // Set the results into TextViews
        holder.name.setText(animalNamesList.get(position).getAnimalName());
        return view;
    }

    // Filter Class
    public void filter(String charText) {
        charText = charText.toLowerCase(Locale.getDefault());
        animalNamesList.clear();
        if (charText.length() == 0) {
            animalNamesList.addAll(arraylist);
        } else {
            for (AnimalNames wp : arraylist) {
                if (wp.getAnimalName().toLowerCase(Locale.getDefault()).contains(charText)) {
                    animalNamesList.add(wp);
                }
            }
        }
        notifyDataSetChanged();
    }

}

4. Kode list_view_items.xml

Sekarang Buat Aktivitas tata letak baru. Pergi ke res-> klik kanan pada layout -> New -> Activity -> Blank Activity dan buat list_view_items.xml dan tambahkan kode berikut. Di sini kami membuat tampilan item yang akan ditampilkan di dalam setiap baris.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:padding="10dp">
    
    <TextView
        android:id="@+id/nameLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Animal : " />

    <TextView
        android:id="@+id/name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/nameLabel" />
    
</RelativeLayout>

5. Kode Object AnimalNames.java

Sekarang buat Kelas Baru. Buka app -> java -> klik kanan pada package-> New -> Java Class dan buat AnimalNames.java dan tambahkan kode berikut. Di sini kita memiliki konstruktor untuk menyetel nama hewan dan fungsi untuk mendapatkan nama hewan.

package example.abhiandroid.searchviewexample;

public class AnimalNames {
    private String animalName;

    public AnimalNames(String animalName) {
        this.animalName = animalName;
    }

    public String getAnimalName() {
        return this.animalName;
    }

}

Sekarang jalankan Aplikasi, Anda akan melihat nama-nama Hewan yang berbeda terdaftar. Sekarang ketik karakter pertama Hewan yang muncul di benak Anda di SearchView dan Anda akan disortir daftarnya.