Android SearchView Icon

Question

I want to disable the Mag icon displayed inside the search view component. Any idea how to reference it and remove it or replace it with another drawable ?

Answer 1

Since the wording of the question does not contain any mention of ActionBarSherlock (except for the tag) and comments have been added that the accepted answer does not work for standard and/or support library action bar, I'm posting another answer. Here is the Java code for onCreate :

// obtain action bar
ActionBar actionBar = getSupportActionBar();

// find SearchView (im my case it's in a custom layout because of left alignment)
View v = actionBar.getCustomView();
SearchView searchView = (SearchView)v.findViewById(R.id.search_view);
ImageView icon = (ImageView)searchView.findViewById(android.support.v7.appcompat.R.id.search_mag_icon);

// method 1: does not work persistently, because the next line
// should be probably called after every manipulation with SearchView
// icon.setVisibility(View.GONE);

// method 2: working code
icon.setAdjustViewBounds(true);
icon.setMaxWidth(0);
icon.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
icon.setImageDrawable(null);

_{According to this post , while using a SearchView from the support library ( android-support-v7-appcompat in my case) with setIconifiedByDefault(false) the icon is displayed outside edit textbox ( SearchAutoComplete ). Otherwise ( setIconifiedByDefault(true) ) it's displayed inside the box. The presented code is used for disabled "iconification" by default, and may require some changes to work with "iconified" search view. I don't know if the same applies to ActionBarSherlock .}

Hope this helps.

Answer 2

This icon is hint. So you can simply set new hint text.

int searchPlateId = searchView.getContext().getResources().getIdentifier("android:id/search_src_text", null, null);
    EditText searchPlate = (EditText) searchView.findViewById(searchPlateId);

    searchPlate.setHint("Search");

If you want icon as hint text use spanable string with ImageSpan

int searchPlateId = searchView.getContext().getResources().getIdentifier("android:id/search_src_text", null, null);
    EditText searchPlate = (EditText) searchView.findViewById(searchPlateId);


    searchPlate.setTextColor(getResources().getColor(R.color.search_text_color));
    SpannableString string = new SpannableString(" ");
    Drawable d = getResources().getDrawable(R.drawable.ic_search);
    d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
    ImageSpan span = new ImageSpan(d, ImageSpan.ALIGN_BOTTOM);
    string.setSpan(span, 0, 1, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
    searchPlate.setHint(string);

Answer 3

In your theme:

<style name="Theme" parent="Your parent theme">
<item name="android:searchViewSearchIcon">@android:drawable/ic_search</item>
</style>

Edit:
searchViewSearchIcon is a private attribute. This answer therefore does not work (on the native ActionBar).

Answer 4

To remove the hint search button:

mNearMeSearchBar = (SearchView) mView.findViewById(R.id.nearme_search_component_nearme_edittext);
mNearMeSearchBar.setIconifiedByDefault(false); //Removes Search Hint Icon

To change the search button drawable:

int searchImgId = getResources().getIdentifier("android:id/search_mag_icon", null, null);
ImageView v = (ImageView) mNearMeSearchBar.findViewById(searchImgId);
v.setImageResource(R.drawable.ic_compass);

Answer 5

You have to add this line in your MenuItem android:iconifiedByDefault="@android:color/transparent"

<item
    android:id="@+id/activity_home_action_search"
    android:icon="@drawable/ic_action_search"
    android:title="@string/activity_home_search_title"
    android:iconifiedByDefault="@android:color/transparent"
    app:actionViewClass="android.support.v7.widget.SearchView"
    app:showAsAction="always|collapseActionView" />

Or you can make programatically searchView.setIconifiedByDefault(true);

@Override
public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
    super.onCreateOptionsMenu(menu, inflater);
    getMenuInflater().inflate(R.menu.home, menu);

    MenuItem searchMenuItem = menu.findItem(R.id.activity_home_action_search);

    SearchView searchView = (SearchView) searchMenuItem.getActionView();
    searchView.setIconifiedByDefault(true);
}

Answer 6

You have to customize the SearchView style like this:

<style name="MySearchViewStyle" parent="Widget.AppCompat.SearchView">
    <!-- Search button icon -->
    <item name="searchIcon">@drawable/ic_arrow_back</item>
</style>

And then add it in your AppTheme .

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!--   your other colors and styles -->
    <item name="searchViewStyle">@style/MySearchViewStyle</item>
</style>

And apply it to your search view using the tag style :

<android.support.v7.widget.SearchView
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/searchView"
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            app:queryHint="@string/search_hint"
            android:focusable="true"
            android:focusableInTouchMode="true"
            style="@style/MySearchViewStyle"
            app:iconifiedByDefault="false" />

Hope it helps!

Answer 7

If you are using the v7 app compat library you can easily change this in the theme. In your theme that extends from an AppCompat theme just add a line like:

<item name="searchViewSearchIcon">@drawable/ic_search</item>

Answer 8

These lines removed the magnifying glass:

    //remove search icon
    mSearchView.setIconifiedByDefault(false);
    ImageView icon = (ImageView) mSearchView.findViewById(android.support.v7.appcompat.R.id.search_mag_icon);
    icon.setVisibility(View.GONE);

Answer 9

In your theme style include this:

<style name="YourTheme.Toolbar">
    <item name="searchViewStyle">@style/YourActionBarSearch</item>
    <item name="editTextColor">@color/your_ab_text_color</item>
    <item name="android:textColorHint">@color/your_ab_hint_color</item>
</style>

You can now define the style of the SearchView with searchViewStyle , and editTextColor will set the color of the text in the search box. By setting android:textColorHint you will also set the color of the hint, eg "Search...".

<style name="YourActionBarSearch" parent="@style/Widget.Holo.SearchView">
    <item name="searchIcon">@drawable/ic_ab_search</item>
    <item name="queryBackground">@null</item>
    <item name="submitBackground">@null</item>
    <item name="searchHintIcon">@null</item>
    <item name="defaultQueryHint">@null</item>
    <item name="closeIcon">@drawable/ic_ab_small_search_close</item>
</style>

This will style your search view as you like, more or less. The field searchIcon is the icon in the action bar. The field searchHintIcon is the small icon to the left of the hint in the search field , which you are asking for in your question; set it to @null to remove the icon. The field closeIcon is the close icon at the right side of the search field.

Answer 10

在searchView组件的xml中添加下一个：

app:searchHintIcon="@null"