[TabSelectionEditor] Update style for incognito

This CL updates TabSelectionEditor to use the same color palette as Dark
mode.

Change-Id: I005f9c23f684e96f22a3075db231d2c6e2cd2d17
Bug: 996943
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1772120
Commit-Queue: Mei Liang <meiliang@chromium.org>
Reviewed-by: Wei-Yin Chen (陳威尹) <wychen@chromium.org>
Reviewed-by: Theresa  <twellington@chromium.org>
Cr-Commit-Position: refs/heads/master@{#696928}

chrome/android/features/tab_ui/java/res/color/dark_text_color_list.xml

+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright 2019 The Chromium Authors. All rights reserved.
+     Use of this source code is governed by a BSD-style license that can be
+     found in the LICENSE file.
+-->
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:alpha="@dimen/default_disabled_alpha"
+        android:color="@color/default_text_color_dark" android:state_enabled="false"/>
+    <item android:color="@color/default_text_color_dark" />
+</selector>
\ No newline at end of file

chrome/android/features/tab_ui/java/res/drawable/tab_grid_selection_list_icon.xml

@@ -6,6 +6,7 @@
 <level-list xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:maxLevel="@integer/list_item_level_default">
         <shape android:shape="oval">
+            <solid android:color="@android:color/transparent"/>
             <stroke
                 android:width="2dp"
                 android:color="@color/default_icon_color"/>

chrome/android/features/tab_ui/java/res/values/styles.xml

@@ -6,9 +6,14 @@
      found in the LICENSE file.
 -->
 
-<resources xmlns:tools="http://schemas.android.com/tools">
-    <!-- TODO(996512): Consider to add this TextAppearance to the main styles.xml -->
-    <style name="TextAppearance.BlueTitle2Incognito" parent="TextAppearance.BlueTitle2" tools:ignore="UnusedResources">
+<resources>
+    <!-- TODO(996512): Consider to add these TextAppearance to the main styles.xml. These are non adaptive colors. -->
+    <style name="TextAppearance.BlueTitle2Incognito" parent="TextAppearance.BlueTitle2">
         <item name="android:textColor">@color/modern_blue_300</item>
     </style>
+
+    <style name="TextAppearance.BlackHeadline.Black" parent="TextAppearance.WhiteHeadline">
+        <item name="android:textColor">@color/default_text_color_dark</item>
+    </style>
+
 </resources>

chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabGridViewBinder.java

@@ -11,6 +11,7 @@ import android.graphics.drawable.InsetDrawable;
 import android.os.Build;
 import android.support.graphics.drawable.AnimatedVectorDrawableCompat;
 import android.support.v4.content.res.ResourcesCompat;
+import android.support.v4.graphics.drawable.DrawableCompat;
 import android.support.v4.view.ViewCompat;
 import android.view.View;
 import android.view.ViewGroup;
@@ -127,8 +128,6 @@ class TabGridViewBinder {
             faviconView.setPadding(padding, padding, padding, padding);
         } else if (TabProperties.THUMBNAIL_FETCHER == propertyKey) {
             updateThumbnail(view, model);
-        } else if (TabProperties.IS_INCOGNITO == propertyKey) {
-            updateColor(view, model.get(TabProperties.IS_INCOGNITO));
         }
     }
 
@@ -174,6 +173,8 @@ class TabGridViewBinder {
             ((ClosableTabGridView) view)
                     .scaleTabGridCardView(
                             model.get(TabProperties.CARD_ANIMATION_STATUS), isSelected);
+        } else if (TabProperties.IS_INCOGNITO == propertyKey) {
+            updateColor(view, model.get(TabProperties.IS_INCOGNITO), TabProperties.UiType.CLOSABLE);
         }
     }
 
@@ -188,6 +189,10 @@ class TabGridViewBinder {
             boolean isSelected = model.get(TabProperties.IS_SELECTED);
             ImageView actionButton = (ImageView) view.fastFindViewById(R.id.action_button);
             actionButton.getBackground().setLevel(isSelected ? selectedLevel : defaultLevel);
+            DrawableCompat.setTintList(actionButton.getBackground().mutate(),
+                    isSelected ? model.get(
+                            TabProperties.SELECTABLE_TAB_ACTION_BUTTON_SELECTED_BACKGROUND)
+                               : model.get(TabProperties.SELECTABLE_TAB_ACTION_BUTTON_BACKGROUND));
 
             // The check should be invisible if not selected.
             actionButton.getDrawable().setAlpha(isSelected ? 255 : 0);
@@ -214,6 +219,9 @@ class TabGridViewBinder {
             ((SelectableTabGridView) view)
                     .setSelectionDelegate(model.get(TabProperties.TAB_SELECTION_DELEGATE));
             ((SelectableTabGridView) view).setItem(tabId);
+        } else if (TabProperties.IS_INCOGNITO == propertyKey) {
+            updateColor(
+                    view, model.get(TabProperties.IS_INCOGNITO), TabProperties.UiType.SELECTABLE);
         }
     }
 
