Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Unable to style action mode when using Toolbar

I'm not sure if this is a bug or somehow I'm not using the new Toolbar class properly.

I'm able to successfully theme the ActionBar directly using one of the available themes. This also allows me to theme the ActionMode. Everything works perfect as expected. Here is how I'm doing that.

<style name="Theme.ActionBar" parent="@style/Theme.AppCompat.Light.DarkActionBar">
        <item name="actionModeBackground">@drawable/action_mode_background</item>
</style>

Now I'm looking for a little more flexibility so I'm trying to use the new Toolbar from the support library. Perfect the Toolbar implemented and working fine, however, now the action mode no longer working as expected. The custom background not working and the action mode bar is pushing the Toolbar down.

To fix the pushing down issue I used the flag windowActionModeOverlay.

<style name="Theme.ActionBar" parent="@style/Theme.AppCompat.Light.DarkActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowActionModeOverlay">true</item>
        <item name="actionModeBackground">@drawable/action_mode_background</item>
</style>

In my Activity I do the following to make my Toolbar the default ActionBar.

Toolbar toolbar = (Toolbar) findViewById(R.id.toolBar);
setSupportActionBar(toolbar);

Right now I have tried so many things. I even tried diving into the source to figure out what is going on.

Any ideas why this is happening? How can I style the ActionMode? Or more specifically how can I change the background of the ActionMode?


Update 1
I noticed that when adding <item name="windowActionBar">false</item> to my activity theme the action mode looses its theme versus having it as true. Obviously setting it as true it would include the window action bar.


Update 2
I was able to get the action mode themed properly using a couple mods.

  1. The action mode background. Turns out you just set the background directly on the ActionMode theme as android:background! Also, the text you need to specify it on the theme.

    <item name="actionModeStyle">@style/Widget.ActionMode</item>` 
    <style name="Widget.ActionMode" parent="@style/Widget.AppCompat.ActionMode">
        <item name="android:background">@drawable/action_mode_background</item>
        <item name="titleTextStyle">@style/TitleTextStyle</item>
    </style>
    
  2. The back arrow not getting styled. I overwrote the drawable used and just added my own in white.

    <item name="actionModeCloseDrawable">@drawable/ic_arrow_back_white_24dp</item>`
    
like image 339
Jona Avatar asked Feb 06 '15 21:02

Jona


People also ask

What is difference between Action bar and Toolbar in android?

What is the difference between the toolbar and the action bar? The most obvious difference between the two is the updated visual design of the toolbar. The toolbar no longer includes an icon on the left side and decreases some of the spacing between the action items on the right side.

What is androidx appcompat widget Toolbar?

androidx.appcompat.widget.Toolbar. A standard toolbar for use within application content. A Toolbar is a generalization of action bars for use within application layouts.

What is the use of Toolbar in android?

In Android applications, Toolbar is a kind of ViewGroup that can be placed in the XML layouts of an activity. It was introduced by the Google Android team during the release of Android Lollipop(API 21). The Toolbar is basically the advanced successor of the ActionBar.

In which version of android was the Toolbar introduced?

Toolbar was introduced in Android Lollipop, API 21 release and is the spiritual successor of the ActionBar.


1 Answers

Well, I was finally able to properly style the action mode after digging through some styles, themes, attrs, and code from the support library.

Before I provide the solution to my question I have to mention that there seems to be a bug with the support library. It seems to loose the set theme for the action mode when you hide the window action bar. I have reported a bug to see if they fix this or provide more details.

So the solution was to essentially style the background, text, and close icon my self. Doing this required using my own ActionMode style and changing an attribute pointer to the close icon.

themes.xml

<style name="Theme.Main.Home">
     <item name="windowActionModeOverlay">true</item>
     <item name="actionModeStyle">@style/Widget.ActionMode</item>
     <item name="actionModeCloseDrawable">@drawable/ic_arrow_back_white_24dp</item>
</style>

styles.xml

<style name="Widget.ActionMode" parent="@style/Widget.AppCompat.ActionMode">
    <item name="android:background">@drawable/action_mode_background</item>
    <item name="titleTextStyle">@style/TitleTextStyle</item>
</style>
  • Background
    This was tricky because actionModeBackground doesn't work for setting the background of the action mode. You must change the background via the standard android:background on the ActionMode style.
  • Title text
    Simply providing a general style for the titleTextStyle allowed changing the text color.
  • Close icon
    Downloaded the materials icons and added the close icon my self using the actionModeCloseDrawable attr.
like image 178
Jona Avatar answered Sep 21 '22 08:09

Jona