Searchable Spinner implementation

varunm

dialog_searchable_spinner.XML

<LinearLayout

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    android:orientation="vertical"

    android:padding="16dp"

    android:background="@android:color/white"

    >

   

    <!-- Text view to show the text Select course-->

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Select Course"

        android:textSize="20sp"

        android:textStyle="bold"

        />

   

    <!-- Edit text to allow user to type name

           of item he/she wants to search-->

    <EditText

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:id="@+id/edit_text"

        android:hint="Search..."

        android:padding="12dp"

        android:singleLine="true"

        android:layout_marginTop="8dp"

        android:layout_marginBottom="8dp"

        android:background="@android:drawable/editbox_background"

        />

   

      <!-- List view to insert list of items-->

    <ListView

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:id="@+id/list_view"

        />

 

</LinearLayout>

Implementing Searchable spinner

Declaration of array list and add items into array list by API response

lateinit var productsarrayList: ArrayList<String>



try {
    when {
        response.code() == 200 -> {
            cataloguelistResponse = response.body()!!
            if (cataloguelistResponse.error=="0") {

                // Set up the Spinner with the custom adapter
                productsarrayList=ArrayList()
                if(cataloguelistResponse.maincategories.size>0)
                {
                    for (i in cataloguelistResponse.maincategories)
                    {
                        productsarrayList!!.add(i.name)
                    }
                    setupSpinner(productsarrayList!!)
                }

 internal fun setupSpinner(items:ArrayList<String>) {
        val textview = findViewById<TextView>(R.id.testView)
        val imageview = findViewById<ImageView>(R.id.imageview)

        ProductBinding.testView.setOnClickListener {
            // Initialize dialog
            dialog = Dialog(this@AddCatalogueProduct)

            // Set custom dialog layout
            dialog!!.setContentView(R.layout.searchablespinnerlayout)

            // Set custom height and width
            dialog!!.window?.setLayout(800, 800)

            // Set transparent background
            dialog!!.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))

            // Show dialog
            dialog!!.show()
            // Initialize variables from dialog
            val editText = dialog!!.findViewById<EditText>(R.id.edit_text)
            val listView = dialog!!.findViewById<ListView>(R.id.list_view)

            // Initialize custom adapter
//            val customAdapter = CustomProductsSoinnerAdapter(items, this)
            val adapter: ArrayAdapter<String> = ArrayAdapter<String>(
                this@AddCatalogueProduct,
                android.R.layout.simple_list_item_1,
                items
            )
            // Set adapter
            listView.adapter = adapter

            editText.addTextChangedListener(object : TextWatcher {
                override fun beforeTextChanged(
                    s: CharSequence?,
                    start: Int,
                    count: Int,
                    after: Int
                ) {
                }
                override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
                    adapter.filter.filter(s)
                }
                override fun afterTextChanged(s: Editable?) {}
            })

            listView.setOnItemClickListener { parent, view, position, id ->
                // When item selected from list
                // Set selected item on textView
//               val selectedItem = items[position]
//                var  name=selectedItem
                textview.text = adapter.getItem(position).toString()
                // Dismiss dialog
//                itemId
                for (i in cataloguelistResponse.maincategories)
                {
                    if(i.name==textview.text)
                    {
                        itemId=i.id
                        Picasso.get().load(i.image).into(imageview)
                       // showToast(itemId.toString())
                    }
                }
                dialog!!.dismiss()
            }
        }
    }