Reflow of the profile items in desktop user menu

chrome/browser/ui/views/profiles/profile_chooser_view.cc

 // Copyright 2014 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/profile_chooser_view.h"
 
 #include "base/macros.h"
 #include "base/metrics/user_metrics.h"
 #include "base/strings/utf_string_conversions.h"
 #include "chrome/browser/browser_process.h"
@@ skipping 65 matching lines @@
 #include "ui/views/layout/box_layout.h"
 #include "ui/views/layout/fill_layout.h"
 #include "ui/views/layout/grid_layout.h"
 #include "ui/views/layout/layout_constants.h"
 #include "ui/views/widget/widget.h"
 
 namespace {
 
 // Helpers --------------------------------------------------------------------
 
-const int kFixedMenuWidth = 250;
 const int kButtonHeight = 32;
 const int kPasswordCombinedFixedGaiaViewWidth = 360;
 const int kFixedGaiaViewWidth = 448;
 const int kFixedAccountRemovalViewWidth = 280;
 const int kFixedSwitchUserViewWidth = 320;
 const int kLargeImageSide = 88;
+const int kMediumImageSide = 40;
 
+const int kTextfieldLabelHorizontalSpacing = 4;
+const int kProfileHorizontalSpacing = 16;
 const int kVerticalSpacing = 16;
 
 const int kTitleViewNativeWidgetOffset = 8;
 
 bool IsProfileChooser(profiles::BubbleViewMode mode) {
   return mode == profiles::BUBBLE_VIEW_MODE_PROFILE_CHOOSER ||
       mode == profiles::BUBBLE_VIEW_MODE_FAST_PROFILE_CHOOSER;
 }
 
 // Creates a GridLayout with a single column. This ensures that all the child
 // views added get auto-expanded to fill the full width of the bubble.
 views::GridLayout* CreateSingleColumnLayout(views::View* view, int width) {

[Evan Stade, 2016/06/10 17:39:46]

I don't understand why this exists instead of using a BoxLayout?

[Jane, 2016/06/10 18:49:16]

I wouldn't know why this got created initially either; I used this class
following all the existing usages in this file. Do you think this is worth
refactoring? Then maybe we should open another CL just for this.

[Evan Stade, 2016/06/10 19:53:34]

I'd at least not add another usage of it. Create a good pattern to follow,
unless there's some non-obvious reason this needs to exist (in which case
document it).

[Jane, 2016/06/10 21:09:42]

That sounds like a reasonable suggestion. However, I think it's a pretty big
decision and change to make for right now/this CL. I just tried switching to box
layout, and there seem to be many different functions for adding insets,
views/rows, paddings, etc. for box layout versus grid layout, making this
potential change to be very involved. Do you think we can defer this change to
later?

[Evan Stade, 2016/06/13 16:36:02]

Are you talking about updates to existing code or the new code you're adding? If
you're talking about the new code, I'd rather not defer.  Create a good pattern
to follow, use it, mark the old way deprecated. You don't have to change
pre-existing code.

[Jane, 2016/06/13 20:46:05]

I replaced the GridLayout with BoxLayout in the latest patch #8. How does it
look now?
Although I still couldn't find a way to add a padding row in BoxLayout,
something like GridLayout's StartRowWithPadding (see L1642 of patch #7). I need
to add an extra padding below the blue button when it appears. Do you know of a
way or an example? Thanks!

   views::GridLayout* layout = new views::GridLayout(view);
   view->SetLayoutManager(layout);
 
   views::ColumnSet* columns = layout->AddColumnSet(0);
   columns->AddColumn(views::GridLayout::FILL, views::GridLayout::FILL, 0,
                      views::GridLayout::FIXED, width, width);
   return layout;
 }
 
 views::Link* CreateLink(const base::string16& link_text,
@@ skipping 140 matching lines @@
   gfx::Rect bounds(title_view_->GetPreferredSize());
   title_view_->SetBoundsRect(bounds);
   bounds.Offset(kTitleViewNativeWidgetOffset, kTitleViewNativeWidgetOffset);
   title_widget_->SetBounds(bounds);
 }
 
 }  // namespace
 
 // RightAlignedIconLabelButton -------------------------------------------------
 
