search items in database and display dropdown list

Question

I have the following app architecture (generalized for simplification):

main Layout consists of ActionBar with custom View and scrollable Tabs, and a ViewPager hosting multiple ListFragments. Each ListFragment has its own set of data (1 row = ImageView + TextView) which is loaded from an SQLite database. In my ActionBar's custom View a have a "search" EditText.

When the user starts typing something, I'd like to perform an "on-the-go" search in the database and display matching names (those names should be clickable) in form of a dropdown list. I saw some examples how to perform a search in a ListView, but nothing related to database search.

So the question is: how to display database search results as dropdown list and refresh it anytime the user adds or removes a character?

Answer 1

You need to implement AutoCompleteTextView. This allows suggestions as the user is typing. You can bind the data to be searched for, using Adapters.

This should solve your problem.

An example that might be helpful can be found here.

Answer 2

You can implement the OnQueryTextListener() interface and override the onQueryTextChange(String text) method - this method gets called on character changes. Something like

searchTextInstance.setOnQueryTextListener(new CustomQueryListener());

Within onQueryTextChange(Sting text) query your database and then call

CustomAdapter adapter = new CustomAdapter()
//... populate the adapter with the query results and call
searchTextInstance.setSuggestionAdapter(adapter)

where CustomAdapter is a class that extends SimpleCursorAdapter and this instance is populated by your query results (the results to be displayed in the drop down menu).

To make the selection clickable you can then set a custom OnSuggestionListener() to your searchTextInstance, i.e.

searchTextInstance.setOnSuggestionListener(new CustomSuggestionListener());

where CustomSuggestionListener implements OnSuggestoinListener - the only method of the interface, onSuggestionClick(int postion) will accomplish your goal

Answer 3

To view the searched result in drop down you can use PopupWindow

I implement it in room database after getting search results

getting the data from database

   private fun searchCustomer(param: String) {
    var listOfCustomer = ArrayList<LocalCustomer>()
    localCustomerRepository.searchLocalCustomers(param).observe(this,
        Observer<List<LocalCustomer>> { localCustomerList ->
            listOfCustomer = localCustomerList as ArrayList

            if (listOfCustomer.size > 0) {
                val locationAdapter = CustomerAdapter(context, listOfCustomer)
                setupPopupWindow(listOfCustomer)
            } else {
                Utils.showMsg(this, "No result found")
            }
        })


}

Setting up Popup window

 private fun setupPopupWindow(listOfCustomer: ArrayList<LocalCustomer>) {
    val inflater = this.getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater
    val layout = inflater.inflate(R.layout.spinner_list, null)
    val popupWindow =
        PopupWindow(layout, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT, true)
    popupWindow.showAsDropDown(svSearch, 0, 0)
    val locationAdapter = CustomerAdapter(context, listOfCustomer)
    val listView = layout.findViewById(R.id.lvMenu) as ListView
    listView.adapter = locationAdapter
    listView.onItemClickListener = AdapterView.OnItemClickListener { adapterView, 
    view, position, id ->

        popupWindow.dismiss()
    }

}

spinner_list

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/text_vvvvlight_gry"
android:orientation="vertical">

<ListView
    android:id="@+id/lvMenu"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:elevation="4dp"/>
</LinearLayout>

SearchView

svSearch.setOnQueryTextListener(object : SearchView.OnQueryTextListener {
        override fun onQueryTextSubmit(p0: String?): Boolean {
            return true
        }

        override fun onQueryTextChange(param: String?): Boolean {
            if (param != null && param != "")
                searchCustomer(param)
            return true
        }
    })

CustomerAdapter would be a baseAdapter or you can use ArrayAdapter