[Mac, Win] New avatar bubble should be a fixed width.

chrome/browser/ui/views/profile_chooser_view.cc

 // Copyright 2013 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/profile_chooser_view.h"
 
 #include "base/strings/utf_string_conversions.h"
 #include "chrome/browser/browser_process.h"
 #include "chrome/browser/profiles/profile_info_util.h"
 #include "chrome/browser/profiles/profile_manager.h"
@@ skipping 31 matching lines @@
 #include "ui/views/widget/widget.h"
 
 #if defined(USE_AURA)
 #include "ui/native_theme/native_theme_aura.h"
 #endif
 
 namespace {
 
 // Helpers --------------------------------------------------------------------
 
-const int kMinMenuWidth = 250;
+const int kFixedMenuWidth = 250;
 const int kButtonHeight = 29;
+const int kLargeImageSide = 64;
 
 // 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) {
   views::GridLayout* layout = new views::GridLayout(view);
   view->SetLayoutManager(layout);
 
   views::ColumnSet* columns = layout->AddColumnSet(0);
   columns->AddColumn(views::GridLayout::FILL, views::GridLayout::FILL, 1,
-                     views::GridLayout::USE_PREF, 0, 0);
+                     views::GridLayout::FIXED, kFixedMenuWidth, 0);
   return layout;
 }
 
 // Creates a GridLayout with two columns.
 views::GridLayout* CreateDoubleColumnLayout(views::View* view) {
   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::USE_PREF, 0, 0);
   columns->AddPaddingColumn(0, views::kUnrelatedControlLargeHorizontalSpacing);
-  columns->AddColumn(views::GridLayout::FILL, views::GridLayout::FILL, 0,
+  columns->AddColumn(views::GridLayout::FILL, views::GridLayout::FILL, 1,
                      views::GridLayout::USE_PREF, 0, 0);
   return layout;
 }
 
 views::Link* CreateLink(const base::string16& link_text,
                         views::LinkListener* listener) {
   views::Link* link_button = new views::Link(link_text);
   link_button->SetHorizontalAlignment(gfx::ALIGN_LEFT);
   link_button->SetUnderline(false);
   link_button->set_listener(listener);
   return link_button;
 }
 
