Unified: Add collapse button rotating animation.

This CL adds rotation animation to the arrow icon of UnifiedSystemTray's
collapse icon.

TEST=manual
BUG=850441

Change-Id: Ib385803754daa0d19dc2b976ec075d55f775f1cc
Reviewed-on: https://chromium-review.googlesource.com/1098748Reviewed-by: Yoshiki Iguchi <yoshiki@chromium.org>
Commit-Queue: Tetsui Ohkubo <tetsui@chromium.org>
Cr-Commit-Position: refs/heads/master@{#567943}

ash/system/unified/collapse_button.cc

@@ -13,6 +13,7 @@
 #include "ui/gfx/canvas.h"
 #include "ui/gfx/image/image_skia_operations.h"
 #include "ui/gfx/paint_vector_icon.h"
+#include "ui/gfx/scoped_canvas.h"
 #include "ui/gfx/skbitmap_operations.h"
 #include "ui/views/animation/flood_fill_ink_drop_ripple.h"
 #include "ui/views/animation/ink_drop_highlight.h"
@@ -67,13 +68,7 @@ CustomShapeButton::CustomShapeButton(views::ButtonListener* listener)
 CustomShapeButton::~CustomShapeButton() = default;
 
 void CustomShapeButton::PaintButtonContents(gfx::Canvas* canvas) {
-  cc::PaintFlags flags;
-  flags.setAntiAlias(true);
-  flags.setColor(kUnifiedMenuButtonColor);
-  flags.setStyle(cc::PaintFlags::kFill_Style);
-
-  canvas->DrawPath(CreateCustomShapePath(GetLocalBounds()), flags);
-
+  PaintCustomShapePath(canvas);
   views::ImageButton::PaintButtonContents(canvas);
 }
 
@@ -99,26 +94,28 @@ std::unique_ptr<views::InkDropMask> CustomShapeButton::CreateInkDropMask()
   return std::make_unique<CustomShapeInkDropMask>(size(), this);
 }
 
+void CustomShapeButton::PaintCustomShapePath(gfx::Canvas* canvas) {
+  cc::PaintFlags flags;
+  flags.setAntiAlias(true);
+  flags.setColor(kUnifiedMenuButtonColor);
+  flags.setStyle(cc::PaintFlags::kFill_Style);
+
+  canvas->DrawPath(CreateCustomShapePath(GetLocalBounds()), flags);
+}
+
 CollapseButton::CollapseButton(views::ButtonListener* listener)
     : CustomShapeButton(listener) {
-  UpdateIcon(true /* expanded */);
-  SetImageAlignment(HorizontalAlignment::ALIGN_CENTER,
-                    VerticalAlignment::ALIGN_BOTTOM);
+  SetImage(views::Button::STATE_NORMAL,
+           gfx::CreateVectorIcon(kNotificationCenterCollapseIcon,
+                                 kCollapseIconSize, kUnifiedMenuIconColor));
   SetTooltipText(l10n_util::GetStringUTF16(IDS_ASH_STATUS_TRAY_COLLAPSE));
-  SetBorder(views::CreateEmptyBorder(
-      gfx::Insets((kTrayItemSize - kCollapseIconSize) / 2)));
 }
 
 CollapseButton::~CollapseButton() = default;
 