@@ -237,7 +245,8 @@ class TabGridViewBinder {
         fetcher.fetch(callback);
     }
 
-    private static void updateColor(ViewLookupCachingFrameLayout rootView, boolean isIncognito) {
+    private static void updateColor(ViewLookupCachingFrameLayout rootView, boolean isIncognito,
+            @TabProperties.UiType int viewType) {
         View cardView = rootView.fastFindViewById(R.id.card_view);
         View dividerView = rootView.fastFindViewById(R.id.divider_view);
         ImageView thumbnail = (ImageView) rootView.fastFindViewById(R.id.tab_thumbnail);
@@ -261,9 +270,6 @@ class TabGridViewBinder {
         dividerView.setBackgroundColor(
                 TabUiColorProvider.getDividerColor(dividerView.getContext(), isIncognito));
 
-        ApiCompatibilityUtils.setImageTintList(actionButton,
-                TabUiColorProvider.getActionButtonTintList(actionButton.getContext(), isIncognito));
-
         ApiCompatibilityUtils.setTextAppearance(
                 ((TextView) rootView.fastFindViewById(R.id.tab_title)),
                 TabUiColorProvider.getTitleTextAppearance(isIncognito));
@@ -278,5 +284,11 @@ class TabGridViewBinder {
                     TabUiColorProvider.getHoveredCardBackgroundTintList(
                             backgroundView.getContext(), isIncognito));
         }
+
+        if (viewType == TabProperties.UiType.CLOSABLE) {
+            ApiCompatibilityUtils.setImageTintList(actionButton,
+                    TabUiColorProvider.getActionButtonTintList(
+                            actionButton.getContext(), isIncognito));
+        }
     }
 }

chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabListMediator.java

@@ -7,6 +7,7 @@ package org.chromium.chrome.browser.tasks.tab_management;
 import android.app.Activity;
 import android.content.ComponentCallbacks;
 import android.content.Context;
+import android.content.res.ColorStateList;
 import android.content.res.Configuration;
 import android.graphics.Bitmap;
 import android.graphics.drawable.Drawable;
@@ -461,8 +462,9 @@ class TabListMediator {
             @Override
             public void didMoveTab(Tab tab, int newIndex, int curIndex) {
                 if (mTabModelSelector.getTabModelFilterProvider().getCurrentTabModelFilter()
-                                instanceof TabGroupModelFilter)
+                                instanceof TabGroupModelFilter) {
                     return;
+                }
                 onTabMoved(newIndex, curIndex);
             }
 
