Customizing android.widget.SearchView

Question

Is it possible to customize layout of android.widget.SearchView (I'm using it in actionBar)?

I want to change icon and TextField background.

Answer 1

I've found the only one way to do that- to use reflections.

SearchView mSearchView = (SearchView)menu.findItem(R.id.search).getActionView();
    try
    {
        Field searchField = SearchView.class.getDeclaredField("mSearchButton");
        searchField.setAccessible(true);
        ImageView searchBtn = (ImageView)searchField.get(mSearchView);
        searchBtn.setImageResource(R.drawable.search_img);
        searchField = SearchView.class.getDeclaredField("mSearchPlate");
        searchField.setAccessible(true);
        LinearLayout searchPlate = (LinearLayout)searchField.get(mSearchView);
        ((ImageView)searchPlate.getChildAt(0)).setImageResource(R.drawable.search_img);
        searchPlate.setBackgroundResource(R.drawable.edit_text_bkg);
    }
    catch (NoSuchFieldException e)
    {
        Log.e(TAG,e.getMessage(),e);
    }
    catch (IllegalAccessException e)
    {
        Log.e(TAG,e.getMessage(),e);
    }

Answer 2

If you use Appcompat v7, there is a way to do it without using reflection:

Declare the following style, and customize only those properties you need to customize, remove the rest (so they are inerhited from the parent style):

<style name="Widget.AppCompat.SearchView.CustomSearchView" parent="@style/Widget.AppCompat.SearchView">
    <item name="layout">@layout/abc_search_view</item>
    <item name="queryBackground">@drawable/abc_textfield_search_material</item>
    <item name="submitBackground">@drawable/abc_textfield_search_material</item>
    <item name="closeIcon">@drawable/abc_ic_clear_mtrl_alpha</item>
    <item name="goIcon">@drawable/abc_ic_go_search_api_mtrl_alpha</item>
    <item name="voiceIcon">@drawable/abc_ic_voice_search_api_mtrl_alpha</item>
    <item name="commitIcon">@drawable/abc_ic_commit_search_api_mtrl_alpha</item>
    <item name="suggestionRowLayout">@layout/abc_search_dropdown_item_icons_2line</item>
    <item name="searchIcon">@drawable/ic_action_search</item>
</style>

Now, in your theme, use the same property:

<item name="searchViewStyle">@style/Widget.AppCompat.SearchView.Bonial</item>

Of course, your theme must inherit from one of the AppCompat themes, in my case, it was something like this:

<style name="Theme.MyActionBarActivity" parent="@style/Theme.AppCompat.Light">

Also your activities should extend ActionBarActivity and use the "support" version of the action bar methods. More info here.

I also read an article of a guy that declared the styles in some other way, but also using AppCompat v7: http://www.jayway.com/2014/06/02/android-theming-the-actionbar/

Answer 3

If you are using android native SearchView and you want to change small search icon, which appears when searchView is expanded, then you are in trouble. Because attribute searchViewSearchIcon is internal, and can't be modified using styles.

Code snippet from SearchView class:

private int getSearchIconId() {
    TypedValue outValue = new TypedValue();
    getContext().getTheme().resolveAttribute(com.android.internal.R.attr.searchViewSearchIcon,
            outValue, true);
    return outValue.resourceId;
}

Answer 4

In ActionBarSherlock:

<style name="Your_Theme" parent="@style/Theme.Sherlock">
    <item name="searchViewSearchIcon"> @drawable/ic_menu_search </item>
</style>

In Holo:

<style name="Your_Theme" parent="@style/Theme.Light">
    <item name="android:searchViewSearchIcon"> @drawable/ic_search </item> 
</style>