How to change searchview icon color? - android

I know there's already a lot of answers for this question here, and I wouldn't be creating another thread if I hadn't already tried everything I saw here.
Anyway, the question is pretty simple. I don't mind if the solution comes from XML styling or Java code (both solutions are welcome). I will show everything (most of it anyway) I've tried to solve it.
First of all, the searview icon seems to be immutable by code since I can't change anything from it. My searchview is declared in menu.xml as this
<item android:id="#+id/icon_search"
android:title="Searchador"
android:icon="#drawable/ic_search_black_24dp" <!-- icon not used by searchview anyway -->
android:showAsAction="always"
android:actionViewClass="android.widget.SearchView"
/>
and inside my onCreateOptionsMenu I have this
SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE);
searchMenuItem = menu.findItem(R.id.icon_search);
searchView = (SearchView) searchMenuItem.getActionView();
searchView.setSearchableInfo(searchManager.getSearchableInfo(getComponentName()));
searchView.setSubmitButtonEnabled(false);
searchView.setOnQueryTextListener(this);
MenuTint.colorIcons(this, menu, Color.BLUE);
return true;
The MenuTint.colorIcons(this, menu, Color.BLUE); I got from a special class I found here where it basically changes all my icons color, unfortunately not working for the searchview icon.
I then found some answers suggesting to use a style like this
<style name="SearchViewStyle" parent="Widget.AppCompat.SearchView">
<!-- changing my icon, its color and stuff.. -->
<item name="searchIcon">#drawable/ic_search</item></style>
but I was getting the No resource found that matches the given name 'Widget.AppCompat.SearchView'. error.
I then found that I should add the android-support-app-compat project library instead of just the .jar. It didn't work. I mean, the import worked, but the error kept showing. Then, I found somewhere that I should change the project.properties from target=android-19 to 21 (or higher) but it didn't solved the "No resource found" error.
So I'm pretty much stuck for this simple detail where I need to change the searchview color.
Also, this is not exactly the same question, but I believe it might be solved the in the same way so I will include here: I wanted to change distance between the icons. Someone suggested this solution
<style name="ActionButtonStyle" parent="AppBaseTheme">
<item name="android:minWidth">0dip</item>
<item name="android:paddingLeft">0dip</item>
<item name="android:paddingRight">0dip</item>
</style>
but I end up getting this
As you can see, this approach works for my custom icons only, but not for the searchview icon, neither for the menu overflow icon. I would like to change the distance between ALL icons equally.

If you want to change SearchView's search icon, you just need to get the image view within the view as follow:
searchView = v.findViewById(R.id.searchView);
//change icon color
ImageView searchIcon = searchView.findViewById(android.support.v7.appcompat.R.id.search_button);
searchIcon.setImageDrawable(ContextCompat.getDrawable(getActivity(),R.drawable.ic_search_icon));
It is important that the icon is R.id.search_button and you can replace it with a white vector asset that you provide, in this case R.drawable.ic_search_icon
Similarly, you can change the text within the SearchView as follows:
//set color to searchview
SearchView.SearchAutoComplete searchAutoComplete = searchView.findViewById(android.support.v7.appcompat.R.id.search_src_text);
searchAutoComplete.setHintTextColor(getResources().getColorandroid.R.color.white));
searchAutoComplete.setTextColor(getResources().getColor(android.R.color.white));

For android.x,
#Override
public boolean onCreateOptionsMenu(Menu menu) {
...
ImageView searchIcon=
searchView.findViewById(androidx.appcompat.R.id.search_mag_icon);
// To change color of close button, use:
// ImageView searchCloseIcon = (ImageView)searchView
// .findViewById(androidx.appcompat.R.id.search_close_btn);
searchIcon.setColorFilter(getResources().getColor(R.color.colorPrimary),
android.graphics.PorterDuff.Mode.SRC_IN);
...
return true;
}

final SearchView searchViewAndroidActionBar = (SearchView) MenuItemCompat.getActionView(searchViewItem);
// change close icon color
ImageView iconClose = (ImageView) searchViewAndroidActionBar.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
iconClose.setColorFilter(getResources().getColor(R.color.grey));
//change search icon color
ImageView iconSearch = searchViewAndroidActionBar.findViewById(android.support.v7.appcompat.R.id.search_button);
iconSearch.setColorFilter(getResources().getColor(R.color.grey));