@@ -980,9 +982,28 @@ class TabListMediator {
                         .build();
 
         if (mUiType == UiType.SELECTABLE) {
-            tabInfo.set(TabProperties.CHECKED_DRAWABLE_STATE_LIST,
-                    AppCompatResources.getColorStateList(
-                            mContext, R.color.default_icon_color_inverse));
+            // Incognito in both light/dark theme is the same as non-incognito mode in dark theme.
+            // Non-incognito mode and incognito in both light/dark themes in dark theme all look
+            // dark.
+            ColorStateList checkedDrawableColorList = AppCompatResources.getColorStateList(mContext,
+                    tab.isIncognito() ? R.color.default_icon_color_dark
+                                      : R.color.default_icon_color_inverse);
+            ColorStateList actionButtonBackgroundColorList =
+                    AppCompatResources.getColorStateList(mContext,
+                            tab.isIncognito() ? R.color.default_icon_color_white
+                                              : R.color.default_icon_color);
+            // TODO(995876): Update color modern_blue_300 to active_color_dark when the associated
+            // bug is landed.
+            ColorStateList actionbuttonSelectedBackgroundColorList =
+                    AppCompatResources.getColorStateList(mContext,
+                            tab.isIncognito() ? R.color.modern_blue_300
+                                              : R.color.light_active_color);
+
+            tabInfo.set(TabProperties.CHECKED_DRAWABLE_STATE_LIST, checkedDrawableColorList);
+            tabInfo.set(TabProperties.SELECTABLE_TAB_ACTION_BUTTON_BACKGROUND,
+                    actionButtonBackgroundColorList);
+            tabInfo.set(TabProperties.SELECTABLE_TAB_ACTION_BUTTON_SELECTED_BACKGROUND,
+                    actionbuttonSelectedBackgroundColorList);
         }
 
         if (index >= mModel.size()) {

chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabProperties.java

@@ -80,12 +80,21 @@ public class TabProperties {
     public static final PropertyModel.ReadableIntPropertyKey TABSTRIP_FAVICON_BACKGROUND_COLOR_ID =
             new PropertyModel.ReadableIntPropertyKey();
 
+    public static final PropertyModel
+            .WritableObjectPropertyKey<ColorStateList> SELECTABLE_TAB_ACTION_BUTTON_BACKGROUND =
+            new PropertyModel.WritableObjectPropertyKey<>();
+
+    public static final PropertyModel.WritableObjectPropertyKey<ColorStateList>
+            SELECTABLE_TAB_ACTION_BUTTON_SELECTED_BACKGROUND =
+            new PropertyModel.WritableObjectPropertyKey<>();
+
     public static final PropertyKey[] ALL_KEYS_TAB_GRID = new PropertyKey[] {TAB_ID,
             TAB_SELECTED_LISTENER, TAB_CLOSED_LISTENER, FAVICON, THUMBNAIL_FETCHER, IPH_PROVIDER,
             TITLE, IS_SELECTED, CHECKED_DRAWABLE_STATE_LIST, CREATE_GROUP_LISTENER, ALPHA,
             CARD_ANIMATION_STATUS, SELECTABLE_TAB_CLICKED_LISTENER, TAB_SELECTION_DELEGATE,
-            IS_INCOGNITO, SELECTED_TAB_BACKGROUND_DRAWABLE_ID,
-            TABSTRIP_FAVICON_BACKGROUND_COLOR_ID};
+            IS_INCOGNITO, SELECTED_TAB_BACKGROUND_DRAWABLE_ID, TABSTRIP_FAVICON_BACKGROUND_COLOR_ID,
+            SELECTABLE_TAB_ACTION_BUTTON_BACKGROUND,
+            SELECTABLE_TAB_ACTION_BUTTON_SELECTED_BACKGROUND};
 
     public static final PropertyKey[] ALL_KEYS_TAB_STRIP =
             new PropertyKey[] {TAB_ID, TAB_SELECTED_LISTENER, TAB_CLOSED_LISTENER, FAVICON,

chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabSelectionEditorLayoutBinder.java

@@ -31,6 +31,17 @@ public class TabSelectionEditorLayoutBinder {
         } else if (TabSelectionEditorProperties.TOOLBAR_NAVIGATION_LISTENER == propertyKey) {
             view.getToolbar().setNavigationOnClickListener(
                     model.get(TabSelectionEditorProperties.TOOLBAR_NAVIGATION_LISTENER));
+        } else if (TabSelectionEditorProperties.PRIMARY_COLOR == propertyKey) {
+            view.setBackgroundColor(model.get(TabSelectionEditorProperties.PRIMARY_COLOR));
+        } else if (TabSelectionEditorProperties.TOOLBAR_BACKGROUND_COLOR == propertyKey) {
+            view.getToolbar().setToolbarBackgroundColor(
+                    model.get(TabSelectionEditorProperties.TOOLBAR_BACKGROUND_COLOR));
+        } else if (TabSelectionEditorProperties.TOOLBAR_GROUP_BUTTON_TINT == propertyKey) {
+            view.getToolbar().setButtonTint(
+                    model.get(TabSelectionEditorProperties.TOOLBAR_GROUP_BUTTON_TINT));
+        } else if (TabSelectionEditorProperties.TOOLBAR_TEXT_APPEARANCE == propertyKey) {
+            view.getToolbar().setTextAppearance(
+                    model.get(TabSelectionEditorProperties.TOOLBAR_TEXT_APPEARANCE));
         }
     }
 }

chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabSelectionEditorMediator.java

@@ -5,19 +5,26 @@
 package org.chromium.chrome.browser.tasks.tab_management;
 
 import android.content.Context;
+import android.content.res.ColorStateList;
+import android.support.annotation.ColorInt;
+import android.support.v7.content.res.AppCompatResources;
 import android.view.View;
 
 import androidx.annotation.Nullable;
 
+import org.chromium.base.ApiCompatibilityUtils;
 import org.chromium.base.metrics.RecordUserAction;
 import org.chromium.chrome.browser.tab.Tab;
+import org.chromium.chrome.browser.tabmodel.EmptyTabModelSelectorObserver;
 import org.chromium.chrome.browser.tabmodel.TabLaunchType;
 import org.chromium.chrome.browser.tabmodel.TabModel;
 import org.chromium.chrome.browser.tabmodel.TabModelSelector;
+import org.chromium.chrome.browser.tabmodel.TabModelSelectorObserver;
 import org.chromium.chrome.browser.tabmodel.TabModelSelectorTabModelObserver;
 import org.chromium.chrome.browser.tabmodel.TabModelUtils;
 import org.chromium.chrome.browser.tasks.tab_groups.TabGroupModelFilter;
 import org.chromium.chrome.browser.widget.selection.SelectionDelegate;
+import org.chromium.chrome.tab_ui.R;
 import org.chromium.ui.modelutil.PropertyModel;
 
 import java.util.ArrayList;
@@ -47,6 +54,7 @@ class TabSelectionEditorMediator
     private final PropertyModel mModel;
     private final SelectionDelegate<Integer> mSelectionDelegate;
     private final TabModelSelectorTabModelObserver mTabModelObserver;
+    private final TabModelSelectorObserver mTabModelSelectorObserver;
 
     private final View.OnClickListener mNavigationClickListener = new View.OnClickListener() {
         @Override
@@ -105,6 +113,38 @@ class TabSelectionEditorMediator
                 }
             }
         };
