Fade theme color in tab switcher

This change allows updates to a page's theme color to smoothly
transition in the tab switcher.

BUG=606612

Review-Url: https://codereview.chromium.org/2114513002
Cr-Commit-Position: refs/heads/master@{#404444}

chrome/android/java/src/org/chromium/chrome/browser/compositor/layouts/Layout.java

@@ -935,8 +935,15 @@ public abstract class Layout implements TabContentManager.ThumbnailChangeListene
                 mLayoutAnimations = null;
                 onAnimationFinished();
             }
-            requestUpdate();
         }
+
+        // LayoutTabs may be running their own animations; make sure they are done.
+        for (int i = 0; mLayoutTabs != null && i < mLayoutTabs.length; i++) {
+            finished &= mLayoutTabs[i].onUpdateAnimation(time);
+        }
+
+        if (!finished) requestUpdate();
+
         return finished;
     }
 

chrome/android/java/src/org/chromium/chrome/browser/compositor/layouts/LayoutManagerDocument.java

@@ -262,10 +262,11 @@ public class LayoutManagerDocument extends LayoutManager
         int themeColor = tab.getThemeColor();
         boolean canUseLiveTexture =
                 tab.getContentViewCore() != null && !tab.isShowingSadTab() && !isNativePage;
-        layoutTab.initFromHost(tab.getBackgroundColor(), tab.shouldStall(), canUseLiveTexture,
-                themeColor, ColorUtils.getTextBoxColorForToolbarBackground(
+        boolean needsUpdate = layoutTab.initFromHost(tab.getBackgroundColor(), tab.shouldStall(),
+                canUseLiveTexture, themeColor, ColorUtils.getTextBoxColorForToolbarBackground(
                                     mContext.getResources(), tab, themeColor),
                 ColorUtils.getTextBoxAlphaForToolbarBackground(tab));
+        if (needsUpdate) requestUpdate();
 
         mHost.requestRender();
     }

chrome/android/java/src/org/chromium/chrome/browser/compositor/layouts/components/LayoutTab.java

@@ -4,6 +4,8 @@
 
 package org.chromium.chrome.browser.compositor.layouts.components;
 
+import static org.chromium.chrome.browser.compositor.layouts.ChromeAnimation.AnimatableAnimation.createAnimation;
+
 import android.content.Context;
 import android.content.res.Resources;
 import android.graphics.Color;
@@ -12,7 +14,10 @@ import android.graphics.RectF;
 import org.chromium.chrome.R;
 import org.chromium.chrome.browser.compositor.layouts.ChromeAnimation;
 import org.chromium.chrome.browser.tab.Tab;
+import org.chromium.chrome.browser.toolbar.ToolbarPhone;
+import org.chromium.chrome.browser.util.ColorUtils;
 import org.chromium.chrome.browser.util.MathUtils;
+import org.chromium.ui.interpolators.BakedBezierInterpolator;
 
 /**
  * {@link LayoutTab} is used to keep track of a thumbnail's bitmap and position and to
@@ -40,6 +45,7 @@ public class LayoutTab implements ChromeAnimation.Animatable<LayoutTab.Property>
         DECORATION_ALPHA,
         TOOLBAR_Y_OFFSET,
         SIDE_BORDER_SCALE,
+        TOOLBAR_COLOR,
     }
 
     public static final float ALPHA_THRESHOLD = 1.0f / 255.0f;
@@ -115,6 +121,11 @@ public class LayoutTab implements ChromeAnimation.Animatable<LayoutTab.Property>
      */
     private boolean mInitFromHostCalled = false;
 
+    /** The animation set specific to this LayoutTab. */
+    private ChromeAnimation<ChromeAnimation.Animatable<?>> mCurrentAnimations;
+    private int mInitialThemeColor;
+    private int mFinalThemeColor;
+
     // All the members bellow are initialized from the delayed initialization.
     //
     // Begin section --------------
@@ -208,16 +219,53 @@ public class LayoutTab implements ChromeAnimation.Animatable<LayoutTab.Property>
      * @param shouldStall           Whether the tab should display a desaturated thumbnail and
      *                              wait for the content layer to load.
      * @param canUseLiveTexture     Whether the tab can use a live texture when being displayed.
+     * @return True if the init requires the compositor to update.
      */
-    public void initFromHost(int backgroundColor, boolean shouldStall, boolean canUseLiveTexture,
+    public boolean initFromHost(int backgroundColor, boolean shouldStall, boolean canUseLiveTexture,
             int toolbarBackgroundColor, int textBoxBackgroundColor, float textBoxAlpha) {
         mBackgroundColor = backgroundColor;
+
+        boolean needsUpdate = false;
+
+        // If the toolbar color changed, animate between the old and new colors.
+        if (mToolbarBackgroundColor != toolbarBackgroundColor && isVisible()) {
+            ChromeAnimation.Animation<ChromeAnimation.Animatable<?>>  themeColorAnimation =
+                    createAnimation(this, Property.TOOLBAR_COLOR, 0.0f, 1.0f,
+                    ToolbarPhone.THEME_COLOR_TRANSITION_DURATION, 0, false,
+                    BakedBezierInterpolator.TRANSFORM_CURVE);
+
+            mInitialThemeColor = mToolbarBackgroundColor;
+            mFinalThemeColor = toolbarBackgroundColor;
+
+            if (mCurrentAnimations != null) {
+                mCurrentAnimations.updateAndFinish();
+            }
+
+            mCurrentAnimations = new ChromeAnimation<ChromeAnimation.Animatable<?>>();
+            mCurrentAnimations.add(themeColorAnimation);
+            mCurrentAnimations.start();
+            needsUpdate = true;
+        } else {
+            // If the layout tab isn't visible, just set the toolbar color without animating.
             mToolbarBackgroundColor = toolbarBackgroundColor;
+        }
+
         mTextBoxBackgroundColor = textBoxBackgroundColor;
         mTextBoxAlpha = textBoxAlpha;
         mShouldStall = shouldStall;
         mCanUseLiveTexture = canUseLiveTexture;
         mInitFromHostCalled = true;
+
+        return needsUpdate;
+    }
+
+    /**
+     * Update any animation controlled by this object.
+     * @param time The current app time in ms.
+     * @return Whether the animations controlled by this LayoutTab are finished.
+     */
+    public boolean onUpdateAnimation(long time) {
+        return mCurrentAnimations == null ? true : mCurrentAnimations.update(time);
     }
 
     /**
@@ -774,6 +822,7 @@ public class LayoutTab implements ChromeAnimation.Animatable<LayoutTab.Property>
      * @param visible True if the {@link LayoutTab} is visible and need to be drawn.
      */
     public void setVisible(boolean visible) {
+        if (!visible && mCurrentAnimations != null) mCurrentAnimations.updateAndFinish();
         mVisible = visible;
     }
 
@@ -959,9 +1008,21 @@ public class LayoutTab implements ChromeAnimation.Animatable<LayoutTab.Property>
             case SIDE_BORDER_SCALE:
                 setSideBorderScale(val);
                 break;
+            case TOOLBAR_COLOR:
+                if (!isVisible()) {
+                    mCurrentAnimations.updateAndFinish();
+                } else {
+                    mToolbarBackgroundColor = ColorUtils.getColorWithOverlay(mInitialThemeColor,
+                            mFinalThemeColor, val);
+                }
+                break;
         }
     }
 
     @Override
