Added the ripple effect animation to find bar buttons.

chrome/browser/ui/views/find_bar_view.cc

 // Copyright (c) 2012 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/find_bar_view.h"
 
 #include <algorithm>
 
 #include "base/strings/string_number_conversions.h"
 #include "base/strings/string_util.h"
@@ skipping 18 matching lines @@
 #include "ui/base/resource/resource_bundle.h"
 #include "ui/base/theme_provider.h"
 #include "ui/events/event.h"
 #include "ui/gfx/canvas.h"
 #include "ui/gfx/color_palette.h"
 #include "ui/gfx/paint_vector_icon.h"
 #include "ui/gfx/vector_icons_public.h"
 #include "ui/native_theme/common_theme.h"
 #include "ui/native_theme/native_theme.h"
 #include "ui/resources/grit/ui_resources.h"
+#include "ui/views/animation/ink_drop_animation_controller.h"
+#include "ui/views/animation/ink_drop_animation_controller_factory.h"
+#include "ui/views/animation/ink_drop_host.h"
 #include "ui/views/background.h"
 #include "ui/views/border.h"
 #include "ui/views/bubble/bubble_border.h"
 #include "ui/views/controls/button/image_button.h"
 #include "ui/views/controls/label.h"
 #include "ui/views/controls/separator.h"
 #include "ui/views/layout/box_layout.h"
 #include "ui/views/painter.h"
 #include "ui/views/view_targeter.h"
 #include "ui/views/widget/widget.h"
@@ skipping 41 matching lines @@
 // The color of the match count label for Material Design.
 const SkColor kMatchTextColorMD = SkColorSetRGB(0x96, 0x96, 0x96);
 
 // Color of the vertical separator between match count and buttons. (MD only.)
 const SkColor kSeparatorColor = SkColorSetARGB(0x26, 0, 0, 0);
 
 // The default number of average characters that the text box will be. This
 // number brings the width on a "regular fonts" system to about 300px.
 const int kDefaultCharWidth = 43;
 