+
+        mTabModelSelectorObserver = new EmptyTabModelSelectorObserver() {
+            @Override
+            public void onTabModelSelected(TabModel newModel, TabModel oldModel) {
+                // Incognito in both light/dark theme is the same as non-incognito mode in dark
+                // theme. Non-incognito mode and incognito in both light/dark themes in dark theme
+                // all look dark.
+                boolean isIncognito = newModel.isIncognito();
+                @ColorInt
+                int primaryColor = ApiCompatibilityUtils.getColor(mContext.getResources(),
+                        isIncognito ? R.color.incognito_modern_primary_color
+                                    : R.color.modern_primary_color);
+                // TODO(995876): Update color modern_blue_300 to active_color_dark when the
+                // associated bug is landed.
+                @ColorInt
+                int toolbarBackgroundColor = ApiCompatibilityUtils.getColor(mContext.getResources(),
+                        isIncognito ? R.color.modern_blue_300 : R.color.light_active_color);
+                ColorStateList toolbarTintColorList = AppCompatResources.getColorStateList(mContext,
+                        isIncognito ? R.color.dark_text_color_list
+                                    : R.color.default_text_color_inverse_list);
+                int textAppearance = isIncognito ? R.style.TextAppearance_BlackHeadline_Black
+                                                 : R.style.TextAppearance_Headline_Inverse;
+
+                mModel.set(TabSelectionEditorProperties.PRIMARY_COLOR, primaryColor);
+                mModel.set(TabSelectionEditorProperties.TOOLBAR_BACKGROUND_COLOR,
+                        toolbarBackgroundColor);
+                mModel.set(TabSelectionEditorProperties.TOOLBAR_GROUP_BUTTON_TINT,
+                        toolbarTintColorList);
+                mModel.set(TabSelectionEditorProperties.TOOLBAR_TEXT_APPEARANCE, textAppearance);
+            }
+        };
+        mTabModelSelector.addObserver(mTabModelSelectorObserver);
     }
 
     /**
@@ -152,5 +192,8 @@ class TabSelectionEditorMediator
      */
     public void destroy() {
         mTabModelObserver.destroy();
+        if (mTabModelSelector != null) {
+            mTabModelSelector.removeObserver(mTabModelSelectorObserver);
+        }
     }
 }

chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabSelectionEditorProperties.java

@@ -4,6 +4,7 @@
 
 package org.chromium.chrome.browser.tasks.tab_management;
 
+import android.content.res.ColorStateList;
 import android.view.View;
 
 import org.chromium.ui.modelutil.PropertyKey;