To change the search view's icon color use the following lines of code:
SearchView searchView = (SearchView) findViewById(R.id.searchview);
ImageView icon = searchView.findViewById(android.support.v7.appcompat.R.id.search_button);
icon.setColorFilter(Color.BLACK);

You can change or customize the icons of the SearchView by adding you're own drawable icons.
<androidx.appcompat.widget.SearchView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
app:closeIcon="#drawable/close_icon"
app:searchHintIcon="#drawable/search_icon"
app:searchIcon="#drawable/search_icon"
android:textStyle="bold" />

Use below code:
MenuItem searchItem = menu.findItem(R.id.action_search);
SearchView mSearchView = (SearchView) searchItem.getActionView();
Drawable dr = searchItem.getIcon();
dr.setColorFilter(ContextCompat.getColor(this, R.color.colorPrimary), PorterDuff.Mode.SRC_ATOP);
OR:
dr.setColorFilter(BlendModeColorFilterCompat
.createBlendModeColorFilterCompat(Color.RED, BlendModeCompat.SRC_ATOP));

Take the Drawable you want to tint, wrap it with a tinted drawable , and set it as a new one for the search menu item:
#JvmStatic
fun getTintedDrawable(inputDrawable: Drawable, #ColorInt color: Int): Drawable {
val wrapDrawable = DrawableCompat.wrap(inputDrawable.mutate())
DrawableCompat.setTint(wrapDrawable, color)
DrawableCompat.setTintMode(wrapDrawable, Mode.SRC_IN)
return wrapDrawable
}
Usage:
val drawable =getTintedDrawable(...)
searchMenuItem.icon = drawable
And this should work for all Android versions that android-x (support library) supports.

Use below code:
ImageView searchIcon = searchView.findViewById(R.id.search_button);
searchIcon.setColorFilter(Color.WHITE);
If you want to change close icon color, use this one:
ImageView searchClose = searchView.findViewById(R.id.search_close_btn);
searchIcon.setColorFilter(Color.WHITE);

I have found that in later (2020) appCompat scenarios I have had trouble changing icon colors, but found this one to work:
(kotlin)
searchItem.icon.colorFilter = BlendModeColorFilterCompat.createBlendModeColorFilterCompat(Color.RED, BlendModeCompat.SRC_ATOP)

You can use theme in your layout
In your styles file define:
<style name="YourAppTheme.DarkSearchViewTheme">
<item name="colorControlNormal">#FFFFFF</item>
</style>
Then if you use menu inflation, you can apply this theme into your activity from the manifest
Or if you explicitly use SearcView widget in your layout, you can apply it into your widget by theme attribute like this:
<androidx.appcompat.widget.SearchView
android:theme="#style/YourAppTheme.DarkSearchViewTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

Related

How to customize expanded SearchView inside action bar in Android?

The default SearchView when expanded in the ActionBar looks like this image :
I want to customize expanded SearchView similar to this image :
I am pretty new in Android Development. I would highly appreciate if someone can help me.
SearchView for Androidx Package is composed by an EditText and some AppCompatImageView like the close icon and the search icon
To customize it you must access these views that I have talked about
for exmaple to change the background like the image you showed you need to create a shape like belew :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#02B15D" />
<corners android:radius="15dp" />
<stroke
android:width="2dp"
android:color="#1A40FF" />
</shape>
this is how it's look the shape :
The shape above you must add it in the background of the EditText
To get this EditText is simple just use this in you onCreateOptionMenu :
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_menu, menu);
SearchView searchView = (SearchView) menu.findItem(R.id.search).getActionView();
EditText editText = (searchView.findViewById(androidx.appcompat.R.id.search_src_text)); // get the EditText from it
editText.setBackgroundResource(R.drawable.round_search); // set the background to searchView
// you can do more with the editText like textColor hint color .....
return super.onCreateOptionsMenu(menu);
}
For customize the search icon use this
AppCompatImageView searchIcon = searchView.findViewById(androidx.appcompat.R.id.search_mag_icon);
For the search button shown the the toolBar use this :
AppCompatImageView search_button = searchView.findViewById(androidx.appcompat.R.id.search_button);
And finaly for the close button use this :
AppCompatImageView search_close_btn = searchView.findViewById(androidx.appcompat.R.id.search_close_btn);
And this how the result looks like :
UPDATE
To make the search icon visible at the left inside the SearchView you can add an icon to the EditText with this method :
editText.setCompoundDrawablesWithIntrinsicBounds(android.R.drawable.ic_menu_search,0,0,0);
If you use :
AppCompatImageView searchIcon = searchView.findViewById(androidx.appcompat.R.id.search_mag_icon); searchIcon.setImageResource(android.R.drawable.ic_menu_search);
you must add searchView.setIconifiedByDefault(false); but the icon becom visible outsid the shape please see the image below :
So if you want the icon inside the shape use the first method