-// A custom LabelButton that has a centered text and right aligned icon.
+// A custom LabelButton that has a left-aligned text and right aligned icon.
+// For non-material-design user menu, it has centered text instead.
 class RightAlignedIconLabelButton : public views::LabelButton {
  public:
   RightAlignedIconLabelButton(views::ButtonListener* listener,
                               const base::string16& text)
       : views::LabelButton(listener, text) {
     SetHorizontalAlignment(gfx::ALIGN_RIGHT);
-    label()->SetHorizontalAlignment(gfx::ALIGN_CENTER);
+    label()->SetHorizontalAlignment(switches::IsMaterialDesignUserMenu()
+                                    ? gfx::ALIGN_LEFT : gfx::ALIGN_CENTER);
   }
 
  protected:
   void Layout() override {
     views::LabelButton::Layout();
 
     // Keep the text centered and the icon right-aligned by stretching the label
     // to take up more of the content area and centering its contents.
     gfx::Rect content_bounds = GetContentsBounds();
     gfx::Rect label_bounds = label()->bounds();
@@ skipping 17 matching lines @@
 
 // A custom Image control that shows a "change" button when moused over.
 class EditableProfilePhoto : public views::LabelButton {
  public:
   EditableProfilePhoto(views::ButtonListener* listener,
                        const gfx::Image& icon,
                        bool is_editing_allowed,
                        const gfx::Rect& bounds)
       : views::LabelButton(listener, base::string16()),
         photo_overlay_(NULL) {
+    const int icon_image_side = switches::IsMaterialDesignUserMenu()
+        ? kMediumImageSide : kLargeImageSide;
     gfx::Image image = profiles::GetSizedAvatarIcon(
-        icon, true, kLargeImageSide, kLargeImageSide);
+        icon, true, icon_image_side, icon_image_side);
     SetImage(views::LabelButton::STATE_NORMAL, *image.ToImageSkia());
     SetBorder(views::Border::NullBorder());
     SetBoundsRect(bounds);
 
     // Calculate the circular mask that will be used to display the photo.
     circular_mask_.addCircle(SkIntToScalar(bounds.width() / 2),
                              SkIntToScalar(bounds.height() / 2),
                              SkIntToScalar(bounds.width() / 2));
 
     if (!is_editing_allowed) {
       SetEnabled(false);
       return;
     }
 
     set_notify_enter_exit_on_child(true);
 
     // Photo overlay that appears when hovering over the button.
     photo_overlay_ = new views::ImageView();
 
     const SkColor kBackgroundColor = SkColorSetARGB(65, 255, 255, 255);
     photo_overlay_->set_background(
         views::Background::CreateSolidBackground(kBackgroundColor));
     photo_overlay_->SetImage(gfx::CreateVectorIcon(
-        gfx::VectorIconId::PHOTO_CAMERA, 48u, SkColorSetRGB(0x33, 0x33, 0x33)));
+        gfx::VectorIconId::PHOTO_CAMERA,
+        switches::IsMaterialDesignUserMenu() ? 22u : 48u,
+        SkColorSetRGB(0x33, 0x33, 0x33)));
 
     photo_overlay_->SetSize(bounds.size());
     photo_overlay_->SetVisible(false);
     AddChildView(photo_overlay_);
   }
 
   void OnPaint(gfx::Canvas* canvas) override {
     // Display the profile picture as a circle.
     canvas->ClipPath(circular_mask_, true);
     views::LabelButton::OnPaint(canvas);
@@ skipping 51 matching lines @@
         new views::BoxLayout(views::BoxLayout::kVertical, 0, 0, 0));
 
     ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
     const gfx::FontList& medium_font_list =
         rb->GetFontList(ui::ResourceBundle::MediumFont);
 
     if (!is_editing_allowed) {
       label_ = new views::Label(text);
       label_->SetBorder(views::Border::CreateEmptyBorder(2, 0, 2, 0));
       label_->SetFontList(medium_font_list);
+      if (switches::IsMaterialDesignUserMenu())
+        label_->SetHorizontalAlignment(gfx::ALIGN_LEFT);
       AddChildView(label_);
       return;
     }
 
     button_ = new RightAlignedIconLabelButton(this, text);
     button_->SetFontList(medium_font_list);
     // Show an "edit" pencil icon when hovering over. In the default state,
     // we need to create an empty placeholder of the correct size, so that
     // the text doesn't jump around when the hovered icon appears.
     // TODO(estade): revisit colors and press effect.
     const int kIconSize = 16;
     button_->SetImage(views::LabelButton::STATE_NORMAL,
                       CreateSquarePlaceholderImage(kIconSize));
     button_->SetImage(views::LabelButton::STATE_HOVERED,
                       gfx::CreateVectorIcon(
                           gfx::VectorIconId::MODE_EDIT, kIconSize,
                           SkColorSetRGB(0x33, 0x33, 0x33)));
     button_->SetImage(views::LabelButton::STATE_PRESSED,
                       gfx::CreateVectorIcon(
                           gfx::VectorIconId::MODE_EDIT, kIconSize,
                           SkColorSetRGB(0x20, 0x20, 0x20)));
