Update avatar button to MD (part 1)

chrome/browser/ui/views/profiles/win10_native_avatar_button.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 "chrome/browser/ui/views/profiles/win10_native_avatar_button.h"
+
+#include "chrome/app/vector_icons/vector_icons.h"
+#include "chrome/browser/ui/views/tabs/tab_strip.h"
+#include "ui/gfx/paint_vector_icon.h"
+#include "ui/views/animation/flood_fill_ink_drop_ripple.h"
+#include "ui/views/animation/ink_drop_impl.h"
+#include "ui/views/border.h"
+#include "ui/views/painter.h"
+
+const int kButtonMinWidth = 48;
+const int kButtonMaxWidth = 96;
+// Height of the "cozy" MD button that slides over the tabstrip
+// ("tall" MD button height is computed)
+const int kButtonCozyHeight = 20;
+const int kButtonIconHeight = 16;
+const SkColor kButtonIconColor = SkColorSetARGB(138, 0, 0, 0);  // Alpha 54%

[Evan Stade, 2017/04/28 18:38:29]

I believe this is more or less equivalent to gfx::kChromeIconGrey. If it's
really important to have a non-opaque version of that color, I'm still pretty
sure this has to be used somewhere else as well and should be shared.

[emx, 2017/05/02 15:17:11]

It's noticeably lighter than kChromeIconGrey. As Alan wrote on 2017-04-12: "Evan
is right that #5a5a5a is identical to #000 on grey, but #000 0.54a is preferred
for its color blending properties.". I've changed the code to make it clearer
that this is black at 54% opacity, but I could not find an existing constant for
that.

+// Opacity of the ink drop on hover
+const float kHighlightInkDropOpacity = 0.08f;

[Evan Stade, 2017/04/28 18:38:29]

nit: InkDropHighlight, InkDropRipple

[emx, 2017/05/02 15:17:11]

Done.

+// Opacity of the ink drop on click, which is added to kHighlightInkDropOpacity
+const float kRippleInkDropOpacity = 0.04f;
+
+Win10NativeAvatarButton::Win10NativeAvatarButton(
+    views::MenuButtonListener* listener,
+    Profile* profile,
+    BrowserView* browser_view)
+    : AvatarButton(listener, profile), browser_view_(browser_view) {
+  DCHECK(browser_view);
+
+  set_generic_avatar(gfx::CreateVectorIcon(
+      kAccountCircleIcon, kButtonIconHeight, kButtonIconColor));
+  SetBorder(CreateBorder());
+
+  Update();
+  SchedulePaint();
+
+  SetInkDropMode(InkDropMode::ON);
+  set_has_ink_drop_action_on_click(true);
+  SetFocusPainter(nullptr);
+  set_ink_drop_base_color(SK_ColorBLACK);
+  set_ink_drop_visible_opacity(kRippleInkDropOpacity);
+}
+
+Win10NativeAvatarButton::~Win10NativeAvatarButton() {}
+
+gfx::Size Win10NativeAvatarButton::GetPreferredSize() const {
+  gfx::Size ps = views::MenuButton::GetPreferredSize();
+  ps.set_width(
+      std::min(std::max(ps.width(), kButtonMinWidth), kButtonMaxWidth));
+  // TODO(emx): get the proper height here - see http://crrev/2833363002
+  ps.set_height(30);
+  return ps;
+}
+
+std::unique_ptr<views::Border> Win10NativeAvatarButton::CreateBorder() const {
+  // These insets look OK at 100%, 125%, 150%, 175% and 200% scaling.
+  const int kLeftRightInset = 8;
+  const int kTopInset = 1;
+  const int kBottomInset = 3;
+  return views::CreateEmptyBorder(kTopInset, kLeftRightInset, kBottomInset,
+                                  kLeftRightInset);
+}
+
+std::unique_ptr<views::InkDrop> Win10NativeAvatarButton::CreateInkDrop() {
+  return CreateDefaultFloodFillInkDropImpl();
+}
+
+std::unique_ptr<views::InkDropHighlight>
+Win10NativeAvatarButton::CreateInkDropHighlight() const {
+  auto center = gfx::RectF(gfx::Rect(size())).CenterPoint();

[Evan Stade, 2017/04/28 18:38:29]

nit: s/gfx::Rect(size())/GetLocalBounds()

[emx, 2017/05/02 15:17:11]

Done.

+  auto ink_drop_highlight = base::MakeUnique<views::InkDropHighlight>(
+      size(), 0, center, GetInkDropBaseColor());
+  ink_drop_highlight->set_visible_opacity(kHighlightInkDropOpacity);
+  return ink_drop_highlight;
+}
+
+std::unique_ptr<views::InkDropRipple>
+Win10NativeAvatarButton::CreateInkDropRipple() const {

[Evan Stade, 2017/04/28 18:38:30]

this looks like it's copied pretty much verbatim from LabelButton. Could we just
make it possible to override UseFloodFill instead?

[emx, 2017/05/02 15:17:11]

Done.

+  return base::MakeUnique<views::FloodFillInkDropRipple>(
+      size(), GetInkDropCenterBasedOnLastEvent(), GetInkDropBaseColor(),
+      ink_drop_visible_opacity());
+}
+
+void Win10NativeAvatarButton::UpdateButtonHeightForPosition(
+    const int button_x,
+    int* button_height) const {
+  TabStrip* tab_strip = browser_view_->tabstrip();
+  if (!tab_strip)
+    return;
+
+  // In RTL the new tab button is on the left, so it can never slide under the
+  // avatar button (which is still on the right). May as well use the space.
+  if (base::i18n::IsRTL())
+    return;
+
+  // Use the "cozy" button if the tabstrip can slide under it
+  if (tab_strip->max_x() >= button_x) {
+    *button_height = kButtonCozyHeight;
+  }
+}