CODEWITHSUNDEEP
androidandroid-layoutandroid-actionbarandroid-styles
Soon Santos
Soon Santos

Reputation: 2219

SearchView style disturbs Toolbar Style Actionbar

WHAT I NEED: I need the action bar with white text like this one:

Action bar with White Text

And the SearchView Recent Query Suggestions customized like this one:

Suggestions customized

PROBLEM: I can do both of them, but I can not do them at the same time, when I set the title to white, the suggestions style dissapear. I'll show how I am handling this.

SUGGESTIONS LAYOUT

styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    ...
    <item name="searchViewStyle">@style/MySearchViewStyle</item>
</style>
<style name="MySearchViewStyle" parent="Widget.AppCompat.SearchView" >
    <item name="suggestionRowLayout">@layout/item_suggestions</item>
</style>

@layout/item_suggestions: This is where I customize the layout of the suggestions items and it WORKS perfectly.

ACTION BAR STYLE

As my AppTheme is Light, my default title for the action bar and buttons are black. To override (white title and icons) I do the following:

<android.support.design.widget.AppBarLayout
    ...>

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

styles.xml

<style name="ThemeOverlay.MyApp.ActionBar" parent="ThemeOverlay.AppCompat.ActionBar">
    <item name="android:textColorPrimary">@color/colorWhite</item>
</style>

FINAL PROBLEM: When I apply this theme for the action bar to get the white text and icons. BOWN, the theme for the SearchView suggestions does not work anymore. What would be a clever way to achieve both at the same time?

WHAT I ALREADY TRIED

I already tried to change the style of the action bar in styles.xml (looked for thousand of questions) but could not achieve the desired result.

Upvotes: 2

Views: 453

Answers (1)

Soon Santos
Soon Santos

Reputation: 2219

I created a Dark ActionBar Style, so its buttons, titles, subtitles will be white (as I want). And then I set this style to my action bar.

Then, I set the SearchView style inside the CustomActionBar style.

WARNING: If I set my searchViewStyle outside of the CustomActionBar it will not work, it must be inside the CustomActionBar style to work.

<style name="CustomActionBar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="searchViewStyle">@style/MySearchViewStyle</item>
</style>

<android.support.design.widget.AppBarLayout
    android:theme="@style/CustomActionBar">

    <android.support.v7.widget.Toolbar 
         .../>

    <android.support.design.widget.TabLayout
         .../>

</android.support.design.widget.AppBarLayout>

Upvotes: 2

Related Questions