CODEWITHSUNDEEP
androidstylesandroid-5.0-lollipoptoolbar
juanmeanwhile
juanmeanwhile

Reputation: 2634

Define toolbar gradient in styles.xml

I am trying to define a gradient background for a toolbar, but I am getting a weird effect where the gradient becomes the background of all the elements inside the toolbar:

toolbar propagating background

Other answers suggest to set the background at layout but I am interested in getting it working at style level. Ay suggestion? Thanks in advance!

My defined styles are the following:

   <style name="AppTheme" parent="@style/Theme.AppCompat.Light.NoActionBar">
      <!-- This puts the status bar translucent -->
      <item name="android:windowDrawsSystemBarBackgrounds">true</item>
      <item name="android:windowTranslucentStatus">true</item>

      <!-- set actionBar style. This att is referenced from layout to set the style-->
      <item name="android:actionBarStyle">@style/AppThemeToolBar</item>
   </style>

   <style name="AppThemeToolBar" parent="@style/Theme.AppCompat">
        <item name="android:icon">@drawable/ic_logo</item>
        <item name="android:background">@drawable/toolbar_background</item>
        <!-- trying to set a text without background but is being ignored -->
        <item name="android:titleTextStyle">@style/ToolBarTitle</item>
        <!-- also ignored -->
        <item name="android:titleTextAppearance">@style/ToolBarTitle</style>
   </style>

And this is the toolbar declaration at my layout xml:

<Toolbar
     android:id="@+id/toolbar"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:contentInsetEnd="0dp"
     app:contentInsetStart="0dp"
     android:layout_gravity="top"
     <!-- here actionBarStyle att is read -->
     app:theme="?attr/actionBarStyle"
     />

Upvotes: 3

Views: 1685

Answers (1)

juanmeanwhile
juanmeanwhile

Reputation: 2634

Solution is as simple/stupid as using toolbarStyle att at styles.xml:

    <style name="MyTheme">
       <item name="toolbarStyle">@style/NeoToolbarStyle</item>
       <item name="toolbarNavigationButtonStyle">@style/ToolbarNavigationButtonStyle</item>
   </style>

And of course my Toolbar style can be used as usual with android:background without getting the weird effect:

<style name="AppThemeToolBar" parent="@style/Widget.AppCompat.Toolbar">
    <item name="android:background">@drawable/my_beautiful_gradient</item>
</style>

Upvotes: 2

Related Questions