CODEWITHSUNDEEP
androidsearchandroid-actionbar
Juhani
Juhani

Reputation: 5108

Changing action bar searchview hint text color

How can I change the action bar search view hint text colour?

This question explains how to get the EditText when using ABS: Android ActionBar Customize Search View

Is there a android.R.id I could use to get a reference to the EditText so I could change the hint colour? Or is there some other way to change the colour?

Action bar search view hint text

Upvotes: 59

Views: 90127

Answers (18)

Kirill
Kirill

Reputation: 938

android:actionBarWidgetTheme of your main theme should point to a style that has a android:textColorHint in it. That one will allow changing the hint text color of the search view.

Upvotes: 66

Mazhar Ali
Mazhar Ali

Reputation: 121

this worked for me :-)

 EditText seartext = searchView.findViewById(R.id.search_src_text);
    seartext.setTextColor(Color.WHITE);
    seartext.setHintTextColor(Color.GRAY);

Upvotes: 6

Zin Myo Oo
Zin Myo Oo

Reputation: 106

If you want to change left arrow button in search view, add app:collapseIcon.

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary"
        app:collapseIcon="@drawable/ic_search_view_home"
        />

If you want to change text color and text hint color, add the following.

EditText searchEditText = searchView.findViewById(android.support.v7.appcompat.R.id.search_src_text);
    searchEditText.setTextColor(Color.WHITE);
    searchEditText.setHintTextColor(Color.WHITE);

If you want to change close icon, add the following.

ImageView imvClose = searchView.findViewById(android.support.v7.appcompat.R.id
            .search_close_btn);
    imvClose.setImageResource(R.drawable.ic_search_view_close);

Upvotes: 7

sud007
sud007

Reputation: 6141

This is really simple to achieve using the styles.xml Just understand that themeing the SearchView is directly related to the theme of the Toolbar from whose menu.xml it is fetched as a app:actionViewClass.

  1. Create a style for Toolbar.
  2. Apply that style as theme on the Toolbar and it changes al the related views and their properties.

Upvotes: 1

Manvendra Priyadarshi
Manvendra Priyadarshi

Reputation: 255

The solution to change color of Search View Hint Text is :

 SearchView.SearchAutoComplete searchAutoComplete = (SearchView.SearchAutoComplete)searchView.findViewById(android.support.v7.appcompat.R.id.search_src_text);
 searchAutoComplete.setHintTextColor(Color.GRAY);

Upvotes: 2

Jignesh Goyani
Jignesh Goyani

Reputation: 1020

Try this code. It is very easy.

    // Associate searchable configuration with the SearchView
        SearchManager searchManager =
                (SearchManager) getSystemService(Context.SEARCH_SERVICE);
        SearchView searchView =
                (SearchView) menu.findItem(R.id.search).getActionView();
        EditText searchEditText = (EditText) searchView.findViewById(android.support.v7.appcompat.R.id.search_src_text);
           searchEditText.setHint("Search");
        searchEditText.setHintTextColor(getResources().getColor(R.color.white));
        searchView.setSearchableInfo(searchManager.getSearchableInfo(getComponentName()));

searchEditText.setHintTextColor(getResources().getColor(R.color.white));

Upvotes: 3

Jarett Millard
Jarett Millard

Reputation: 5958