+base::string16 ElideText(const base::string16& text,
+                         float width,
+                         ui::ResourceBundle::FontStyle font_style) {
+  return gfx::ElideText(
+      text,
+      ui::ResourceBundle::GetSharedInstance().GetFontList(font_style),
+      width,
+      gfx::ELIDE_AT_END);
+}
+
 
 // BackgroundColorHoverButton -------------------------------------------------
 
 // A custom button that allows for setting a background color when hovered over.
 class BackgroundColorHoverButton : public views::TextButton {
  public:
   BackgroundColorHoverButton(views::ButtonListener* listener,
                              const base::string16& text,
                              const gfx::ImageSkia& normal_icon,
                              const gfx::ImageSkia& hover_icon);
@@ skipping 59 matching lines @@
 // EditableProfilePhoto -------------------------------------------------
 
 // A custom Image control that shows a "change" button when moused over.
 class EditableProfilePhoto : public views::ImageView {
  public:
   EditableProfilePhoto(views::ButtonListener* listener,
                        const gfx::Image& icon,
                        bool is_editing_allowed)
       : views::ImageView(),
         change_photo_button_(NULL) {
-    const int kLargeImageSide = 64;
     const SkColor kBackgroundColor = SkColorSetARGB(125, 0, 0, 0);
     const int kOverlayHeight = 20;
 
     gfx::Image image = profiles::GetSizedAvatarIconWithBorder(
         icon, true,
         kLargeImageSide + profiles::kAvatarIconPadding,
         kLargeImageSide + profiles::kAvatarIconPadding);
     SetImage(image.ToImageSkia());
 
     if (!is_editing_allowed)
@@ skipping 47 matching lines @@
 
 // EditableProfileName -------------------------------------------------
 
 // A custom text control that turns into a textfield for editing when clicked.
 class EditableProfileName : public views::TextButton,
                             public views::ButtonListener {
  public:
   EditableProfileName(views::TextfieldController* controller,
                       const base::string16& text,
                       bool is_editing_allowed)
-      : views::TextButton(this, text),
+      : views::TextButton(this, base::string16()),
+        full_profile_name_(text),
         profile_name_textfield_(NULL) {
+
+    // The button has a fixed width, so we need to calculate the exact width
+    // available for the profile name column, so that the text can be
+    // elided correctly if needed.
+    float available_button_width =
+        kFixedMenuWidth -                   // Entire width of the bubble.
+        2 * views::kButtonHEdgeMarginNew -  // Bubble insets.
+        kLargeImageSide -                   // Width of the profile photo.
+        views::kUnrelatedControlLargeHorizontalSpacing;
+
     ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
+    const gfx::ImageSkia& icon = *rb->GetImageSkiaNamed(IDR_INFOBAR_AUTOFILL);
+    float icon_width = is_editing_allowed? icon.width() : 0;
+    base::string16 elided_name = ElideText(text,

[sky, 2014/01/23 01:00:52]

You shouldn't need to elide the text yourself. You should set the bounds to the
right size and it'll elide appropriately. If that isn't happening, then I
suspect you're not configuring the layoutmanagers correctly.

+                                           available_button_width - icon_width,
+                                           ui::ResourceBundle::MediumFont);
     const gfx::FontList& medium_font_list =
         rb->GetFontList(ui::ResourceBundle::MediumFont);
     SetFontList(medium_font_list);
+    SetText(elided_name);
     set_border(NULL);
 
     if (!is_editing_allowed)
       return;
 
     SetIcon(*rb->GetImageSkiaNamed(IDR_INFOBAR_AUTOFILL));
     set_icon_placement(views::TextButton::ICON_ON_RIGHT);
 
     // Textfield that overlaps the button.
     profile_name_textfield_ = new views::Textfield();
@@ skipping 13 matching lines @@
     if (profile_name_textfield_)
       profile_name_textfield_->SetVisible(false);
   }
 
  private:
   // views::ButtonListener:
   virtual void ButtonPressed(views::Button* sender,
                             const ui::Event& event) OVERRIDE {
     if (profile_name_textfield_) {
       profile_name_textfield_->SetVisible(true);
-      profile_name_textfield_->SetText(text());
+      profile_name_textfield_->SetText(full_profile_name_);
       profile_name_textfield_->SelectAll(false);
       profile_name_textfield_->RequestFocus();
     }
   }
 
   // views::CustomButton:
   virtual bool OnKeyReleased(const ui::KeyEvent& event) OVERRIDE {
     // Override CustomButton's implementation, which presses the button when
     // you press space and clicks it when you release space, as the space can be
     // part of the new profile name typed in the textfield.
     return false;
   }
 
   // views::View:
   virtual void Layout() OVERRIDE {
     if (profile_name_textfield_)
       profile_name_textfield_->SetBounds(0, 0, width(), height());
     views::View::Layout();
   }
 
+  // The complete profile name. Because the control has a fixed width, we will
+  // have to elide the profile name when displaying it. However, in edit mode,
+  // we should show the entire name.
+  base::string16 full_profile_name_;
+
   // Button that is shown when hovering over the image view. Can be NULL if
   // the profile name isn't allowed to be edited (e.g. for guest profiles).
   views::Textfield* profile_name_textfield_;
 
   DISALLOW_COPY_AND_ASSIGN(EditableProfileName);
 };
 
 
 // ProfileChooserView ---------------------------------------------------------
 
@@ skipping 116 matching lines @@
     const AvatarMenu::Item& active_item = avatar_menu->GetItemAt(
         avatar_menu->GetActiveProfileIndex());
     DCHECK(active_item.signed_in);
   }
 
   ResetView();
   RemoveAllChildViews(true);
   view_mode_ = view_to_display;
 
   views::GridLayout* layout = CreateSingleColumnLayout(this);
-  layout->set_minimum_size(gfx::Size(kMinMenuWidth, 0));
+  layout->set_minimum_size(gfx::Size(kFixedMenuWidth, 0));
 
   if (view_to_display == GAIA_SIGNIN_VIEW ||
       view_to_display == GAIA_ADD_ACCOUNT_VIEW) {
     // Minimum size for embedded sign in pages as defined in Gaia.
     const int kMinGaiaViewWidth = 320;
     const int kMinGaiaViewHeight = 440;
     Profile* profile = browser_->profile();
     views::WebView* web_view = new views::WebView(profile);
     signin::Source source = (view_to_display == GAIA_SIGNIN_VIEW) ?
         signin::SOURCE_AVATAR_BUBBLE_SIGN_IN :
@@ skipping 263 matching lines @@
   for (int i = 0; i < num_avatars_to_show; ++i) {
     const size_t index = avatars_to_show[i];
     const AvatarMenu::Item& item = avatar_menu_->GetItemAt(index);
     const int kSmallImageSide = 32;
 
     gfx::Image image = profiles::GetSizedAvatarIconWithBorder(
         item.icon, true,
         kSmallImageSide + profiles::kAvatarIconPadding,
         kSmallImageSide + profiles::kAvatarIconPadding);
 
-    views::TextButton* button = new views::TextButton(this, item.name);
+    // Since the bubble has a fixed width, we need to calculate the exact
+    // width available for the profile name, and elide it if needed.
+    float available_text_width =
+        kFixedMenuWidth -                   // Entire width of the bubble.
+        2 * views::kButtonHEdgeMarginNew -  // Insets.
+        kSmallImageSide -                   // Width of the button icon.
+        views::kItemLabelSpacing;           // Space between text and icon.
+    views::TextButton* button = new views::TextButton(
+        this,
+        ElideText(item.name,
+                  available_text_width,
+                  ui::ResourceBundle::MediumFont));
     open_other_profile_indexes_map_[button] = index;
     button->SetIcon(*image.ToImageSkia());
     button->set_icon_text_spacing(views::kItemLabelSpacing);
     button->SetFontList(ui::ResourceBundle::GetSharedInstance().GetFontList(
         ui::ResourceBundle::MediumFont));
     button->set_border(NULL);
 
     layout->StartRow(1, 0);
     layout->AddView(button);
 
@@ skipping 71 matching lines @@
   // 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);
   for (size_t i = 0; i < accounts.size(); ++i)
     CreateAccountButton(layout, accounts[i], false);
 
   layout->AddPaddingRow(0, views::kRelatedControlVerticalSpacing);
 
-  add_account_button_ = new views::BlueButton(
-      this,
-      l10n_util::GetStringFUTF16(IDS_PROFILES_PROFILE_ADD_ACCOUNT_BUTTON,
-                                 avatar_item.name));
+  // Elide the button text so that the contents fit inside the bubble.
+  base::string16 elided_button_text =
+      ElideText(l10n_util::GetStringFUTF16(
+          IDS_PROFILES_PROFILE_ADD_ACCOUNT_BUTTON, avatar_item.name),
+      kFixedMenuWidth - 2 * views::kButtonHEdgeMarginNew,  // Width - insets.
+      ui::ResourceBundle::MediumFont);
+
+  add_account_button_ = new views::BlueButton(this, elided_button_text);
   layout->StartRow(1, 0);
   layout->AddView(add_account_button_);
   return view;
 }
 
 void ProfileChooserView::CreateAccountButton(views::GridLayout* layout,
                                              const std::string& account,
                                              bool is_primary_account) {
   ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
   // Use a MenuButtonListener and not a regular ButtonListener to be
@@ skipping 11 matching lines @@
     email_button->set_menu_marker(
         rb->GetImageNamed(IDR_CLOSE_1).ToImageSkia());
     layout->AddPaddingRow(0, views::kRelatedControlVerticalSpacing);
   }
   layout->StartRow(1, 0);
   layout->AddView(email_button);
 
   // Save the original email address, as the button text could be elided.
   current_profile_accounts_map_[email_button] = account;
 }