-    public void onPropertyAnimationFinished(Property prop) {}
+    public void onPropertyAnimationFinished(Property prop) {
+        if (mCurrentAnimations != null && mCurrentAnimations.finished()) {
+            mCurrentAnimations = null;
+        }
+    }
 }

chrome/android/java/src/org/chromium/chrome/browser/toolbar/CustomTabToolbar.java

@@ -84,7 +84,6 @@ public class CustomTabToolbar extends ToolbarLayout implements LocationBar,
         }
     }
 
-    private static final int BRAND_COLOR_TRANSITION_DURATION_MS = 250;
     private static final int TITLE_ANIM_DELAY_MS = 800;
     private static final int STATE_DOMAIN_ONLY = 0;
     private static final int STATE_TITLE_ONLY = 1;
@@ -530,7 +529,7 @@ public class CustomTabToolbar extends ToolbarLayout implements LocationBar,
         if (background.getColor() == finalColor) return;
 
         mBrandColorTransitionAnimation = ValueAnimator.ofFloat(0, 1)
-                .setDuration(BRAND_COLOR_TRANSITION_DURATION_MS);
+                .setDuration(ToolbarPhone.THEME_COLOR_TRANSITION_DURATION);
         mBrandColorTransitionAnimation.setInterpolator(BakedBezierInterpolator.TRANSFORM_CURVE);
         mBrandColorTransitionAnimation.addUpdateListener(new AnimatorUpdateListener() {
             @Override

chrome/android/java/src/org/chromium/chrome/browser/toolbar/ToolbarPhone.java

@@ -76,6 +76,9 @@ public class ToolbarPhone extends ToolbarLayout
         implements Invalidator.Client, OnClickListener, OnLongClickListener,
                 NewTabPage.OnSearchBoxScrollListener {
 
+    /** The amount of time transitioning from one theme color to another should take in ms. */
+    public static final long THEME_COLOR_TRANSITION_DURATION = 250;
+
     public static final int URL_FOCUS_CHANGE_ANIMATION_DURATION_MS = 250;
     private static final int URL_FOCUS_TOOLBAR_BUTTONS_TRANSLATION_X_DP = 10;
     private static final int URL_FOCUS_TOOLBAR_BUTTONS_DURATION_MS = 100;
@@ -89,8 +92,6 @@ public class ToolbarPhone extends ToolbarLayout
 
     private static final float UNINITIALIZED_PERCENT = -1f;
 
-    private static final int BRAND_COLOR_TRANSITION_DURATION_MS = 250;
-
     private static final String TAG = "ToolbarPhone";
 
     static final int LOCATION_BAR_TRANSPARENT_BACKGROUND_ALPHA = 51;
@@ -1873,7 +1874,7 @@ public class ToolbarPhone extends ToolbarLayout
                 shouldUseOpaque ? 255 : LOCATION_BAR_TRANSPARENT_BACKGROUND_ALPHA;
         final boolean shouldAnimateAlpha = initialAlpha != finalAlpha;
         mBrandColorTransitionAnimation = ValueAnimator.ofFloat(0, 1)
-                .setDuration(BRAND_COLOR_TRANSITION_DURATION_MS);
+                .setDuration(THEME_COLOR_TRANSITION_DURATION);
         mBrandColorTransitionAnimation.setInterpolator(BakedBezierInterpolator.TRANSFORM_CURVE);
         mBrandColorTransitionAnimation.addUpdateListener(new AnimatorUpdateListener() {
             @Override