How to change the color of SearchView elements?

Question

I want to use SearchView in my project, but I have a problem with the color of the elements. Let me show you: its fragment of Dialog, where I have SearchView

I do not need to change the color of bg. For example, the following picture. I want to see SearchView elements without black bg.

I tried

• change topic
• change style
• change hue

but nothing works. Search icon and anoter elements are still white. Maybe I'm losing something? Can I do this in XML? Please help me.

Answer 1

You need to use android.support.v7.widget.SearchView

try this style in your search,

Before the searchview extension --->

After the extension of searchview --->

<android.support.v7.widget.SearchView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/search_view" style="@style/SearchViewStyle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentEnd="true" android:layout_centerVertical="true" android:layout_gravity="end" /> <style name="SearchViewStyle" parent="Widget.AppCompat.SearchView"> <!-- Gets rid of the search icon --> <item name="searchIcon">@drawable/ic_search</item> <!-- Gets rid of the "underline" in the text --> <item name="queryBackground">@color/white</item> <!-- Gets rid of the search icon when the SearchView is expanded --> <item name="searchHintIcon">@null</item> <!-- The hint text that appears when the user has not typed anything --> <item name="queryHint">@string/search_hint</item> </style> 

Answer 2

In this answer, I assume that the SearchView is SearchView added inside the Toolbar , and AppTheme is a child of Theme.AppCompat.Light.NoActionBar

 <style name="AppTheme.Toolbar" parent="AppTheme"> <!--This line changes the color of text in Toolbar--> <item name="android:textColorPrimary">@color/green</item> <!--This line changes the color of icons in toolbar (back, overflow menu icons)--> <item name="android:textColorSecondary">@color/green</item> </style> 

Now use AppTheme.Toolbar as a toolbar theme.

 <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay" app:theme="@style/AppTheme.Toolbar" /> 

Answer 3

 int searchiconId = view.getContext().getResources().getIdentifier("android:id/search_button",null,null); ImageView imgView = (ImageView)findViewById(searchiconId); Drawable whiteIcon = img.getDrawable(); whiteIcon.setTint(Color.RED); //Whatever color you want it to be img.setImageDrawable(whiteIcon); 

Answer 4

Try adding these lines to your style.

android:textColorPrimary changes the text that the user enters into an EditText. android:textColorSecondary changes the back arrow, the "delete text" cross and a small search icon in front of the tooltip.

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

Answer 5

So what was my problem. I used android.widget.SearchView instead of android.support.v7.widget.SearchView. I modified SearchView and after that the proposed solution started to work.

If someone can explain why styles and different things do not work or can give me a link, I would appreciate it.

Answer 6

You can change the look with the costume style in 'styles.xml':

 <style name="AppSearchView" parent="Widget.AppCompat.SearchView" > <!-- Text Size --> <item name="android:textSize">@dimen/textSizePrimary</item> <!-- Query Text Color --> <item name="android:textColorPrimary">@color/textColorPrimary</item> <!-- Hint Color --> <item name="android:textColorHint">@color/textColorDisabled</item> <!-- Icon Color --> <item name="android:tint">@color/textColorPrimary</item> </style> 

then use this style in your search:

 <android.support.v7.widget.SearchView android:layout_width="match_parent" android:layout_height="wrap_content" ... app:theme="@style/AppSearchView" />