+class FindBarButton : public views::ImageButton, public views::InkDropHost {
+ public:
+  FindBarButton(views::ButtonListener* listener)
+      : views::ImageButton(listener),
+        ink_drop_animation_controller_(
+            views::InkDropAnimationControllerFactory::
+                CreateInkDropAnimationController(this)) {
+    // Sizes for ink drop animation.
+    const int kInkDropLargeSize = 24;
+    const int kInkDropLargeCornerRadius = 4;
+    const int kInkDropSmallSize = 18;
+    const int kInkDropSmallCornerRadius = 2;
+
+    ink_drop_animation_controller_->SetInkDropSize(
+        gfx::Size(kInkDropLargeSize, kInkDropLargeSize),
+        kInkDropLargeCornerRadius,
+        gfx::Size(kInkDropSmallSize, kInkDropSmallSize),
+        kInkDropSmallCornerRadius);
+  }
+
+  ~FindBarButton() override {}
+
+ private:
+  void Layout() override {
+    ImageButton::Layout();
+
+    ink_drop_animation_controller_->SetInkDropCenter(
+        GetLocalBounds().CenterPoint());
+  }
+
+  void AddInkDropLayer(ui::Layer* ink_drop_layer) override {
+    SetPaintToLayer(true);
+    SetFillsBoundsOpaquely(false);
+    layer()->Add(ink_drop_layer);
+    layer()->StackAtBottom(ink_drop_layer);
+  }
+
+  void RemoveInkDropLayer(ui::Layer* ink_drop_layer) override {
+    layer()->Remove(ink_drop_layer);
+    SetFillsBoundsOpaquely(true);
+    SetPaintToLayer(false);
+  }
+
+  bool OnMousePressed(const ui::MouseEvent& event) override {
+    // views::Button actions are only triggered by left and middle mouse clicks.

[bruthig, 2015/10/09 16:01:14]

Can you double check that the middle mouse click activates the button?  If not
we may need to update this comment, and fix the original comment in
toolbar_button.cc if it's not accurate.

[Hadi, 2015/10/09 17:01:18]

Done.

CustomButton::OnMousePressed() and CustomButton::OnMouseReleased() use
IsTriggerableEvent() to decide if the listener should be notified or not, so I
used the same function here and removed the comment.

+    if (event.IsLeftMouseButton() || event.IsMiddleMouseButton()) {
+      ink_drop_animation_controller_->AnimateToState(
+          views::InkDropState::ACTION_PENDING);
+    }
+
+    return ImageButton::OnMousePressed(event);
+  }
+
+  void OnGestureEvent(ui::GestureEvent* event) override {
+    ImageButton::OnGestureEvent(event);
+
+    views::InkDropState ink_drop_state = views::InkDropState::HIDDEN;
+    switch (event->type()) {
+      case ui::ET_GESTURE_TAP_DOWN:
+        ink_drop_state = views::InkDropState::ACTION_PENDING;
+        // The ui::ET_GESTURE_TAP_DOWN event needs to be marked as handled so
+        // that subsequent events for the gesture are sent to |this|.
+        event->SetHandled();
+        break;
+      case ui::ET_GESTURE_LONG_PRESS:
+        ink_drop_state = views::InkDropState::SLOW_ACTION_PENDING;
+        break;
+      case ui::ET_GESTURE_TAP:
+        ink_drop_state = views::InkDropState::QUICK_ACTION;
+        break;
+      case ui::ET_GESTURE_LONG_TAP:
+        ink_drop_state = views::InkDropState::SLOW_ACTION;
+        break;
+      case ui::ET_GESTURE_END:
+      case ui::ET_GESTURE_TAP_CANCEL:
+        ink_drop_state = views::InkDropState::HIDDEN;
+        break;
+      default:
+        return;
+    }
+    ink_drop_animation_controller_->AnimateToState(ink_drop_state);
+  }
+
+  void OnMouseReleased(const ui::MouseEvent& event) override {
+    ImageButton::OnMouseReleased(event);
+    ink_drop_animation_controller_->AnimateToState(views::InkDropState::HIDDEN);

[bruthig, 2015/10/09 16:01:14]

Can you update this to check the event location similar to what I've done here:
https://codereview.chromium.org/1373983002/diff/120001/chrome/browser/ui/view...

[Hadi, 2015/10/09 17:01:18]

Done.

+  }
+
+  void NotifyClick(const ui::Event& event) override {
+    ImageButton::NotifyClick(event);
+    ink_drop_animation_controller_->AnimateToState(
+        views::InkDropState::QUICK_ACTION);
+  }
+
+  // Animation controller for the ink drop ripple effect.
+  scoped_ptr<views::InkDropAnimationController> ink_drop_animation_controller_;
+};
+
 // The match count label is like a normal label, but can process events (which
 // makes it easier to forward events to the text input --- see
 // FindBarView::TargetForRect).
 class MatchCountLabel : public views::Label {
  public:
   MatchCountLabel() {}
   ~MatchCountLabel() override {}
 
   // views::Label overrides:
   bool CanProcessEventsWithinSubtree() const override { return true; }
@@ skipping 16 matching lines @@
       find_next_button_(NULL),
       close_button_(NULL) {
   find_text_ = new views::Textfield;
   find_text_->set_id(VIEW_ID_FIND_IN_PAGE_TEXT_FIELD);
   find_text_->set_default_width_in_chars(kDefaultCharWidth);
   find_text_->set_controller(this);
   find_text_->SetAccessibleName(l10n_util::GetStringUTF16(IDS_ACCNAME_FIND));
   find_text_->SetTextInputFlags(ui::TEXT_INPUT_FLAG_AUTOCORRECT_OFF);
   AddChildView(find_text_);
 
-  find_previous_button_ = new views::ImageButton(this);
+  find_previous_button_ = new FindBarButton(this);
   find_previous_button_->set_tag(FIND_PREVIOUS_TAG);
   find_previous_button_->SetFocusable(true);
   find_previous_button_->SetTooltipText(
       l10n_util::GetStringUTF16(IDS_FIND_IN_PAGE_PREVIOUS_TOOLTIP));
   find_previous_button_->SetAccessibleName(
       l10n_util::GetStringUTF16(IDS_ACCNAME_PREVIOUS));
   AddChildView(find_previous_button_);
 
-  find_next_button_ = new views::ImageButton(this);
+  find_next_button_ = new FindBarButton(this);
   find_next_button_->set_tag(FIND_NEXT_TAG);
   find_next_button_->SetFocusable(true);
   find_next_button_->SetTooltipText(
       l10n_util::GetStringUTF16(IDS_FIND_IN_PAGE_NEXT_TOOLTIP));
   find_next_button_->SetAccessibleName(
       l10n_util::GetStringUTF16(IDS_ACCNAME_NEXT));
   AddChildView(find_next_button_);
 
-  close_button_ = new views::ImageButton(this);
+  close_button_ = new FindBarButton(this);
   close_button_->set_tag(CLOSE_TAG);
   close_button_->SetFocusable(true);
   close_button_->SetTooltipText(
       l10n_util::GetStringUTF16(IDS_FIND_IN_PAGE_CLOSE_TOOLTIP));
   close_button_->SetAccessibleName(
       l10n_util::GetStringUTF16(IDS_ACCNAME_CLOSE));
   close_button_->SetAnimationDuration(0);
   AddChildView(close_button_);
 
   EnableCanvasFlippingForRTLUI(true);
@@ skipping 489 matching lines @@
 void FindBarView::OnNativeThemeChanged(const ui::NativeTheme* theme) {
   if (!ui::MaterialDesignController::IsModeMaterial())
     return;
 
   SkColor color =
       theme->GetSystemColor(ui::NativeTheme::kColorId_DialogBackground);
   set_background(views::Background::CreateSolidBackground(color));
   match_count_text_->SetBackgroundColor(color);
   match_count_text_->SetEnabledColor(kMatchTextColorMD);
 }