How to change the autocomplete text color for search view inside of ActionBarSherlock with dark background?

I have my own theme for ActionBarSherlock based on Theme.Sherlock.Light.DarkActionBar, here are my styles:
<style name="Theme.MyTheme" parent="Theme.Sherlock.Light.DarkActionBar">
<item name="actionBarStyle">#style/Widget.MyTheme.ActionBar</item>
</style>
<style name="Widget.MyTheme.ActionBar" parent="Widget.Sherlock.Light.ActionBar.Solid.Inverse">
<item name="android:background">#drawable/action_bar</item>
<item name="background">#drawable/action_bar</item>
</style>
Where #drawable/action_bar is an xml:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle">
<solid android:color="#color/color_action_bar_bottom_line" />
</shape>
</item>
<item android:bottom="2dp">
<shape android:shape="rectangle">
<solid android:color="#color/color_action_bar_background" />
</shape>
</item>
</layer-list>
Everything looks great except one thing: the text in the SearchView (when I use the search mode in ActionBar) is "dark on dark", so I cannot see anything. I tried to set the text colors for SearchView manually:
AutoCompleteTextView searchTextView =
(AutoCompleteTextView) searchView.findViewById(R.id.abs__search_src_text);
searchTextView.setTextColor(Color.WHITE);
searchTextView.setHintTextColor(Color.LTGRAY);
searchTextView.setHighlightColor(Color.WHITE);
searchTextView.setLinkTextColor(Color.WHITE);
This helped a lot but I cannot change the color of autocomplete text:
As you see, it's still black. How can I set the white text color for this kind of text?
Try this code
SearchView searchView = new SearchView(context);
LinearLayout linearLayout1 = (LinearLayout) searchView.getChildAt(0);
LinearLayout linearLayout2 = (LinearLayout) linearLayout1.getChildAt(2);
LinearLayout linearLayout3 = (LinearLayout) linearLayout2.getChildAt(1);
AutoCompleteTextView autoComplete = (AutoCompleteTextView) linearLayout3.getChildAt(0);
autoComplete.setTextColor(Color.WHITE);
or
SearchView searchView = new SearchView(context);
AutoCompleteTextView search_text = (AutoCompleteTextView) searchView.findViewById(searchView.getContext().getResources().getIdentifier("android:id/search_src_text", null, null));
search_text.setTextColor(Color.WHITE);
It's from my own answer here How to set SearchView TextSize?
I solved this by disabling autocomplete feature (it will be disabled if you'll set the edit type to Visible Password), but this solution is not very good and I'm still in search for better one.
private SearchView getSearchView() {
SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE);
SearchView searchView = new SearchView(getSupportActionBar().getThemedContext());
searchView.setQueryHint("Search for items");
searchView.setSearchableInfo(searchManager.getSearchableInfo(getComponentName()));
AutoCompleteTextView searchTextView =
(AutoCompleteTextView) searchView.findViewById(R.id.abs__search_src_text);
if (searchTextView != null) {
searchTextView.setInputType(InputType.TYPE_CLASS_TEXT
| InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD);
searchTextView.setTypeface(Typeface.DEFAULT);
}
return searchView;
}
I think your are using a Light Theme with a custom dark action bar theme. You could try to change the theme of the AutoCompleteTextView to a dark one. Try to add this in your theme :
<style name="Widget.MyTheme.ActionBar" parent="Widget.Sherlock.Light.ActionBar.Solid.Inverse">
<item name="searchAutoCompleteTextView">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
<item name="android:searchAutoCompleteTextView">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
<item name="searchAutoCompleteTextViewStyle">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
<item name="android:searchAutoCompleteTextViewStyle">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
<item name="textAppearanceLargePopupMenu">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
<item name="android:textAppearanceLargePopupMenu">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
<item name="textAppearanceSmallPopupMenu">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
<item name="android:textAppearanceSmallPopupMenu">#style/Widget.Sherlock.SearchAutoCompleteTextView</item>
</style>
Edit : not sure about the added lines but you can try. I spot it in some fixes for the HoloEverywhere library.
May be there are is best way to do this , but used the very simple way, I used library for that
#Override
public boolean onCreateOptionsMenu(Menu menu) {
searchMenuItem = CollapsibleMenuUtils.addSearchMenuItem(menu, false,
textWatcher);
return true;
}
set the boolean value for true/false for setting Light/Dark theme
addSearchMenuItem(Menu menu, boolean isLightTheme, TextWatcher
textWatcher)
Adding collapsible search menu item to the menu.
Parameters: menu isLightTheme - true if use light them for ActionBar,
else false textWatcher
for changing the text color i changed the librery's layout/ holodark.xml
<AutoCompleteTextView
android:id="#+id/search_src_text"
android:layout_width="0dp"
.
.
android:textColor="#android:color/white" />
Here iam useing SearchView like this it's working nice searchtext color also in white color.
this one res/menu and name is applications_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/Accounts"
android:icon="#drawable/ic_launcher">
</item>
<item
android:id="#+id/menu_search"
android:actionViewClass="android.widget.SearchView"
android:icon="#drawable/ic_launcher"
android:showAsAction="ifRoom"
android:title="menu_search">
</item>
</menu>
this one use in activity when you search like this
new MenuInflater(this).inflate(R.menu.applications_menu, menu);
SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE);
SearchView searchView = (SearchView) menu.findItem(R.id.menu_search).getActionView();
searchView.setSearchableInfo(searchManager.getSearchableInfo(getComponentName()));
searchView.setIconifiedByDefault(false);
here is screen
The issue is that the SearchView is initialized without properly considering the ActionBar style (in this case Dark ActionBar on Light) that is set. And the answer is to use the ActionBar themed Context; retrieved by Activity.getActionBar().getThemedContext(). This is mentioned at the bottom of ABS Migration:
If you are using list navigation pay special attention to the 'List Navigation' example in the demos sample for direction on proper use. You need to use the library-provided layouts for both the item view and dropdown view as well as use the themed context from the action bar.
My code is how it is done in standard Android, you'd have to get the ActionBar however appropriate. If you pass the themed Context to the SearchView then it will use the appropriate style, namely, it won't render itself as if it were on a light background.