-    // To center the text, we need to offest it by the width of the icon we
-    // are adding and its padding. We need to also add a small top/bottom
-    // padding to account for the textfield's border.
-    const int kIconTextLabelButtonSpacing = 5;
-    button_->SetBorder(views::Border::CreateEmptyBorder(
-        2, kIconSize + kIconTextLabelButtonSpacing, 2, 0));
+    // We need to add a left padding as well as a small top/bottom padding
+    // to the text to account for the textfield's border.
+    if (switches::IsMaterialDesignUserMenu()) {
+      button_->SetBorder(views::Border::CreateEmptyBorder(
+          2, kTextfieldLabelHorizontalSpacing, 2, 0));
+    } else {
+      const int kIconTextLabelButtonSpacing = 5;
+      button_->SetBorder(views::Border::CreateEmptyBorder(
+          2, kIconSize + kIconTextLabelButtonSpacing, 2, 0));
+    }
     AddChildView(button_);
 
     profile_name_textfield_ = new views::Textfield();
     // Textfield that overlaps the button.
     profile_name_textfield_->set_controller(controller);
     profile_name_textfield_->SetFontList(medium_font_list);
-    profile_name_textfield_->SetHorizontalAlignment(gfx::ALIGN_CENTER);
+    profile_name_textfield_->SetHorizontalAlignment(
+        switches::IsMaterialDesignUserMenu()
+        ? gfx::ALIGN_LEFT : gfx::ALIGN_CENTER);
     profile_name_textfield_->SetVisible(false);
     AddChildView(profile_name_textfield_);
   }
 
   views::Textfield* profile_name_textfield() {
     return profile_name_textfield_;
   }
 
   // Hide the editable textfield to show the profile name button instead.
   void ShowReadOnlyView() {
@@ skipping 106 matching lines @@
 
   views::ImageButton* back_button_;
   views::Label* title_label_;
 
   DISALLOW_COPY_AND_ASSIGN(TitleCard);
 };
 
 // ProfileBadge --------------------------------------------------------
 
 const size_t kProfileBadgeSize = 30;
+const size_t kSmallProfileBadgeSize = 24;
 const size_t kProfileBadgeWhitePadding = 2;
 
 // Draws a white circle, then a light blue circle, then a dark blue icon.
 class ProfileBadge : public gfx::CanvasImageSource {
  public:
   ProfileBadge(gfx::VectorIconId id, size_t icon_size)
-      : CanvasImageSource(gfx::Size(kProfileBadgeSize, kProfileBadgeSize),
+      : CanvasImageSource(gfx::Size(
+                              switches::IsMaterialDesignUserMenu()
+                              ? kSmallProfileBadgeSize : kProfileBadgeSize,

[Evan Stade, 2016/06/10 17:39:46]

is this the output of git cl format?

[Jane, 2016/06/10 18:49:16]

Missed it, now it is.

+                              switches::IsMaterialDesignUserMenu()
+                              ? kSmallProfileBadgeSize : kProfileBadgeSize),
                           false),
         id_(id),
         icon_size_(icon_size) {}
 
   ~ProfileBadge() override {}
 
   // CanvasImageSource:
   void Draw(gfx::Canvas* canvas) override {
     const SkISize size = canvas->sk_canvas()->getBaseLayerSize();
     gfx::Rect bounds(0, 0, size.width(), size.height());
 
     SkPaint paint;
     paint.setAntiAlias(true);
     paint.setColor(SK_ColorWHITE);
     canvas->DrawCircle(bounds.CenterPoint(), size.width() / 2, paint);
 
     paint.setColor(SkColorSetRGB(0xAF, 0xD9, 0xFC));
     canvas->DrawCircle(bounds.CenterPoint(),
                        size.width() / 2 - kProfileBadgeWhitePadding, paint);
 
-    int offset = (kProfileBadgeSize - icon_size_) / 2;
+    int offset = ((switches::IsMaterialDesignUserMenu()
+        ? kSmallProfileBadgeSize : kProfileBadgeSize)
+        - icon_size_) / 2;
     canvas->Translate(gfx::Vector2d(offset, offset));
     gfx::PaintVectorIcon(canvas, id_, icon_size_, SkColorSetRGB(0, 0x66, 0xff));
   }
 
  private:
   const gfx::VectorIconId id_;
   const size_t icon_size_;
 
   DISALLOW_COPY_AND_ASSIGN(ProfileBadge);
 };
 
 gfx::ImageSkia CreateBadgeForProfile(Profile* profile) {
-  ProfileBadge* badge =
-      profile->IsChild()
-          ? new ProfileBadge(gfx::VectorIconId::ACCOUNT_CHILD_INVERT, 26)
-          : new ProfileBadge(gfx::VectorIconId::SUPERVISOR_ACCOUNT, 20);
-
+  ProfileBadge* badge = profile->IsChild()
+      ? new ProfileBadge(gfx::VectorIconId::ACCOUNT_CHILD_INVERT,
+                         switches::IsMaterialDesignUserMenu() ? 21 : 26)
+      : new ProfileBadge(gfx::VectorIconId::SUPERVISOR_ACCOUNT,
+                         switches::IsMaterialDesignUserMenu() ? 16 : 20);
   return gfx::ImageSkia(badge, badge->size());
 }
 
 // ProfileChooserView ---------------------------------------------------------
 
 // static
 ProfileChooserView* ProfileChooserView::profile_bubble_ = nullptr;
 bool ProfileChooserView::close_on_deactivate_for_testing_ = true;
 
 // static
@@ skipping 34 matching lines @@
 bool ProfileChooserView::IsShowing() {
   return profile_bubble_ != NULL;
 }
 
 // static
 void ProfileChooserView::Hide() {
   if (IsShowing())
     profile_bubble_->GetWidget()->Close();
 }
 
+// static
+int ProfileChooserView::GetFixedMenuWidth() {
+  return switches::IsMaterialDesignUserMenu() ? 240 : 250;
+}
+
 ProfileChooserView::ProfileChooserView(views::View* anchor_view,
                                        Browser* browser,
                                        profiles::BubbleViewMode view_mode,
                                        profiles::TutorialMode tutorial_mode,
                                        signin::GAIAServiceType service_type,
                                        signin_metrics::AccessPoint access_point)
     : BubbleDialogDelegateView(anchor_view, views::BubbleBorder::TOP_RIGHT),
       browser_(browser),
       view_mode_(view_mode),
       tutorial_mode_(tutorial_mode),
@@ skipping 154 matching lines @@
       break;
     case profiles::BUBBLE_VIEW_MODE_SWITCH_USER:
       layout = CreateSingleColumnLayout(this, kFixedSwitchUserViewWidth);
       sub_view = CreateSwitchUserView();
       ProfileMetrics::LogProfileNewAvatarMenuNotYou(
           ProfileMetrics::PROFILE_AVATAR_MENU_NOT_YOU_VIEW);
       break;
     case profiles::BUBBLE_VIEW_MODE_ACCOUNT_MANAGEMENT:
     case profiles::BUBBLE_VIEW_MODE_PROFILE_CHOOSER:
     case profiles::BUBBLE_VIEW_MODE_FAST_PROFILE_CHOOSER:
-      layout = CreateSingleColumnLayout(this, kFixedMenuWidth);
+      layout = CreateSingleColumnLayout(this, GetFixedMenuWidth());
       sub_view = CreateProfileChooserView(avatar_menu);
       break;
   }
   // Clears tutorial mode for all non-profile-chooser views.
   if (view_mode_ != profiles::BUBBLE_VIEW_MODE_PROFILE_CHOOSER)
     tutorial_mode_ = profiles::TUTORIAL_MODE_NONE;
 
   layout->StartRow(1, 0);
   layout->AddView(sub_view);
   Layout();
