Add ripple effect to action buttons in new-style notification.

ui/message_center/views/notification_view_md.cc

 // 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 "ui/message_center/views/notification_view_md.h"
 
 #include <stddef.h>
 
 #include "base/strings/string_util.h"
 #include "ui/base/cursor/cursor.h"
 #include "ui/base/l10n/l10n_util.h"
 #include "ui/gfx/canvas.h"
 #include "ui/gfx/geometry/size.h"
 #include "ui/gfx/image/image_skia_operations.h"
 #include "ui/gfx/paint_vector_icon.h"
 #include "ui/gfx/skia_util.h"
 #include "ui/gfx/text_elider.h"
 #include "ui/message_center/message_center.h"
 #include "ui/message_center/message_center_style.h"
 #include "ui/message_center/notification.h"
 #include "ui/message_center/notification_types.h"
 #include "ui/message_center/vector_icons.h"
 #include "ui/message_center/views/bounded_label.h"
 #include "ui/message_center/views/constants.h"
 #include "ui/message_center/views/message_center_controller.h"
 #include "ui/message_center/views/notification_header_view.h"
 #include "ui/message_center/views/padded_button.h"
 #include "ui/message_center/views/proportional_image_view.h"
 #include "ui/strings/grit/ui_strings.h"
+#include "ui/views/animation/ink_drop_highlight.h"
 #include "ui/views/background.h"
 #include "ui/views/border.h"
 #include "ui/views/controls/button/label_button.h"
 #include "ui/views/controls/image_view.h"
 #include "ui/views/controls/label.h"
 #include "ui/views/controls/progress_bar.h"
 #include "ui/views/focus/focus_manager.h"
 #include "ui/views/layout/box_layout.h"
 #include "ui/views/layout/fill_layout.h"
 #include "ui/views/native_cursor.h"
 #include "ui/views/view_targeter.h"
 #include "ui/views/widget/widget.h"
 
 namespace message_center {
 
 namespace {
 
 // Dimensions.
 constexpr gfx::Insets kContentRowPadding(4, 12, 12, 12);
 constexpr gfx::Insets kActionsRowPadding(8, 8, 8, 8);
 constexpr int kActionsRowHorizontalSpacing = 8;
 constexpr gfx::Insets kImageContainerPadding(0, 12, 12, 12);
+constexpr gfx::Insets kActionButtonPadding(0, 12, 0, 12);
+constexpr gfx::Size kActionButtonMinSize(88, 32);
 
 // Foreground of small icon image.
 constexpr SkColor kSmallImageBackgroundColor = SK_ColorWHITE;
 // Background of small icon image.
 const SkColor kSmallImageColor = SkColorSetRGB(0x43, 0x43, 0x43);
 // Background of inline actions area.
 const SkColor kActionsRowBackgroundColor = SkColorSetRGB(0xee, 0xee, 0xee);
+// Base ink drop color of action buttons.
+const SkColor kActionButtonInkDropBaseColor = SkColorSetRGB(0x0, 0x0, 0x0);
+// Ripple ink drop opacity of action buttons.
+const float kActionButtonInkDropRippleVisibleOpacity = 0.08f;
+// Highlight (hover) ink drop opacity of action buttons.
+const float kActionButtonInkDropHighlightVisibleOpacity = 0.08f;
+// Text color of action button.
+const SkColor kActionButtonTextColor = SkColorSetRGB(0x33, 0x67, 0xD6);
 
 // Max number of lines for message_view_.
 constexpr int kMaxLinesForMessageView = 1;
 constexpr int kMaxLinesForExpandedMessageView = 4;
 
 constexpr int kListNotificationOverflowIndicatorSpacing = 4;
 constexpr int kCompactTitleMessageViewSpacing = 12;
 
 constexpr int kProgressBarHeight = 4;
 
@@ skipping 185 matching lines @@
   const int message_width =
       std::max(0, width() - title_width - kCompactTitleMessageViewSpacing);
   message = gfx::ElideText(message, font_list, message_width, gfx::ELIDE_TAIL);
 
   title_view_->SetText(title);
   message_view_->SetText(message);
 
   views::View::OnPaint(canvas);
 }
 
+// NotificationButtonMD ////////////////////////////////////////////////////////
+
+// This class is needed in addition to LabelButton mainly becuase we want to set
+// visible_opacity of InkDropHighlight.
+class NotificationButtonMD : public views::LabelButton {
+ public:
+  NotificationButtonMD(views::ButtonListener* listener,
+                       const base::string16& text);
+  ~NotificationButtonMD() override;
+
+  std::unique_ptr<views::InkDropHighlight> CreateInkDropHighlight()
+      const override;
+
+ private:
+  DISALLOW_COPY_AND_ASSIGN(NotificationButtonMD);
+};
+
+NotificationButtonMD::NotificationButtonMD(views::ButtonListener* listener,
+                                           const base::string16& text)
+    : views::LabelButton(listener, text, views::style::CONTEXT_BUTTON_MD) {
+  SetInkDropMode(views::LabelButton::InkDropMode::ON);
+  set_has_ink_drop_action_on_click(true);
+  set_ink_drop_base_color(kActionButtonInkDropBaseColor);
+  set_ink_drop_visible_opacity(kActionButtonInkDropRippleVisibleOpacity);
+  SetEnabledTextColors(kActionButtonTextColor);
+  SetBorder(views::CreateEmptyBorder(kActionButtonPadding));
+  SetMinSize(kActionButtonMinSize);
+  SetFocusForPlatform();
+}
+
+std::unique_ptr<views::InkDropHighlight>
+NotificationButtonMD::CreateInkDropHighlight() const {

[yoshiki, 2017/06/29 04:35:03]

Please move this below the dtor to match the order in the class definition.

[tetsui, 2017/06/29 04:39:33]

Done.

+  std::unique_ptr<views::InkDropHighlight> highlight =
+      views::LabelButton::CreateInkDropHighlight();
+  highlight->set_visible_opacity(kActionButtonInkDropHighlightVisibleOpacity);
+  return highlight;
+}
+
+NotificationButtonMD::~NotificationButtonMD() {}

[yoshiki, 2017/06/29 04:35:04]

please specify the default destructor: "~NotificationButtonMD() = default".

[tetsui, 2017/06/29 04:39:33]

Done.

+
 }  // anonymous namespace
 
 // ////////////////////////////////////////////////////////////
 // NotificationViewMD
 // ////////////////////////////////////////////////////////////
 
 views::View* NotificationViewMD::TargetForRect(views::View* root,
                                                const gfx::Rect& rect) {
   CHECK_EQ(root, this);
 
@@ skipping 396 matching lines @@
     for (auto* item : action_buttons_)
       delete item;
     action_buttons_.clear();
   }
 
   DCHECK_EQ(this, actions_row_->parent());
 
   for (size_t i = 0; i < buttons.size(); ++i) {
     ButtonInfo button_info = buttons[i];
     if (new_buttons) {
-      views::LabelButton* button = new views::LabelButton(
-          this, button_info.title, views::style::CONTEXT_BUTTON_MD);
-      button->SetFocusForPlatform();
+      NotificationButtonMD* button =
+          new NotificationButtonMD(this, button_info.title);
       action_buttons_.push_back(button);
       actions_row_->AddChildView(button);
     } else {
       action_buttons_[i]->SetText(button_info.title);
       action_buttons_[i]->SchedulePaint();
       action_buttons_[i]->Layout();
     }
   }
 
   if (new_buttons) {
@@ skipping 80 matching lines @@
                                   header_row_->expand_button()->HasFocus()) ||
                                  (header_row_->IsCloseButtonEnabled() &&
                                   header_row_->close_button()->HasFocus()) ||
                                  (header_row_->IsSettingsButtonEnabled() &&
                                   header_row_->settings_button()->HasFocus());
 
   header_row_->SetControlButtonsVisible(target_visibility);
 }
 
 }  // namespace message_center