Search code examples
androidandroid-actionbarstylesandroid-actionmode

How to change the background color of a TextView inside of an ActionMode


I have a TextView inside of my action bar, like the following:

non-action mode image

I have logic configured to make it overlay the Toolbar with an ActionMode when I long-press on an item in the associated ListView. This ends up looking like the following:

action mode image

This is basically correct, except for the annoying background around the TextView title in the ActionMode.

I've tried quite a few things, from changing the Widget.ActionMode style in my styles.xml file, to actually setting the actionModeStyle to a specific style. Nothing seems to affect this TextView, though.

I have read through How to change ActionMode background color in Android but it doesn't seem like anything I do has an effect on this background.

Side Note: It would be really nice if there were some way to view the style hierarchy on an Android device as it's rendered. The hierarchy viewer gets me about 1/3 of the way there, but it doesn't have any style information. Anyone know of such a tool that I could use to debug this problem?

styles.xml (only relevant stuff):

<style name="Material" parent="Theme.AppCompat.Light">
    <item name="textHeaderMaxLines">@integer/text_header_max_lines</item>
    <item name="trackAbstractMaxLines">@integer/track_abstract_max_lines</item>
    <item name="activatableItemBackground">@drawable/activatable_item_background</item>

    <!-- ActionMode Styles -->
    <item name="android:windowActionModeOverlay">true</item>
    <item name="windowActionModeOverlay">true</item>
    <item name="actionModeBackground">@color/app_green_dark</item>
</style>
<style name="Material.AppBar" parent="Theme.AppCompat.NoActionBar">
    <item name="android:textColorPrimaryInverse">@android:color/white</item>
    <item name="android:actionMenuTextColor">@android:color/white</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <item name="android:background">@color/app_green</item>
    <item name="android:color">@android:color/white</item>
    <item name="android:textColor">@android:color/white</item>
</style>
<style name="Material.AppBar.ActionMode" parent="Widget.AppCompat.Light.ActionMode.Inverse">
    <item name="android:background">@color/app_green_dark</item>
</style>

Solution

  • I think you can try to use the hack way to change the backgroud:

    Via Java:

    1. Use hierarchyviewer.bat to analyse the layout, focus on the ActionMode view, you can see below: (Title ID: action_bar_title, SubTitle ID:action_bar_subtitle)

    enter image description here

    2.Find the specify TextView by the ID we found above, and just do whatever you want!

    /**
     * To hack the title and subTitle in ActionMode
     */
    private void hack() {
        int titleID = Resources.getSystem().getIdentifier("action_bar_title", "id", "android");
        View titleView = getWindow().getDecorView().findViewById(titleID);
        if ((titleView != null) && (titleView instanceof TextView)) {
            ((TextView) titleView).setBackgroundColor(Color.RED);
        }
        int subTitleID = Resources.getSystem().getIdentifier("action_bar_subtitle", "id", "android");
        View subTitleView = getWindow().getDecorView().findViewById(subTitleID);
        if ((subTitleView != null) && (subTitleView instanceof TextView)) {
            ((TextView) subTitleView).setBackgroundColor(Color.GREEN);
        }
    }
    

    3.You can call this method when ActionMode create, for example: in onCreateActionMode(). Final result:

    enter image description here

    Via Style:

    Or you can try to set a android:actionModeStyle to control the title and subTitle background, but the android:background seems not work for it:

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="android:actionModeBackground">@android:color/white</item>
        <item name="android:actionModeStyle">@style/TestActionModeStyle</item>
    </style>
    
    <style name="TestActionModeStyle">
        <item name="android:titleTextStyle">@style/TestTitleStyle</item>
        <item name="android:subtitleTextStyle">@style/TestSubTitleStyle</item>
    </style>
    
    <style name="TestTitleStyle">
        <item name="android:textColor">@android:color/black</item>
        <item name="android:background">@android:color/holo_red_dark</item>
    </style>
    
    <style name="TestSubTitleStyle">
        <item name="android:textColor">@android:color/black</item>
        <item name="android:background">@android:color/holo_green_dark</item>
    </style>
    

    Edit:

    By the way:

    I think the most flexible way is custom you own ActionMode view, this can be easy to achieve, just set a custom view:

    @Override
    public boolean onCreateActionMode(ActionMode pMode, Menu pMenu) {
        RelativeLayout layout = (RelativeLayout) LayoutInflater.from(mContext).inflate(R.layout.custom_layout, null);
        findView(...);
        initView(...);
        pMode.setCustomView(layout);
        return true;
    }