@@ skipping 225 matching lines @@
   Indexes other_profiles;
   views::View* tutorial_view = NULL;
   views::View* current_profile_view = NULL;
   views::View* current_profile_accounts = NULL;
   views::View* option_buttons_view = NULL;
   for (size_t i = 0; i < avatar_menu->GetNumberOfItems(); ++i) {
     const AvatarMenu::Item& item = avatar_menu->GetItemAt(i);
     if (item.active) {
       option_buttons_view = CreateOptionsView(
           item.signed_in && profiles::IsLockAvailable(browser_->profile()));
-      current_profile_view = CreateCurrentProfileView(item, false);
+      current_profile_view = switches::IsMaterialDesignUserMenu() ?
+          CreateMaterialDesignCurrentProfileView(item, false) :
+          CreateCurrentProfileView(item, false);
       if (IsProfileChooser(view_mode_)) {
         tutorial_view = CreateTutorialViewIfNeeded(item);
       } else {
         current_profile_accounts = CreateCurrentProfileAccountsView(item);
       }
     } else {
       other_profiles.push_back(i);
     }
   }
 
@@ skipping 16 matching lines @@
 
   if (!IsProfileChooser(view_mode_)) {
     DCHECK(current_profile_accounts);
     layout->StartRow(0, 0);
     layout->AddView(new views::Separator(views::Separator::HORIZONTAL));
     layout->StartRow(1, 0);
     layout->AddView(current_profile_accounts);
   }
 
   if (browser_->profile()->IsSupervised()) {
-    layout->StartRow(0, 0);
-    layout->AddView(new views::Separator(views::Separator::HORIZONTAL));
+    if (!switches::IsMaterialDesignUserMenu()) {
+      layout->StartRow(0, 0);
+      layout->AddView(new views::Separator(views::Separator::HORIZONTAL));
+    }
     layout->StartRow(1, 0);
     layout->AddView(CreateSupervisedUserDisclaimerView());
   }
 
   layout->StartRow(0, 0);
   layout->AddView(new views::Separator(views::Separator::HORIZONTAL));
 
   if (option_buttons_view) {
     layout->StartRow(0, 0);
     layout->AddView(option_buttons_view);
@@ skipping 11 matching lines @@
     }
   }
 
   layout->StartRow(1, 0);
   layout->AddView(CreateOtherProfilesView(other_profiles));
 }
 
 views::View* ProfileChooserView::CreateProfileChooserView(
     AvatarMenu* avatar_menu) {
   views::View* view = new views::View();
-  views::GridLayout* layout = CreateSingleColumnLayout(view, kFixedMenuWidth);
+  views::GridLayout* layout =
+      CreateSingleColumnLayout(view, GetFixedMenuWidth());
 
   if (view_mode_ == profiles::BUBBLE_VIEW_MODE_FAST_PROFILE_CHOOSER) {
     PopulateMinimalProfileChooserView(layout, avatar_menu);
     // The user is using right-click switching, no need to tell them about it.
     PrefService* local_state = g_browser_process->local_state();
     local_state->SetBoolean(
         prefs::kProfileAvatarRightClickTutorialDismissed, true);
   } else {
     PopulateCompleteProfileChooserView(layout, avatar_menu);
   }
@@ skipping 55 matching lines @@
     bool stack_button,
     views::Link** link,
     views::LabelButton** button,
     views::ImageButton** close_button) {
   tutorial_mode_ = tutorial_mode;
 
   views::View* view = new views::View();
   view->set_background(views::Background::CreateSolidBackground(
       profiles::kAvatarTutorialBackgroundColor));
   views::GridLayout* layout = CreateSingleColumnLayout(view,
-      kFixedMenuWidth - 2 * views::kButtonHEdgeMarginNew);
+      GetFixedMenuWidth() - 2 * views::kButtonHEdgeMarginNew);
   // Creates a second column set for buttons and links.
   views::ColumnSet* button_columns = layout->AddColumnSet(1);
   button_columns->AddColumn(views::GridLayout::LEADING,
       views::GridLayout::CENTER, 0, views::GridLayout::USE_PREF, 0, 0);
   button_columns->AddPaddingColumn(
       1, views::kUnrelatedControlHorizontalSpacing);
   button_columns->AddColumn(views::GridLayout::TRAILING,
       views::GridLayout::CENTER, 0, views::GridLayout::USE_PREF, 0, 0);
   layout->SetInsets(views::kButtonVEdgeMarginNew,
                     views::kButtonHEdgeMarginNew,
@@ skipping 81 matching lines @@
       layout->SkipColumns(1);
   }
 
   return view;
 }
 
 views::View* ProfileChooserView::CreateCurrentProfileView(
     const AvatarMenu::Item& avatar_item,
     bool is_guest) {
   views::View* view = new views::View();
-  int column_width = kFixedMenuWidth - 2 * views::kButtonHEdgeMarginNew;
+  int column_width = GetFixedMenuWidth() - 2 * views::kButtonHEdgeMarginNew;
   views::GridLayout* layout = CreateSingleColumnLayout(view, column_width);
   layout->SetInsets(views::kButtonVEdgeMarginNew,
                     views::kButtonHEdgeMarginNew,
                     views::kUnrelatedControlVerticalSpacing,
                     views::kButtonHEdgeMarginNew);
 
   // Profile icon, centered.
   int x_offset = (column_width - kLargeImageSide) / 2;
   current_profile_photo_ = new EditableProfilePhoto(
       this, avatar_item.icon, !is_guest,
@@ skipping 92 matching lines @@
       layout->StartRow(1, 0);
       layout->AddView(signin_current_profile_link_);
       content::RecordAction(
           base::UserMetricsAction("Signin_Impression_FromAvatarBubbleSignin"));
     }
   }
 
   return view;
 }
 