With the most recent appcompat library (or if you're targeting 5.0+), this is possible to do purely in XML using a ThemeOverlay:

<style name="ThemeOverlay.MyApp.ActionBar" parent="ThemeOverlay.AppCompat.ActionBar">
    <item name="autoCompleteTextViewStyle">@style/Widget.MyApp.AutoCompleteTextView.SearchView</item>
</style>

<style name="Widget.MyApp.AutoCompleteTextView.SearchView" parent="Widget.AppCompat.AutoCompleteTextView">
    <item name="android:textColor">#000</item>
    <item name="android:textColorHint">#5000</item>
</style>

And then in your layout file:

<android.support.v7.widget.Toolbar
    app:theme="@style/ThemeOverlay.MyApp.ActionBar"
    ... />

If you also want it to apply to activities that are using an ActionBar instead of a Toolbar, you can add this to the Activity's theme:

<style name="Theme.MyApp" parent="Theme.AppCompat">
    <item name="actionBarTheme">@style/ThemeOverlay.MyApp.ActionBar</item>
    ...
</style>

Upvotes: 5

Deepak Gupta
Deepak Gupta

Reputation: 989

By using this you can change the Searchable xml

  1. Search text hint color
  2. Search Text
  3. Search close icon
  4. Search hint icon
  5. Search plate
int searchHintBtnId = searchView.getContext().getResources()
                    .getIdentifier("android:id/search_mag_icon", null, null);
     int hintTextId = searchView.getContext()
                    .getResources()
                    .getIdentifier("android:id/search_src_text", null, null);
            int closeBtnId = searchView.getContext()
                    .getResources()
                    .getIdentifier("android:id/search_close_btn", null, null);
            // Set the search plate color to white
            int searchPlateId = getResources().getIdentifier("android:id/search_plate", null, null);

            View view = searchView.findViewById(searchPlateId);
            view.setBackgroundResource(R.drawable.search_plate);

            ImageView closeIcon = (ImageView) searchView.findViewById(closeBtnId);
            closeIcon.setImageResource(R.drawable.close);

            ImageView searchHintIcon = (ImageView) searchView.findViewById(searchHintBtnId);
            searchHintIcon.setImageResource(R.drawable.search);

            TextView textView = (TextView) searchView.findViewById(hintTextId);
            textView.setTextColor(getResources().getColor(R.color.search_text_color));
            textView.setHintTextColor(getResources().getColor(R.color.search_hint_text_color));

Here is drawable/search_plate.xml 

<!-- main color -->
<item android:bottom="1dp"
    android:left="1dp"
    android:right="1dp">
    <shape >
        <solid android:color="@color/app_theme_color" />
    </shape>
</item>

<!-- draw another block to cut-off the left and right bars -->
<item android:bottom="10.0dp">
    <shape >
        <solid android:color="@color/app_theme_color" />
    </shape>
</item> </layer-list>

Upvotes: 2

Syed Raza Mehdi
Syed Raza Mehdi

Reputation: 4117

this worked for me, hope it helps

((EditText) searchView.findViewById(android.support.v7.appcompat.R.id.search_src_text)).setHintTextColor(getResources().getColor(R.color.white));

also see this

Upvotes: 19

Ferdous Ahamed
Ferdous Ahamed

Reputation: 21736

Just get the textView id of search widget and use setTextColor() method to change the search text color and setHintTextColor() to change the search hints text color.

// Get textview id of search widget
int id =  searchView.getContext().getResources().getIdentifier("android:id/search_src_text", null, null);
TextView textView = (TextView) searchView.findViewById(id);

// Set search text color
textView.setTextColor(Color.WHITE);

// Set search hints color
textView.setHintTextColor(Color.GRAY);

Upvotes: 6

Andrey Degtiarev
Andrey Degtiarev

Reputation: 87

int id = searchView.getContext().getResources().getIdentifier("android:id/search_src_text", null, null);
TextView textView = (TextView) searchView.findViewById(id);
textView.setTextColor(Color.WHITE);
textView.setHintTextColor(Color.WHITE);

Upvotes: 1

Amr Angry
Amr Angry

Reputation: 3831

SearchView searchView= (SearchView) findViewById(R.id.searchView1);
int id = searchView.getContext()
                   .getResources()
                   .getIdentifier("android:id/search_src_text", null, null);
TextView textView = (TextView) searchView.findViewById(id);
textView.setTextColor(Color.WHITE);

Upvotes: 26

Kokusho
Kokusho

Reputation: 1123

I resolved it adding this property to the main theme:

<style name="AppTheme" parent="AppBaseTheme">
    .....
    .....
    <item name="android:actionBarWidgetTheme">@style/MyActionBarWidgetTheme</item> 
</style>

And then add the property i want to change in this case the hint color.

<style name="MyActionBarWidgetTheme" parent="@android:style/Theme.Holo">
    .....
    .....
    <item name="android:textColorHint">@color/blanco_60</item>
</style>

Hope it helps :D

Upvotes: 12

johnarleyburns
johnarleyburns

Reputation: 1572

Here's specifically how you apply the style as hinted at above. The right answer is to overload the action bar widget style with your own custom style. For holo light with dark action bar, put this in your own styles file such as res/values/styles_mytheme.xml:

<style name="Theme.MyTheme" parent="@android:style/Theme.Holo.Light.DarkActionBar">
    <item name="android:actionBarWidgetTheme">@style/Theme.MyTheme.Widget</item>
    <!-- your other custom styles -->
</style>

<style name="Theme.MyTheme.Widget" parent="@android:style/Theme.Holo">
    <item name="android:textColorHint">@android:color/white</item>
    <!-- your other custom widget styles -->
</style>

Make sure your application is using theme custom theme as described in enter link description here

Upvotes: 9

jfcartier
jfcartier

Reputation: 1096

A SearchView object extends from LinearLayout, so it holds other views. The trick is to find the view holding the hint text and change the colour programmatically. By traversing the view hierarchy, you can find the widget containing the hint text:

// get your SearchView with its id
SearchView searchView = (SearchView) menu.findItem(R.id.search).getActionView();
// traverse the view to the widget containing the hint text
LinearLayout ll = (LinearLayout)searchView.getChildAt(0);
LinearLayout ll2 = (LinearLayout)ll.getChildAt(2);
LinearLayout ll3 = (LinearLayout)ll2.getChildAt(1);
SearchView.SearchAutoComplete autoComplete = (SearchView.SearchAutoComplete)ll3.getChildAt(0);
// set the hint text color
autoComplete.setHintTextColor(getResources().getColor(Color.WHITE));

This method works with any theme. Also, you can change the look of other widgets in the SearchView hierarchy, such as the EditText holding the search query.

Upvotes: 7

Vadim Teselkin
Vadim Teselkin

Reputation: 854

searchView.setQueryHint(Html.fromHtml("<font color = #ffffff>" + getResources().getString(R.string.hintSearchMess) + "</font>"));

Upvotes: 67

sonida
sonida

Reputation: 4411

Look to this class, it can help you to solve your problem

import android.R.color;
import android.content.Context;
import android.graphics.Typeface;
import android.widget.ImageView;

import com.actionbarsherlock.widget.SearchView;
import com.actionbarsherlock.widget.SearchView.SearchAutoComplete;

public class MySearchView {

    public static SearchView getSearchView(Context context, String strHint) {
        SearchView searchView = new SearchView(context);
        searchView.setQueryHint(strHint);
        searchView.setFocusable(true);
        searchView.setFocusableInTouchMode(true);
        searchView.requestFocus();
        searchView.requestFocusFromTouch();

        ImageView searchBtn = (ImageView) searchView.findViewById(R.id.abs__search_button);
        searchBtn.setImageResource(R.drawable.ic_menu_search);

        // ImageView searchBtnClose = (ImageView) searchView.findViewById(R.id.abs__search_close_btn);
        // searchBtnClose.setImageResource(R.drawable.ic_cancel_search_bar);


        SearchAutoComplete searchText = (SearchAutoComplete) searchView.findViewById(R.id.abs__search_src_text);
        setFont(context, searchText);
        searchText.setTextColor(context.getResources().getColor(color.white));
        searchText.setHintTextColor(context.getResources().getColor(color.white));

        return searchView;
    }

    private static void setFont(Context _context, SearchAutoComplete searchText) {
        Typeface tf = null;
        Typeface currentType = searchText.getTypeface();
        if (currentType == null) {
            tf = MyApplication.fontNormal;
        }
        else {
            int currentStyle = currentType.getStyle();
            if (currentStyle == Typeface.BOLD) {
                tf = MyApplication.fontBold;
            }
            else if (currentStyle == Typeface.BOLD_ITALIC) {
                tf = MyApplication.fontBoldItalic;
            }
            else if (currentStyle == Typeface.ITALIC) {
                tf = MyApplication.fontItalic;
            }
            else {
                tf = MyApplication.fontNormal;
            }
        }
        searchText.setTypeface(tf);
    }

    public static SearchView getSearchView(Context context, int strHintRes) {
        return getSearchView(context, context.getString(strHintRes));
    }
}

Upvotes: 2

Moritz
Moritz

Reputation: 10352

Also you can set the SearchView on your menuItem manually and thereby have full control over the view.

Upvotes: 0

Related Questions