Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(8060)

Unified Diff: chrome/browser/ui/views/toolbar/app_menu_animation.cc

Issue 2789203003: [Views] App Menu Animated Icon (Closed)
Patch Set: Cleaned up Created 3 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: chrome/browser/ui/views/toolbar/app_menu_animation.cc
diff --git a/chrome/browser/ui/views/toolbar/app_menu_animation.cc b/chrome/browser/ui/views/toolbar/app_menu_animation.cc
new file mode 100644
index 0000000000000000000000000000000000000000..fbe2af498ffd444cc8dd4168c687de28f591ac4d
--- /dev/null
+++ b/chrome/browser/ui/views/toolbar/app_menu_animation.cc
@@ -0,0 +1,180 @@
+// Copyright 2017 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.
+
+#include "chrome/browser/ui/views/toolbar/app_menu_animation.h"
+
+#include "base/time/time.h"
msw 2017/04/11 17:34:13 q: needed?
spqchan 2017/04/12 19:42:09 Removed
+#include "cc/paint/paint_flags.h"
+#include "chrome/browser/ui/views/toolbar/app_menu_button.h"
+#include "ui/gfx/animation/tween.h"
+#include "ui/gfx/canvas.h"
+#include "ui/gfx/color_palette.h"
+#include "ui/gfx/color_utils.h"
+#include "ui/gfx/skia_util.h"
+
+namespace {
+
+// Duration of the open and close animations in ms.
+const float kOpenDuration = 733.0f;
msw 2017/04/11 17:34:13 nit: constexpr for all these
spqchan 2017/04/12 19:42:09 Done.
+const float kCloseDuration = 283.0f;
+
+// Duration of the color animation in ms.
+const float kColorDurationMs = 100.0f;
+
+// The % the top and bottom dots need to be offset from the middle.
+const float kDotYOffset = 0.32f;
+
+// Value of the stroke when the icon is opened or closed.
+const float kCloseStroke = 0.204f;
+const float kOpenStroke = 0.136f;
+
+// Value of the width when the animation is fully opened.
+const float kOpenWidth = 0.52f;
+
+// The delay of the color and dot animations in ms.
+const float kColorDelayMs = 33.33f;
+const float kDotDelayMs = 66.67f;
+
+// The % of time it takes for each dot to animate to its full width.
+const float kTopWidthOpenInterval = 533.3f / kOpenDuration;
+const float kMiddleWidthOpenInterval = 383.3f / kOpenDuration;
+const float kBottomWidthOpenInterval = 400.0f / kOpenDuration;
+
+// The % of time it takes for each dot to animate to its final stroke.
+const float kTopStrokeOpenInterval = 400.0f / kOpenDuration;
+const float kMiddleStrokeOpenInterval = 283.3f / kOpenDuration;
+const float kBottomStrokeOpenInterval = 266.7f / kOpenDuration;
+
+// The % of time it takes for each dot to animate its width and stroke.
+const float kWidthStrokeCloseInterval = 150.0f / kCloseDuration;
+
+} // namespace
+
+AppMenuAnimation::AppMenuDot::AppMenuDot(float delay,
+ float widthOpenInterval,
msw 2017/04/11 17:34:13 Use the |unix_hacker| naming convention for anythi
spqchan 2017/04/12 19:42:09 Done.
+ float strokeOpenInterval)
+ : delay_(delay),
+ widthOpenInterval_(widthOpenInterval),
+ strokeOpenInterval_(strokeOpenInterval) {}
+
+void AppMenuAnimation::AppMenuDot::Paint(gfx::PointF center_pt,
msw 2017/04/11 17:34:13 nit: |center_point|
spqchan 2017/04/12 19:42:09 Done.
+ SkColor start_color,
+ SkColor severity_color,
+ gfx::Canvas* canvas,
+ const gfx::Rect& bounds,
+ gfx::SlideAnimation* animation) {
+ bool is_opening = animation->IsShowing();
+ float totalDuration = is_opening ? kOpenDuration : kCloseDuration;
+ float widthDuration =
+ is_opening ? widthOpenInterval_ : kWidthStrokeCloseInterval;
+ float strokeDuration =
+ is_opening ? strokeOpenInterval_ : kWidthStrokeCloseInterval;
+
+ // Reverse the delay if the animation is closing.
+ float delay = is_opening ? delay_ : kDotDelayMs * 2 - delay_;
msw 2017/04/11 17:34:13 nit: use parens around (kDotDelayMs * 2 - delay_)
spqchan 2017/04/12 19:42:09 Done.
+
+ float widthProgress = 0.0;
msw 2017/04/11 17:34:13 Use the |unix_hacker| naming convention for these:
spqchan 2017/04/12 19:42:09 Done.
+ float strokeProgress = 0.0;
+ float colorProgress = 0.0;
+ float progress = animation->GetCurrentValue() - (delay / totalDuration);
msw 2017/04/11 17:34:13 nit: move this up immediately after |delay|, for c
spqchan 2017/04/12 19:42:09 Done.
+
+ if (progress > 0) {
+ widthProgress = std::min(1.0f, progress / widthDuration);
+ strokeProgress = std::min(1.0f, progress / strokeDuration);
+
+ if (is_opening) {
+ float colorDelay = kColorDelayMs / totalDuration;
+ float colorDuration = kColorDurationMs / totalDuration;
+ if (progress > colorDelay) {
+ colorProgress = std::min(1.0f, (progress - colorDelay) / colorDuration);
+ }
+ }
+ }
+
+ float dot_height =
+ gfx::Tween::FloatValueBetween(strokeProgress, kCloseStroke, kOpenStroke);
+ dot_height *= bounds.height();
+
+ float dot_width =
+ gfx::Tween::FloatValueBetween(widthProgress, kCloseStroke, kOpenWidth);
+ dot_width *= bounds.width();
+
+ gfx::PointF point = center_pt;
+ point.Offset(-dot_width / 2, -dot_height / 2);
+
+ SkColor color = is_opening ? gfx::Tween::ColorValueBetween(
+ colorProgress, start_color, severity_color)
+ : severity_color;
+
+ cc::PaintFlags flags;
+ flags.setColor(color);
+ flags.setStrokeWidth(bounds.height() * kCloseStroke);
+ flags.setStrokeCap(cc::PaintFlags::kRound_Cap);
+ flags.setStyle(cc::PaintFlags::kFill_Style);
+ flags.setAntiAlias(true);
+
+ gfx::SizeF dot_size = gfx::SizeF(dot_width, dot_height);
+ canvas->DrawRoundRect(gfx::RectF(point, dot_size), 2.0, flags);
+}
+
+AppMenuAnimation::AppMenuAnimation(AppMenuButton* owner,
+ bool should_animation_close)
+ : owner_(owner),
+ should_animation_close_(should_animation_close),
+ animation_(this),
+ bottom_dot_(0, kBottomWidthOpenInterval, kBottomStrokeOpenInterval),
+ middle_dot_(kDotDelayMs,
+ kMiddleWidthOpenInterval,
+ kMiddleStrokeOpenInterval),
+ top_dot_(kDotDelayMs * 2, kTopWidthOpenInterval, kTopStrokeOpenInterval),
+ start_color_(gfx::kPlaceholderColor),
+ severity_color_(gfx::kPlaceholderColor) {
+ animation_.SetSlideDuration(kOpenDuration);
+ animation_.SetTweenType(gfx::Tween::FAST_OUT_SLOW_IN);
+}
+
+void AppMenuAnimation::PaintAppMenu(gfx::Canvas* canvas,
+ const gfx::Rect& bounds) {
+ gfx::PointF middle_point = gfx::PointF(bounds.CenterPoint());
+ float y_offset = kDotYOffset * bounds.height();
+ gfx::PointF top_point = middle_point;
+ top_point.Offset(0, -y_offset);
+
+ gfx::PointF bottom_point = middle_point;
+ bottom_point.Offset(0, y_offset);
+
+ middle_dot_.Paint(middle_point, start_color_, severity_color_, canvas, bounds,
+ &animation_);
+ top_dot_.Paint(top_point, start_color_, severity_color_, canvas, bounds,
+ &animation_);
+ bottom_dot_.Paint(bottom_point, start_color_, severity_color_, canvas, bounds,
+ &animation_);
+}
+
+void AppMenuAnimation::UpdateIconColor(SkColor start_color,
+ SkColor severity_color) {
+ start_color_ = start_color;
+ severity_color_ = severity_color;
+}
+
+void AppMenuAnimation::StartAnimation() {
+ if (!animation_.is_animating()) {
+ animation_.SetSlideDuration(kOpenDuration);
+ animation_.Show();
+ }
+}
+
+void AppMenuAnimation::AnimationEnded(const gfx::Animation* animation) {
+ if (should_animation_close_ && animation_.IsShowing()) {
+ animation_.SetSlideDuration(kCloseDuration);
+ animation_.Hide();
+ }
+
+ if (!animation_.IsShowing())
+ start_color_ = severity_color_;
+}
+
+void AppMenuAnimation::AnimationProgressed(const gfx::Animation* animation) {
+ owner_->SchedulePaint();
+}

Powered by Google App Engine
This is Rietveld 408576698