-void CollapseButton::UpdateIcon(bool expanded) {
-  gfx::ImageSkia icon =
-      gfx::CreateVectorIcon(kNotificationCenterCollapseIcon, kCollapseIconSize,
-                            kUnifiedMenuIconColor);
-  if (!expanded)
-    icon = gfx::ImageSkiaOperations::CreateRotatedImage(
-        icon, SkBitmapOperations::ROTATION_180_CW);
-  SetImage(views::Button::STATE_NORMAL, icon);
+void CollapseButton::SetExpandedAmount(double expanded_amount) {
+  expanded_amount_ = expanded_amount;
+  SchedulePaint();
 }
 
 gfx::Size CollapseButton::CalculatePreferredSize() const {
@@ -134,4 +131,14 @@ SkPath CollapseButton::CreateCustomShapePath(const gfx::Rect& bounds) const {
   return path;
 }
 
+void CollapseButton::PaintButtonContents(gfx::Canvas* canvas) {
+  PaintCustomShapePath(canvas);
+
+  gfx::ScopedCanvas scoped(canvas);
+  canvas->Translate(gfx::Vector2d(size().width() / 2, size().height() * 2 / 3));
+  canvas->sk_canvas()->rotate(expanded_amount_ * 180. + 180.);
+  canvas->DrawImageInt(GetImageToPaint(), -kCollapseIconSize / 2,
+                       -kCollapseIconSize / 2);
+}
+
 }  // namespace ash

ash/system/unified/collapse_button.h

@@ -27,6 +27,9 @@ class CustomShapeButton : public views::ImageButton {
       const override;
   std::unique_ptr<views::InkDropMask> CreateInkDropMask() const override;
 
+ protected:
+  void PaintCustomShapePath(gfx::Canvas* canvas);
+
  private:
   DISALLOW_COPY_AND_ASSIGN(CustomShapeButton);
 };
@@ -40,14 +43,17 @@ class CollapseButton : public CustomShapeButton {
   explicit CollapseButton(views::ButtonListener* listener);
   ~CollapseButton() override;
 
-  // Change the icon for the |expanded| state.
-  void UpdateIcon(bool expanded);
+  // Change the expanded state. The icon will change.
+  void SetExpandedAmount(double expanded_amount);
 
   // CustomShapeButton:
   gfx::Size CalculatePreferredSize() const override;
   SkPath CreateCustomShapePath(const gfx::Rect& bounds) const override;
+  void PaintButtonContents(gfx::Canvas* canvas) override;
 
  private:
+  double expanded_amount_ = 1.0;
+
   DISALLOW_COPY_AND_ASSIGN(CollapseButton);
 };
 

ash/system/unified/top_shortcuts_view.cc

@@ -180,8 +180,8 @@ TopShortcutsView::TopShortcutsView(UnifiedSystemTrayController* controller)
 
 TopShortcutsView::~TopShortcutsView() = default;
 
-void TopShortcutsView::SetExpanded(bool expanded) {
-  collapse_button_->UpdateIcon(expanded);
+void TopShortcutsView::SetExpandedAmount(double expanded_amount) {
+  collapse_button_->SetExpandedAmount(expanded_amount);
 }
 
 void TopShortcutsView::RequestInitFocus() {

ash/system/unified/top_shortcuts_view.h

@@ -45,8 +45,8 @@ class ASH_EXPORT TopShortcutsView : public views::View,
   explicit TopShortcutsView(UnifiedSystemTrayController* controller);
   ~TopShortcutsView() override;
 
-  // Change the expanded state. CollapseButton icon will change.
-  void SetExpanded(bool expanded);
+  // Change the expanded state. CollapseButton icon will rotate.
+  void SetExpandedAmount(double expanded_amount);
 
   // Request focus of the element that should initially have focus after opening
   // the bubble.

ash/system/unified/unified_system_tray_view.cc

@@ -153,6 +153,8 @@ UnifiedSystemTrayView::UnifiedSystemTrayView(
 
   detailed_view_container_->SetVisible(false);
   AddChildView(detailed_view_container_);
+
+  top_shortcuts_view_->SetExpandedAmount(initially_expanded ? 1.0 : 0.0);
 }
 
 UnifiedSystemTrayView::~UnifiedSystemTrayView() = default;
@@ -205,8 +207,7 @@ void UnifiedSystemTrayView::RequestInitFocus() {
 
 void UnifiedSystemTrayView::SetExpandedAmount(double expanded_amount) {
   DCHECK(0.0 <= expanded_amount && expanded_amount <= 1.0);
-  if (expanded_amount == 1.0 || expanded_amount == 0.0)
-    top_shortcuts_view_->SetExpanded(expanded_amount == 1.0);
+  top_shortcuts_view_->SetExpandedAmount(expanded_amount);
   feature_pods_container_->SetExpandedAmount(expanded_amount);
   sliders_container_->SetExpandedAmount(expanded_amount);
   PreferredSizeChanged();