[Toolbar button] Animate border+text+background with the new style

This CL shows a border around toolbar buttons that have non-empty
labels (with a nice fade-in / fade-out while animating the label).

This is only enabled when the avatar animation feature is enabled.

Bug: 967317
Change-Id: I06668d3548f83d9e646d5f52eb995fb93875a55f
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1771405
Commit-Queue: Peter Boström <pbos@chromium.org>
Auto-Submit: Jan Krcal <jkrcal@chromium.org>
Reviewed-by: Peter Boström <pbos@chromium.org>
Cr-Commit-Position: refs/heads/master@{#698700}

chrome/browser/ui/views/profiles/avatar_toolbar_button.cc

@@ -165,7 +165,10 @@ void AvatarToolbarButton::UpdateText() {
           IDS_INCOGNITO_BUBBLE_ACCESSIBLE_TITLE, incognito_window_count));
       text = l10n_util::GetPluralStringFUTF16(IDS_AVATAR_BUTTON_INCOGNITO,
                                               incognito_window_count);
-      if (GetThemeProvider()) {
+      // The new feature has styling that has the same text color for Incognito
+      // as for other states.
+      if (!base::FeatureList::IsEnabled(features::kAnimatedAvatarButton) &&
+          GetThemeProvider()) {
         // Note that this chip does not have a highlight color.
         const SkColor text_color = GetThemeProvider()->GetColor(
             ThemeProperties::COLOR_TOOLBAR_BUTTON_ICON);
@@ -175,11 +178,6 @@ void AvatarToolbarButton::UpdateText() {
     }
     case State::kAnimatedSignIn: {
       text = base::UTF8ToUTF16(*user_email_);
-      if (GetThemeProvider()) {
-        const SkColor text_color =
-            GetThemeProvider()->GetColor(ThemeProperties::COLOR_TAB_TEXT);
-        SetEnabledTextColors(text_color);
-      }
       break;
     }
     case State::kHighlightAnimation:

chrome/browser/ui/views/toolbar/toolbar_button.h

@@ -10,6 +10,8 @@
 #include "base/macros.h"
 #include "base/optional.h"
 #include "ui/base/theme_provider.h"
+#include "ui/gfx/animation/animation_delegate.h"
+#include "ui/gfx/animation/slide_animation.h"
 #include "ui/gfx/geometry/point.h"
 #include "ui/views/context_menu_controller.h"
 #include "ui/views/controls/button/button.h"
@@ -128,13 +130,62 @@ class ToolbarButton : public views::LabelButton,
  private:
   friend test::ToolbarButtonTestApi;
 
+  class HighlightColorAnimation : gfx::AnimationDelegate {
+   public:
+    explicit HighlightColorAnimation(ToolbarButton* parent);
+
+    ~HighlightColorAnimation() override;
+
+    // Starts a fade-in animation using the provided |highlight color| or using
+    // a default color if not set.
+    void Show(base::Optional<SkColor> highlight_color);
+
+    // Starts a fade-out animation. A no-op if the fade-out animation is
+    // currently in progress or not shown.
+    void Hide();
+
+    // Returns current text / border / background / ink-drop base color based on
+    // current |highlight_color_| and on the current animation state (which
+    // influences the alpha channel). Returns no value if there is no such color
+    // and we should use the default text color / paint no border / paint no
+    // background / use the default ink-drop base color.
+    base::Optional<SkColor> GetTextColor() const;
+    base::Optional<SkColor> GetBorderColor() const;
+    base::Optional<SkColor> GetBackgroundColor() const;
+    base::Optional<SkColor> GetInkDropBaseColor() const;
+
+    void AnimationEnded(const gfx::Animation* animation) override;
+    void AnimationProgressed(const gfx::Animation* animation) override;
+
+   private:
+    // Returns whether the animation is currently shown. Note that this returns
+    // true even after calling Hide() until the fade-out animation finishes.
+    bool IsShown() const;
+
+    void ClearHighlightColor();
+
+    ToolbarButton* const parent_;
+
+    // A highlight color is used to signal special states. When set this color
+    // is used as a base for background, text, border and ink drops. When not
+    // set, uses the default ToolbarButton ink drop.
+    base::Optional<SkColor> highlight_color_;
+
+    // Animation for showing the highlight color (in border, text, and
+    // background) when it becomes non-empty and hiding it when it becomes empty
+    // again.
+    gfx::SlideAnimation highlight_color_animation_;
+
+    DISALLOW_COPY_AND_ASSIGN(HighlightColorAnimation);
+  };
+
   // Clears the current highlight, i.e. it sets the label to an empty string and
   // clears the highlight color. If there was a non-empty highlight, previously,
   // it hides the current highlight using an animation. Otherwise, it is a
   // no-op.
   void ClearHighlight();
 
-  void UpdateHighlightBackgroundAndInsets();
+  void UpdateColorsAndInsets();
 
   // Sets the spacing on the outer side of the label (not the side where the
   // image is). The spacing is applied only when the label is non-empty.
@@ -173,15 +224,16 @@ class ToolbarButton : public views::LabelButton,
   // larger-than-16dp avatar avatar icon outside of touchable mode.
   gfx::Insets layout_inset_delta_;
 
-  // A highlight color is used to signal error states. When set this color is
-  // used as a base for background, text and ink drops. When not set, uses the
-  // default ToolbarButton ink drop.
-  base::Optional<SkColor> highlight_color_;
-
   // Used instead of the standard InkDrop implementation when
   // |views::kInstallableInkDropFeature| is enabled.
   std::unique_ptr<views::InstallableInkDrop> installable_ink_drop_;
 
+  // Class responsible for animating highlight color (calling a callback on
+  // |this| to refresh UI).
+  HighlightColorAnimation highlight_color_animation_;
+
+  base::Optional<SkColor> last_border_color_;
+
   // A factory for tasks that show the dropdown context menu for the button.
   base::WeakPtrFactory<ToolbarButton> show_menu_factory_{this};
 

chrome/browser/ui/views/toolbar/toolbar_ink_drop_util.cc

@@ -20,10 +20,6 @@
 #include "ui/views/view.h"
 #include "ui/views/view_class_properties.h"
 
-namespace {
-constexpr float kToolbarInkDropHighlightVisibleOpacity = 0.08f;
-}
-
 gfx::Insets GetToolbarInkDropInsets(const views::View* host_view,
                                     const gfx::Insets& margin_insets) {
   // Inset the inkdrop insets so that the end result matches the target inkdrop

chrome/browser/ui/views/toolbar/toolbar_ink_drop_util.h

@@ -19,6 +19,7 @@ struct InstallableInkDropConfig;
 }  // namespace views
 
 constexpr float kToolbarInkDropVisibleOpacity = 0.06f;
+constexpr float kToolbarInkDropHighlightVisibleOpacity = 0.08f;
 constexpr SkAlpha kToolbarButtonBackgroundAlpha = 32;
 
 // Creates insets for a host view so that when insetting from the host view