Set SearchView clear button color

Question

I am creating a searchview in the toolbar using onCreateOptionsMenu, but can't get the clear X button to initially be white. It becomes white when starting to type letters. It also stays white after clearing.

@Override
public boolean onCreateOptionsMenu(Menu menu)
{
    MenuInflater menuInflater = getMenuInflater();
    menuInflater.inflate(R.menu.responsible_menu, menu);
    SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE);
    SearchView searchView = (SearchView) menu.findItem(R.id.menu_search).getActionView();
    searchView.setSearchableInfo(searchManager.getSearchableInfo(getComponentName())); //TODO: May not be needed?

    searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener()
    {
        @Override
        public boolean onQueryTextSubmit(String query)
        {
            mAdapter.updateUIWithFilter(query);
            return false;
        }

        @Override
        public boolean onQueryTextChange(String newText)
        {
            mAdapter.updateUIWithFilter(newText);
            return false;
        }
    });

    // Does not work! Still not white.
    ImageView searchClose = (ImageView) searchView.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
    searchClose.setColorFilter(Color.argb(255, 255, 255, 255));

    searchClose.setAlpha(255);

    return true;
}

responsible_menu.xml:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:appcompat="http://schemas.android.com/apk/res-auto"
      xmlns:app="http://schemas.android.com/tools">

    <item
        android:id="@+id/menu_search"
        android:title="@string/search"
        appcompat:actionViewClass="android.support.v7.widget.SearchView"
        appcompat:showAsAction="always"/>

</menu>

Answer 1

Found a solution. However, interested in better ones.

Downloaded the "clear button" image from https://www.google.com/design/icons/#ic_clear in 24pt white and added this code to the end of onCreateOptionsMenu

    // Does help!
    ImageView searchClose = (ImageView) searchView.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
    searchClose.setImageResource(R.drawable.ic_clear_white_24dp);

Answer 2

You can also set it from XML. I'm using the support library 24.2.1 and an activity with a theme whose parent is "Theme.AppCompat.Light" and an android.support.v7.widget.SearchView in the ActionBar.

You can set an actionBarWidgetTheme in your activity theme like this:

<style name="ActivityTheme" parent="Theme.AppCompat.Light">
    <item name="actionBarWidgetTheme">@style/MyActionBarWidgetTheme</item>
</style>

And then define MyActionBarWidgetTheme and set the colours you want there:

<style name="MyActionBarWidgetTheme">
    <item name="android:textColorSecondary">@android:color/white</item>
</style>

• android:textColorSecondary applies to the close icon

• android:textColorPrimary applies to the text you enter

• colorControlActivated applies to the cursor

• android:textColorHint applies to the hint text

Answer 3

Try this:

    ImageView searchClose = searchView.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
    searchClose.setColorFilter(Color.WHITE, PorterDuff.Mode.SRC_ATOP);

Answer 4

You can use your own custom icon in place of searchview default cancel icon.

I have used below code which works well, Hope that will work for you.

private void setCloseSearchIcon(SearchView searchView) {
        try {
            Field searchField = SearchView.class.getDeclaredField("mCloseButton");
            searchField.setAccessible(true);
            ImageView closeBtn = (ImageView) searchField.get(searchView);
            closeBtn.setImageResource(R.drawable.ic_close);

        } catch (NoSuchFieldException e) {
            e.printStackTrace();
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        }
    }

This will work above api level 14.

Kotlin

private fun configureCloseButton(searchView: SearchView) {
    val searchClose =  searchView.javaClass.getDeclaredField("mCloseButton")
    searchClose.isAccessible = true
    val closeImage = searchClose.get(searchView) as ImageView
    closeImage.setImageResource(R.drawable.arrow_back_gray) // your image here
}