How to change SearchView default icon?

I've used "Android Action Bar Style Generator" in order to generate my own Holo theme.
Then I've added two icons to the action bar, one for a searchFilter and one for a file picker, both icons are white. File picker icon (at the right) looks good, but somehow search icon looks dark grey. When typing on the search text view, close button also looks dark grey.
I've tried changing color of the actionbar and also from the searchview, without success. Why is the search view showing this color? How can I change it?
Thank you very much.
UPDATE: I thought that my app was using my icon but it doesn't, it uses the default search view icon, so my question actually is, how do I change the default icon of the search view?
This sentence at the menu.xml file is not working:
android:icon="#drawable/selectable_header_search"
Unfortunately, there is no easy way to change the SearchView icon to a custom drawable, since the theme attribute searchViewSearchIcon is not public. See this answer for details.
However, I think that your problem is caused by inheriting from the wrong theme. Please use android:Theme.Holo.Light.DarkActionBar as the base for your theme. Then the default icons on the action bar should have a light color.
<style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar">
...
</style>
Since the searchViewSearchIcon attribute is not public, you can change the icon using the following code:
int searchIconId = searchView.getContext().getResources().getIdentifier("android:id/search_button",null, null);
ImageView searchIcon = (ImageView) searchView.findViewById(searchIconId);
searchIcon.setImageResource(R.drawable........);
Try to set up in the showAsAction this option: *MenuItem.SHOW_AS_ACTION_COLLAPSE_ACTION_VIEW*
Without this option the SearchView do not take the icon which you setup for action button.
menu.add("Search")
.setIcon(
getResources().getDrawable(
R.drawable.selectable_header_search))
.setActionView(searchView)
.setShowAsAction(
MenuItem.SHOW_AS_ACTION_ALWAYS
| MenuItem.SHOW_AS_ACTION_COLLAPSE_ACTION_VIEW
| MenuItem.SHOW_AS_ACTION_WITH_TEXT);
The easiest way I've found to change the default searchview icon in the action bar is in your onPrepareOptionsMenu. You can see my answer here to a similar question!
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, e.g. "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">#drawable/ic_ab_small_search</item>
<item name="defaultQueryHint">#string/toolbar_search_hint</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. The field closeIcon is the close icon at the right side of the search field.
Check this out, for more style settings:
$ANDROID_SDK/platforms/android-24/data/res/values/styles_holo.xml
For those like me hoping to find a way to truly change the icon, you can use this with actionbar sherlock:
// Getting the 'search_icon'
ImageView searchIcon = (ImageView)searchView.findViewById(R.id.abs__search_button);
// Setting background of 'search_plate' to earlier defined drawable.
searchIcon.setImageResource(R.drawable.search_button_selector);
You can't change the default one with the common way android:icon, because the field related to it had been set to private.

