[Exposed DropDown Menu] Adding Icon and text for the selected view

[EnriekNP]

Greetings,

I have utilized the exposed dropdown menu functionality, and I am currently exploring options for overriding the selected dropdown view. Specifically, I am interested in customizing the display of the selected item to include both an icon and accompanying text. While I have successfully overridden the dropdown view, I have yet to implement the desired customization for the selected view. Currently, it returns an object in the format of "Object(icon=222, name=test)".

I would appreciate any guidance or assistance in achieving this customization.

Thank you for your attention to this matter

[afohrman]

Hi @EnriekNP, thanks for filing! Could you please share the code you're currently using to try to override the selected dropdown view? It would also be great if you could share a mock of what you're trying to achieve.

[EnriekNP]

ok , let me make it first

[EnriekNP]

this is the code and the look that i want @afohrman ...
the dropdown layout

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/layoutDropDown"
        style="@style/Widget.Material3.TextInputLayout.FilledBox.ExposedDropdownMenu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Test Exposed Drop Down"
        app:boxBackgroundColor="@null"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.MaterialAutoCompleteTextView
            android:id="@+id/autoComplelteTextView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:drawablePadding="10dp"
            android:dropDownHeight="175dp"
            android:inputType="none"
            android:textColor="@color/black" />
    </com.google.android.material.textfield.TextInputLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

the dropdown item layout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/dropdown"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/dropdown_item_icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginVertical="10dp"
        android:paddingStart="24dp"
        android:paddingEnd="12dp"
        tools:src="@drawable/ic_test" />

    <TextView
        android:id="@+id/dropdown_item_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:text="test" />
</LinearLayout>

the adapter

class TestAdapter(
    ctx: Context,
    resource: Int,
    private val items: List<Test>
) : ArrayAdapter<Test>(ctx, resource, items) {
    val inflater: LayoutInflater = LayoutInflater.from(ctx)

    override fun getItem(position: Int): Test {
        return items[position]
    }

    override fun getCount(): Int {
        return items.size
    }

    override fun getView(position: Int, convertView: View?, parent: ViewGroup): View {
        val view = convertView ?: inflater.inflate(
            R.layout.dropdown_item,
            parent,
            false
        )

        view.setPadding(0, view.paddingTop, view.paddingRight, view.paddingBottom)
        val item = items[position]
        val iconImageView = view.findViewById<ImageView>(R.id.dropdown_item_icon)
        iconImageView.setPadding(
            0,
            iconImageView.paddingTop,
            iconImageView.paddingRight,
            iconImageView.paddingBottom
        )
        val text1 = view.findViewById<TextView>(R.id.dropdown_item_name)
        iconImageView.setImageResource(item.icon)
        text1.text = item.name

        return view
    }

    override fun getDropDownView(position: Int, convertView: View?, parent: ViewGroup): View {
        return getView(position, convertView, parent)
    }

}

the class
data class Test(val icon: Int, val name: String)

and how i call the adapter in the fragment

        val listTest = getListItem()
        val testAdapter = TestAdapter(requireContext(), R.layout.dropdown_item,listTest)
        binding.autoComplelteTextView.setAdapter(testAdapter)

how it displaying

what i want is like this (sorry if it's not good, i just edit the image in figma)