@@ -24,6 +25,20 @@ public class TabSelectionEditorProperties {
             .WritableObjectPropertyKey<View.OnClickListener> TOOLBAR_NAVIGATION_LISTENER =
             new PropertyModel.WritableObjectPropertyKey<>();
 
-    public static final PropertyKey[] ALL_KEYS = new PropertyKey[] {
-            IS_VISIBLE, TOOLBAR_GROUP_BUTTON_LISTENER, TOOLBAR_NAVIGATION_LISTENER};
+    public static final PropertyModel.WritableIntPropertyKey PRIMARY_COLOR =
+            new PropertyModel.WritableIntPropertyKey();
+
+    public static final PropertyModel.WritableIntPropertyKey TOOLBAR_BACKGROUND_COLOR =
+            new PropertyModel.WritableIntPropertyKey();
+
+    public static final PropertyModel
+            .WritableObjectPropertyKey<ColorStateList> TOOLBAR_GROUP_BUTTON_TINT =
+            new PropertyModel.WritableObjectPropertyKey<>();
+
+    public static final PropertyModel.WritableIntPropertyKey TOOLBAR_TEXT_APPEARANCE =
+            new PropertyModel.WritableIntPropertyKey();
+
+    public static final PropertyKey[] ALL_KEYS = new PropertyKey[] {IS_VISIBLE,
+            TOOLBAR_GROUP_BUTTON_LISTENER, TOOLBAR_NAVIGATION_LISTENER, PRIMARY_COLOR,
+            TOOLBAR_BACKGROUND_COLOR, TOOLBAR_GROUP_BUTTON_TINT, TOOLBAR_TEXT_APPEARANCE};
 }

chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabSelectionEditorToolbar.java

@@ -6,10 +6,12 @@ package org.chromium.chrome.browser.tasks.tab_management;
 
 import android.content.Context;
 import android.content.res.ColorStateList;
+import android.support.annotation.ColorInt;
 import android.support.v7.content.res.AppCompatResources;
 import android.util.AttributeSet;
 import android.widget.Button;
 
+import org.chromium.chrome.browser.widget.NumberRollView;
 import org.chromium.chrome.browser.widget.TintedDrawable;
 import org.chromium.chrome.browser.widget.selection.SelectableListToolbar;
 import org.chromium.chrome.tab_ui.R;
@@ -23,6 +25,8 @@ import java.util.List;
 class TabSelectionEditorToolbar extends SelectableListToolbar<Integer> {
     private static final List<Integer> sEmptyIntegerList = Collections.emptyList();
     private Button mGroupButton;
+    @ColorInt
+    private int mBackgroundColor;
 
     public TabSelectionEditorToolbar(Context context, AttributeSet attrs) {
         super(context, attrs);
@@ -64,6 +68,14 @@ class TabSelectionEditorToolbar extends SelectableListToolbar<Integer> {
         showSelectionView(sEmptyIntegerList, true);
     }
 
+    @Override
+    protected void showSelectionView(List<Integer> selectedItems, boolean wasSelectionEnabled) {
+        super.showSelectionView(selectedItems, wasSelectionEnabled);
+        if (mBackgroundColor != 0) {
+            setBackgroundColor(mBackgroundColor);
+        }
+    }
+
     /**
      * Sets a {@link android.view.View.OnClickListener} to respond to {@code mGroupButton} clicking
      * event.
@@ -72,4 +84,30 @@ class TabSelectionEditorToolbar extends SelectableListToolbar<Integer> {
     public void setActionButtonOnClickListener(OnClickListener listener) {
         mGroupButton.setOnClickListener(listener);
     }
+
+    /**
+     * Update the tint for buttons, the navigation button and the action button, in the toolbar.
+     * @param tint New {@link ColorStateList} to use.
+     */
+    public void setButtonTint(ColorStateList tint) {
+        mGroupButton.setTextColor(tint);
+        TintedDrawable navigation = (TintedDrawable) getNavigationIcon();
+        navigation.setTint(tint);
+    }
+
+    /**
+     * Update the toolbar background color.
+     * @param backgroundColor The new color to use.
+     */
+    public void setToolbarBackgroundColor(@ColorInt int backgroundColor) {
+        mBackgroundColor = backgroundColor;
+    }
+
+    /**
+     * Update the text appearance for {@link NumberRollView}.
+     * @param resId The new text appearance to use.
+     */
+    public void setTextAppearance(int resId) {
+        mNumberRollView.setTextAppearance(resId);
+    }
 }

chrome/android/java/src/org/chromium/chrome/browser/widget/NumberRollView.java

@@ -153,4 +153,13 @@ public class NumberRollView extends FrameLayout {
     public void endAnimationsForTesting() {
         if (mLastRollAnimator != null) mLastRollAnimator.end();
     }
+
+    /**
+     * Update the text appearance for both {@link TextView}.
+     * @param resId The new text appearance to use.
+     */
+    public void setTextAppearance(int resId) {
+        mUpNumber.setTextAppearance(mUpNumber.getContext(), resId);
+        mDownNumber.setTextAppearance(mDownNumber.getContext(), resId);
+    }
 }
\ No newline at end of file