Android SearchView Icon

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 ?
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.
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);
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).
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);
}
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);
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!
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>
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);
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, e.g. "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.
In xml in searchView component add next :
app:searchHintIcon="#null"

SearchView drawables in ActionBar appear blurred

I have the following menu layout for my ActionBar:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/itemSearch"
android:icon="#drawable/actionbar_icon_search"
android:showAsAction="ifRoom|collapseActionView"
android:actionViewClass="android.widget.SearchView"
android:title="Search"/>
</menu>
And here's the setup code:
#Override
public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
inflater.inflate(R.menu.actionbar_default, menu);
SearchView searchView=(SearchView) menu.findItem(R.id.itemSearch).getActionView();
int searchPlateId = searchView.getContext().getResources().getIdentifier("android:id/search_src_text", null, null);
View searchEditText = searchView.findViewById(searchPlateId);
((TextView) searchEditText).setTextColor(Color.WHITE);
searchView.setOnCloseListener(new OnCloseListener() {...});
searchView.setOnQueryTextListener(new OnQueryTextListener() {...});
}
Everything is ok, except for one thing: on my Asus tablet (TF-201, Android 3.2.1) graphics are blurred:
If I remove android:actionViewClass="android.widget.SearchView", everything looks normal:
This problem is not reproduced on 4.1.2 emulator. I tried leaving only menu inflation code in my onCreateOptionsMenu() but that didn't help.
How do I fix this?
So I beat up the solution, however, it declares right compatibility only for API 14 and above, if not using ActionBarSherlock library.
First solution (API 14+)
Important is to be connected to Themed Context of application, otherwise you get lowest possible design for SearchView (blurry icons)
Creating SearchView programmatically
FRAGMENT
SearchView searchView =
new SearchView(getActivity().getActionBar().getThemedContext());
ACTIVITY
SearchView searchView = new SearchView(getActionBar().getThemedContext());
Second solution (ABS compatibility, API 8+)
ACTION BAR SHERLOCK FRAGMENT
SearchView searchView =
new SearchView(getSherlockActivity().getSupportActionBar().getThemedContext());
ACTION BAR SHERLOCK ACTIVITY
SearchView searchView = new SearchView(getSupportActionBar().getThemedContext());
Third solution (API 11+)
In some cases, setting SearchView.setBackgroundColor(int color) makes the icon appear less blurry, try Color.WHITE or Color.BLACK
Note that this changes background color for MenuItem whether collapsed or not, and eg. by using Theme Holo.Light.DarkActionBar you need to use right color, according to your ActionBar style.
I experienced same problem but other answer did not resolve my problem. I am extending my activity class from AppCompatActivity. My searchview icon was looking blurry on Android 4.* and it was looking good on Android 5.* without any problem.
I changed my xml to this:
<item android:id="#+id/action_search"
android:icon="#drawable/ic_search_white_24dp"
app:showAsAction="always"
app:actionViewClass="android.support.v7.widget.SearchView"
android:iconifiedByDefault="true" />
And imported
import android.support.v7.widget.SearchView;
Instead of import android.widget.SearchView;
And problem fixed.

Categories

Resources