Search code examples
androidandroid-layoutandroid-toolbarsearchviewandroid-theme

Changing textcolor of Searchview inside MaterialToolbar not working


I have a material.appbar layout and i have a searchview inside the menu. I am trying to change the color of text inside the searchview but it's not working for me. I have tried existing solutions mentioned in these posts and they didn't work for me. Any help?

My code:

<com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppBarOverlay">

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/topAppBar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:title="@string/home_page_title"
            app:subtitle="@string/home_page_subtitle"
            app:menu="@menu/top_app_bar"
            app:navigationIcon="@drawable/ic_baseline_menu"
            style="@style/searchview"
            />

    </com.google.android.material.appbar.AppBarLayout>


<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/search"
        android:icon="@drawable/search"
        android:title="@string/search"
        android:contentDescription="@string/content_description_search"
        app:actionViewClass="androidx.appcompat.widget.SearchView"
        app:showAsAction="ifRoom" />

</menu>

<style name="searchview" parent="Widget.MaterialComponents.Toolbar.Primary">
        <item name="android:textColorPrimary">@android:color/white</item>
        <item name="android:textColorSecondary">@android:color/white</item>
        <item name="android:editTextColor">@android:color/white</item>
        <item name="android:textSize">28sp</item>
    </style>

Solution

  • You can use:

        <com.google.android.material.appbar.MaterialToolbar
            android:theme="@style/ThemeOverlayToobar"
            ...>
    

    with:

    <style name="ThemeOverlayToobar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
        <item name="android:editTextColor">@color/....</item>
    </style>
    

    enter image description here

    If you want to change also the hint text color:

    <style name="ThemeOverlayToobar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
        <item name="android:editTextColor">@color/...</item>
        <item name="android:textColorHint">@color/...</item>
    </style>
    

    enter image description here