+views::View* ProfileChooserView::CreateMaterialDesignCurrentProfileView(
+    const AvatarMenu::Item& avatar_item,
+    bool is_guest) {
+  views::View* view = new views::View();
+  int column_width = GetFixedMenuWidth() - 2 * views::kMaterialHorizontalMargin;
+  views::GridLayout* layout = CreateSingleColumnLayout(view, column_width);
+  layout->SetInsets(views::kRelatedControlVerticalSpacing,
+                    views::kMaterialHorizontalMargin,
+                    views::kRelatedControlVerticalSpacing,
+                    views::kMaterialHorizontalMargin);
+
+  // Profile picture left aligned for material design user menu,
+  // centered otherwise.
+  const int profile_bar_height = 56;
+  current_profile_photo_ = new EditableProfilePhoto(
+      this, avatar_item.icon, !is_guest,
+      gfx::Rect(0, (profile_bar_height - kMediumImageSide) / 2,
+                kMediumImageSide, kMediumImageSide));
+  SizedContainer* profile_container =
+      new SizedContainer(gfx::Size(column_width, profile_bar_height));
+  profile_container->AddChildView(current_profile_photo_);
+
+  // Add supervised badge for supervised profile.
+  if (browser_->profile()->IsSupervised()) {
+    const int badge_spacing = 4;
+    views::ImageView* supervised_icon = new views::ImageView();
+    supervised_icon->SetImage(CreateBadgeForProfile(browser_->profile()));
+    gfx::Size preferred_size = supervised_icon->GetPreferredSize();
+    gfx::Rect parent_bounds = current_profile_photo_->bounds();
+    supervised_icon->SetBounds(
+        parent_bounds.right() - preferred_size.width() + badge_spacing,
+        parent_bounds.bottom() - preferred_size.height() + badge_spacing,
+        preferred_size.width(),
+        preferred_size.height());
+    profile_container->AddChildView(supervised_icon);
+  }
+
+  // Profile name, left-aligned to the right of profile icon.
+  bool editing_allowed = !is_guest &&
+                         !browser_->profile()->IsLegacySupervised();
+  current_profile_name_ = new EditableProfileName(
+      this,
+      profiles::GetAvatarNameForProfile(browser_->profile()->GetPath()),
+      editing_allowed);
+  gfx::Rect photo_bounds = current_profile_photo_->bounds();
+  const int textfield_left_margin =
+      kProfileHorizontalSpacing -
+          (editing_allowed ? kTextfieldLabelHorizontalSpacing : 0);
+  current_profile_name_->SetBounds(
+      photo_bounds.width() + textfield_left_margin,
+      views::kRelatedControlVerticalSpacing,
+      profile_container->GetPreferredSize().width() - photo_bounds.width()
+          - textfield_left_margin,
+      profile_container->GetPreferredSize().height() / 2
+          - views::kRelatedControlVerticalSpacing);
+  profile_container->AddChildView(current_profile_name_);
+
+  // Center-align the avatar name if the profile is not signed in.
+  if (is_guest || !avatar_item.signed_in) {
+    current_profile_name_->SetY(
+      (profile_container->GetPreferredSize().height()
+          - current_profile_name_->height()) / 2);
+    layout->StartRow(1, 0);
+    layout->AddView(profile_container);
+  }
+
+  if (is_guest)
+    return view;
+
+  // The available links depend on the type of profile that is active.
+  if (avatar_item.signed_in) {
+    // Calculate the position and size for links available for signed-in
+    // profiles.
+    const int x_coordinate = photo_bounds.width() + kProfileHorizontalSpacing;
+    const int y_coordinate = profile_container->GetPreferredSize().height() / 2;
+    const int width = profile_container->GetPreferredSize().width()
+        - photo_bounds.width() - kProfileHorizontalSpacing;
+    const int height = profile_container->GetPreferredSize().height() / 2
+        - views::kRelatedControlVerticalSpacing;
+    layout->StartRow(1, 0);
+
+    if (switches::IsEnableAccountConsistency()) {
+      base::string16 link_title = l10n_util::GetStringUTF16(
+          IsProfileChooser(view_mode_) ?
+              IDS_PROFILES_PROFILE_MANAGE_ACCOUNTS_BUTTON :
+              IDS_PROFILES_PROFILE_HIDE_MANAGE_ACCOUNTS_BUTTON);
+      manage_accounts_link_ = CreateLink(link_title, this);
+      manage_accounts_link_->SetHorizontalAlignment(gfx::ALIGN_LEFT);
+      manage_accounts_link_->SetBounds(
+          x_coordinate, y_coordinate, width, height);
+      profile_container->AddChildView(manage_accounts_link_);
+    } else {

[Evan Stade, 2016/06/10 17:39:46]

combine else with if-else below

[Jane, 2016/06/10 18:49:16]

Done. FYI, these massive logic statements were basically copied from the
function above, i.e. CreateCurrentProfileView, with some modifications on UI
only. Also they are being completely reorganized in the downstream CL, and
that's why these logic didn't get a close look.

+      // Badge the email address if there's an authentication error.
+      if (HasAuthError(browser_->profile())) {
+        auth_error_email_button_ =
+            new RightAlignedIconLabelButton(this, avatar_item.username);
+        auth_error_email_button_->SetElideBehavior(gfx::ELIDE_EMAIL);
+        auth_error_email_button_->SetImage(
+            views::LabelButton::STATE_NORMAL,
+            gfx::CreateVectorIcon(gfx::VectorIconId::WARNING, 12,
+                                  gfx::kChromeIconGrey));
+        auth_error_email_button_->SetFocusForPlatform();
+        auth_error_email_button_->set_request_focus_on_press(true);
+        gfx::Insets insets =
+            views::LabelButtonAssetBorder::GetDefaultInsetsForStyle(
+                views::Button::STYLE_TEXTBUTTON);
+        auth_error_email_button_->SetBorder(views::Border::CreateEmptyBorder(
+            insets.top(), insets.left(), insets.bottom(), insets.right()));
+        auth_error_email_button_->SetBounds(
+            x_coordinate - insets.left(), y_coordinate, width, height);
+        profile_container->AddChildView(auth_error_email_button_);
+      } else {
+        views::Label* email_label = new views::Label(avatar_item.username);
+        email_label->SetElideBehavior(gfx::ELIDE_EMAIL);
+        email_label->SetEnabled(false);
+        email_label->SetHorizontalAlignment(gfx::ALIGN_LEFT);
+        email_label->SetBounds(x_coordinate, y_coordinate, width, height);
+        profile_container->AddChildView(email_label);
+      }
+    }
+    layout->AddView(profile_container);

[Evan Stade, 2016/06/10 17:39:46]

return view; then get rid of the next else

[Jane, 2016/06/10 18:49:16]

Done. But same as above.

+  } else {
+    SigninManagerBase* signin_manager = SigninManagerFactory::GetForProfile(
+        browser_->profile()->GetOriginalProfile());
+    if (signin_manager->IsSigninAllowed()) {
+      views::Label* promo = new views::Label(
+          l10n_util::GetStringUTF16(IDS_PROFILES_SIGNIN_PROMO));
+      promo->SetMultiLine(true);
+      promo->SetHorizontalAlignment(gfx::ALIGN_LEFT);
+      layout->StartRowWithPadding(1, 0, 0,
+                                  views::kRelatedControlVerticalSpacing);
+      layout->StartRow(1, 0);
+      layout->AddView(promo);
+
+      signin_current_profile_link_ = new views::BlueButton(

[Evan Stade, 2016/06/10 17:39:46]

don't use BlueButton for material design. What you want for now is
MdTextButton::CreateSecondaryUiBlueButton or just MdTextButton with a strong
call to action.

[Jane, 2016/06/10 18:49:16]

Done. Thanks, didn't know that.

+        this, l10n_util::GetStringFUTF16(IDS_SYNC_START_SYNC_BUTTON_LABEL,
+            l10n_util::GetStringUTF16(IDS_SHORT_PRODUCT_NAME)));
+      signin_current_profile_link_->SetMinSize(gfx::Size(0, 36));
+      layout->StartRowWithPadding(1, 0, 0,
+                                  views::kRelatedControlVerticalSpacing);
+      layout->StartRow(1, 0);
+      layout->AddView(signin_current_profile_link_);
+      content::RecordAction(
+          base::UserMetricsAction("Signin_Impression_FromAvatarBubbleSignin"));
+      layout->StartRowWithPadding(1, 0, 0,
+                                  views::kLabelToControlVerticalSpacing);
+    }
+  }
+
+  return view;
+}
+
 views::View* ProfileChooserView::CreateGuestProfileView() {
   gfx::Image guest_icon =
       ui::ResourceBundle::GetSharedInstance().GetImageNamed(
           profiles::GetPlaceholderAvatarIconResourceID());
   AvatarMenu::Item guest_avatar_item(0, base::FilePath(), guest_icon);
   guest_avatar_item.active = true;
   guest_avatar_item.name = l10n_util::GetStringUTF16(
       IDS_PROFILES_GUEST_PROFILE_NAME);
   guest_avatar_item.signed_in = false;
 
-  return CreateCurrentProfileView(guest_avatar_item, true);
+  return switches::IsMaterialDesignUserMenu() ?
+      CreateMaterialDesignCurrentProfileView(guest_avatar_item, true) :
+      CreateCurrentProfileView(guest_avatar_item, true);
 }
 
 views::View* ProfileChooserView::CreateOtherProfilesView(
     const Indexes& avatars_to_show) {
   views::View* view = new views::View();
-  views::GridLayout* layout = CreateSingleColumnLayout(view, kFixedMenuWidth);
+  views::GridLayout* layout =
+      CreateSingleColumnLayout(view, GetFixedMenuWidth());
 
   for (size_t index : avatars_to_show) {
     const AvatarMenu::Item& item = avatar_menu_->GetItemAt(index);
     const int kSmallImageSide = 32;
 
     // Use the low-res, small default avatars in the fast user switcher, like
     // we do in the menu bar.
     gfx::Image item_icon;
     AvatarMenu::GetImageForMenuButton(item.profile_path, &item_icon);
 
@@ skipping 10 matching lines @@
     layout->AddView(new views::Separator(views::Separator::HORIZONTAL));
     layout->StartRow(1, 0);
     layout->AddView(button);
   }
 
   return view;
 }
 
 views::View* ProfileChooserView::CreateOptionsView(bool display_lock) {
   views::View* view = new views::View();
-  views::GridLayout* layout = CreateSingleColumnLayout(view, kFixedMenuWidth);
+  views::GridLayout* layout =
+      CreateSingleColumnLayout(view, GetFixedMenuWidth());
 
   base::string16 text = browser_->profile()->IsGuestSession() ?
       l10n_util::GetStringUTF16(IDS_PROFILES_EXIT_GUEST) :
       l10n_util::GetStringUTF16(IDS_PROFILES_MANAGE_USERS_BUTTON);
   const int kIconSize = 16;
   users_button_ = new BackgroundColorHoverButton(
       this, text, gfx::CreateVectorIcon(gfx::VectorIconId::ACCOUNT_BOX,
                                         kIconSize, gfx::kChromeIconGrey));
   layout->StartRow(1, 0);
   layout->AddView(users_button_);
 
   if (display_lock) {
     layout->StartRow(1, 0);
     layout->AddView(new views::Separator(views::Separator::HORIZONTAL));
 
     lock_button_ = new BackgroundColorHoverButton(
         this, l10n_util::GetStringUTF16(IDS_PROFILES_PROFILE_SIGNOUT_BUTTON),
         gfx::CreateVectorIcon(gfx::VectorIconId::LOCK, kIconSize,
                               gfx::kChromeIconGrey));
     layout->StartRow(1, 0);
     layout->AddView(lock_button_);
   }
   return view;
 }
 
 views::View* ProfileChooserView::CreateSupervisedUserDisclaimerView() {
   views::View* view = new views::View();
   views::GridLayout* layout = CreateSingleColumnLayout(
-      view, kFixedMenuWidth - 2 * views::kButtonHEdgeMarginNew);
-  layout->SetInsets(views::kRelatedControlVerticalSpacing,
-                    views::kButtonHEdgeMarginNew,
-                    views::kRelatedControlVerticalSpacing,
-                    views::kButtonHEdgeMarginNew);
+      view, GetFixedMenuWidth() - 2 * views::kButtonHEdgeMarginNew);
+  if (switches::IsMaterialDesignUserMenu()) {
+    layout->SetInsets(0,
+                      views::kMaterialHorizontalMargin,
+                      views::kMaterialVerticalMargin,
+                      views::kMaterialHorizontalMargin);
+  } else {
+    layout->SetInsets(views::kRelatedControlVerticalSpacing,
+                      views::kButtonHEdgeMarginNew,
+                      views::kRelatedControlVerticalSpacing,
+                      views::kButtonHEdgeMarginNew);
+  }
+
   views::Label* disclaimer = new views::Label(
       avatar_menu_->GetSupervisedUserInformation());
   disclaimer->SetMultiLine(true);
   disclaimer->SetAllowCharacterBreak(true);
   disclaimer->SetHorizontalAlignment(gfx::ALIGN_LEFT);
   ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
   disclaimer->SetFontList(rb->GetFontList(ui::ResourceBundle::SmallFont));
   layout->StartRow(1, 0);
   layout->AddView(disclaimer);
 
   return view;
 }
 
 views::View* ProfileChooserView::CreateCurrentProfileAccountsView(
     const AvatarMenu::Item& avatar_item) {
   DCHECK(avatar_item.signed_in);
   views::View* view = new views::View();
   view->set_background(views::Background::CreateSolidBackground(
       profiles::kAvatarBubbleAccountsBackgroundColor));
-  views::GridLayout* layout = CreateSingleColumnLayout(view, kFixedMenuWidth);
+  views::GridLayout* layout =
+      CreateSingleColumnLayout(view, GetFixedMenuWidth());
 
   Profile* profile = browser_->profile();
   std::string primary_account =
       SigninManagerFactory::GetForProfile(profile)->GetAuthenticatedAccountId();
   DCHECK(!primary_account.empty());
   std::vector<std::string>accounts =
       profiles::GetSecondaryAccountsForProfile(profile, primary_account);
 
   // Get state of authentication error, if any.
   std::string error_account_id = GetAuthErrorAccountId(profile);
 
   // The primary account should always be listed first.
   // TODO(rogerta): we still need to further differentiate the primary account
   // from the others in the UI, so more work is likely required here:
   // crbug.com/311124.
   CreateAccountButton(layout, primary_account, true,
-                      error_account_id == primary_account, kFixedMenuWidth);
+                      error_account_id == primary_account, GetFixedMenuWidth());
   for (size_t i = 0; i < accounts.size(); ++i)
     CreateAccountButton(layout, accounts[i], false,
-                        error_account_id == accounts[i], kFixedMenuWidth);
+                        error_account_id == accounts[i], GetFixedMenuWidth());
 
   if (!profile->IsSupervised()) {
     layout->AddPaddingRow(0, views::kRelatedControlVerticalSpacing);
 
     add_account_link_ = CreateLink(l10n_util::GetStringFUTF16(
         IDS_PROFILES_PROFILE_ADD_ACCOUNT_BUTTON, avatar_item.name), this);
     add_account_link_->SetBorder(views::Border::CreateEmptyBorder(
         0, views::kButtonVEdgeMarginNew,
         views::kRelatedControlVerticalSpacing, 0));
     layout->StartRow(1, 0);
@@ skipping 289 matching lines @@
       IncognitoModePrefs::GetAvailability(browser_->profile()->GetPrefs()) !=
           IncognitoModePrefs::DISABLED;
   return incognito_available && !browser_->profile()->IsGuestSession();
 }
 
 void ProfileChooserView::PostActionPerformed(
     ProfileMetrics::ProfileDesktopMenu action_performed) {
   ProfileMetrics::LogProfileDesktopMenu(action_performed, gaia_service_type_);
   gaia_service_type_ = signin::GAIA_SERVICE_TYPE_NONE;
 }