Add support for blue buttons.

This also uses the new blue button style for
the app launcher signin button.

Binaries were landed in: https://codereview.chromium.org/15848008/

BUG=159733

Review URL: https://chromiumcodereview.appspot.com/14631022

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@203089 0039d316-1c4b-4281-b951-d872f2087c98

ui/app_list/views/signin_view.cc

@@ -8,7 +8,7 @@
 #include "ui/base/resource/resource_bundle.h"
 #include "ui/gfx/font.h"
 #include "ui/views/background.h"
-#include "ui/views/controls/button/label_button.h"
+#include "ui/views/controls/button/blue_button.h"
 #include "ui/views/controls/label.h"
 #include "ui/views/controls/link.h"
 #include "ui/views/layout/grid_layout.h"
@@ -82,10 +82,10 @@ SigninView::SigninView(SigninDelegate* delegate, int width)
                               kHeadingPadding - title_descender);
   layout->AddView(text);
 
-  views::LabelButton* signin_button = new views::LabelButton(
+  views::BlueButton* signin_button = new views::BlueButton(
       this,
       delegate_->GetSigninButtonText());
-  signin_button->SetStyle(views::Button::STYLE_NATIVE_TEXTBUTTON);
+  signin_button->SetFont(*button_font_);
   layout->StartRowWithPadding(0, kButtonSetId, 0,
                               kButtonPadding - text_descender);
   layout->AddView(signin_button);

ui/resources/ui_resources.grd

@@ -170,6 +170,60 @@
       <structure type="chrome_scaled_image" name="IDR_BUTTON_PRESSED_TOP" file="common/button_pressed_top.png" />
       <structure type="chrome_scaled_image" name="IDR_BUTTON_PRESSED_TOP_LEFT" file="common/button_pressed_top_left.png" />
       <structure type="chrome_scaled_image" name="IDR_BUTTON_PRESSED_TOP_RIGHT" file="common/button_pressed_top_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_BOTTOM" file="common/blue_button_focused_hover_bottom.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_BOTTOM_LEFT" file="common/blue_button_focused_hover_bottom_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_BOTTOM_RIGHT" file="common/blue_button_focused_hover_bottom_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_CENTER" file="common/blue_button_focused_hover_center.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_LEFT" file="common/blue_button_focused_hover_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_RIGHT" file="common/blue_button_focused_hover_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_TOP" file="common/blue_button_focused_hover_top.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_TOP_LEFT" file="common/blue_button_focused_hover_top_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_HOVER_TOP_RIGHT" file="common/blue_button_focused_hover_top_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_BOTTOM" file="common/blue_button_focused_bottom.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_BOTTOM_LEFT" file="common/blue_button_focused_bottom_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_BOTTOM_RIGHT" file="common/blue_button_focused_bottom_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_CENTER" file="common/blue_button_focused_center.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_LEFT" file="common/blue_button_focused_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_RIGHT" file="common/blue_button_focused_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_TOP" file="common/blue_button_focused_top.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_TOP_LEFT" file="common/blue_button_focused_top_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_NORMAL_TOP_RIGHT" file="common/blue_button_focused_top_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_BOTTOM" file="common/blue_button_focused_pressed_bottom.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_BOTTOM_LEFT" file="common/blue_button_focused_pressed_bottom_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_BOTTOM_RIGHT" file="common/blue_button_focused_pressed_bottom_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_CENTER" file="common/blue_button_focused_pressed_center.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_LEFT" file="common/blue_button_focused_pressed_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_RIGHT" file="common/blue_button_focused_pressed_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_TOP" file="common/blue_button_focused_pressed_top.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_TOP_LEFT" file="common/blue_button_focused_pressed_top_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_FOCUSED_PRESSED_TOP_RIGHT" file="common/blue_button_focused_pressed_top_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_BOTTOM" file="common/blue_button_hover_bottom.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_BOTTOM_LEFT" file="common/blue_button_hover_bottom_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_BOTTOM_RIGHT" file="common/blue_button_hover_bottom_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_CENTER" file="common/blue_button_hover_center.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_LEFT" file="common/blue_button_hover_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_RIGHT" file="common/blue_button_hover_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_TOP" file="common/blue_button_hover_top.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_TOP_LEFT" file="common/blue_button_hover_top_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_HOVER_TOP_RIGHT" file="common/blue_button_hover_top_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_BOTTOM" file="common/blue_button_bottom.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_BOTTOM_LEFT" file="common/blue_button_bottom_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_BOTTOM_RIGHT" file="common/blue_button_bottom_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_CENTER" file="common/blue_button_center.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_LEFT" file="common/blue_button_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_RIGHT" file="common/blue_button_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_TOP" file="common/blue_button_top.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_TOP_LEFT" file="common/blue_button_top_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_NORMAL_TOP_RIGHT" file="common/blue_button_top_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_BOTTOM" file="common/blue_button_pressed_bottom.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_BOTTOM_LEFT" file="common/blue_button_pressed_bottom_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_BOTTOM_RIGHT" file="common/blue_button_pressed_bottom_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_CENTER" file="common/blue_button_pressed_center.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_LEFT" file="common/blue_button_pressed_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_RIGHT" file="common/blue_button_pressed_right.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_TOP" file="common/blue_button_pressed_top.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_TOP_LEFT" file="common/blue_button_pressed_top_left.png" />
+      <structure type="chrome_scaled_image" name="IDR_BLUE_BUTTON_PRESSED_TOP_RIGHT" file="common/blue_button_pressed_top_right.png" />
       <structure type="chrome_scaled_image" name="IDR_CHECKBOX" file="common/checkbox.png" />
       <structure type="chrome_scaled_image" name="IDR_CHECKBOX_CHECKED" file="common/checkbox_checked.png" />
       <structure type="chrome_scaled_image" name="IDR_CHECKBOX_CHECKED_DISABLED" file="common/checkbox_checked_inactive.png" />

ui/views/controls/button/blue_button.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 "ui/views/controls/button/blue_button.h"
+
+#include "grit/ui_resources.h"
+#include "ui/base/accessibility/accessible_view_state.h"
+#include "ui/base/resource/resource_bundle.h"
+#include "ui/views/controls/button/label_button_border.h"
+
+namespace {
+
+const int kBlueNormalImages[] = IMAGE_GRID(IDR_BLUE_BUTTON_NORMAL);
+const int kBlueHoveredImages[] = IMAGE_GRID(IDR_BLUE_BUTTON_HOVER);
+const int kBluePressedImages[] = IMAGE_GRID(IDR_BLUE_BUTTON_PRESSED);
+const int kBlueFocusedNormalImages[] = IMAGE_GRID(
+    IDR_BLUE_BUTTON_FOCUSED_NORMAL);
+const int kBlueFocusedHoveredImages[] = IMAGE_GRID(
+    IDR_BLUE_BUTTON_FOCUSED_HOVER);
+const int kBlueFocusedPressedImages[] = IMAGE_GRID(
+    IDR_BLUE_BUTTON_FOCUSED_PRESSED);
+
+// Blue button style default font color.
+const SkColor kBlueButtonTextColor = SK_ColorWHITE;
+
+// Blue button style shadow color.
+const SkColor kBlueButtonShadowColor = SkColorSetRGB(0x53, 0x8C, 0xEA);
+
+}  // namespace
+
+namespace views {
+
+// static
+const char BlueButton::kViewClassName[] = "views/BlueButton";
+
+BlueButton::BlueButton(ButtonListener* listener, const string16& text)
+    : LabelButton(listener, text) {
+  LabelButtonBorder* button_border = static_cast<LabelButtonBorder*>(border());
+
+  button_border->set_insets(gfx::Insets(9, 13, 9, 13));
+
+  button_border->SetPainter(false, STATE_NORMAL,
+      Painter::CreateImageGridPainter(kBlueNormalImages));
+  button_border->SetPainter(false, STATE_HOVERED,
+      Painter::CreateImageGridPainter(kBlueHoveredImages));
+  button_border->SetPainter(false, STATE_PRESSED,
+      Painter::CreateImageGridPainter(kBluePressedImages));
+  button_border->SetPainter(false, STATE_DISABLED,
+      Painter::CreateImageGridPainter(kBlueNormalImages));
+  button_border->SetPainter(true, STATE_NORMAL,
+      Painter::CreateImageGridPainter(kBlueFocusedNormalImages));
+  button_border->SetPainter(true, STATE_HOVERED,
+      Painter::CreateImageGridPainter(kBlueFocusedHoveredImages));
+  button_border->SetPainter(true, STATE_PRESSED,
+      Painter::CreateImageGridPainter(kBlueFocusedPressedImages));
+  button_border->SetPainter(true, STATE_DISABLED,
+      Painter::CreateImageGridPainter(kBlueNormalImages));
+
+  for (size_t state = STATE_NORMAL; state < STATE_COUNT; ++state)
+    SetTextColor(static_cast<ButtonState>(state), kBlueButtonTextColor);
+  label()->SetShadowColors(kBlueButtonShadowColor, kBlueButtonShadowColor);
+  label()->SetShadowOffset(0, 1);
+}
+
+BlueButton::~BlueButton() {}
+
+const char* BlueButton::GetClassName() const {
+  return BlueButton::kViewClassName;
+}
+
+// TODO(msw): Re-enable animations for blue buttons. It's disabled now due
+// to crbug.com/239121.
+const ui::Animation* BlueButton::GetThemeAnimation() const {
+  return NULL;
+}
+
+}  // namespace views

ui/views/controls/button/blue_button.h

+// 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.
+
+#ifndef UI_VIEWS_CONTROLS_BUTTON_BLUE_BUTTON_H_
+#define UI_VIEWS_CONTROLS_BUTTON_BLUE_BUTTON_H_
+
+#include "base/compiler_specific.h"
+#include "base/string16.h"
+#include "ui/views/controls/button/label_button.h"
+
+namespace views {
+
+// A class representing a blue button.
+class VIEWS_EXPORT BlueButton : public LabelButton {
+ public:
+  static const char kViewClassName[];
+
+  BlueButton(ButtonListener* listener, const base::string16& text);
+  virtual ~BlueButton();
+
+ private:
+  // Overridden from LabelButton:
+  virtual const char* GetClassName() const OVERRIDE;
+  virtual const ui::Animation* GetThemeAnimation() const OVERRIDE;
+
+  DISALLOW_COPY_AND_ASSIGN(BlueButton);
+};
+
+}  // namespace views
+
+#endif  // UI_VIEWS_CONTROLS_BUTTON_BLUE_BUTTON_H_

ui/views/controls/button/button.h

@@ -38,7 +38,7 @@ class VIEWS_EXPORT Button : public View {
   };
 
   // Button styles with associated images and border painters.
-  // TODO(msw): Add "Blue Button", Menu, ComboBox, etc.
+  // TODO(msw): Add Menu, ComboBox, etc.
   enum ButtonStyle {
     STYLE_BUTTON = 0,
     STYLE_TEXTBUTTON,

ui/views/views.gyp

@@ -69,6 +69,8 @@
         'color_constants.cc',
         'color_constants.h',
         'context_menu_controller.h',
+        'controls/button/blue_button.cc',
+        'controls/button/blue_button.h',
         'controls/button/button.cc',
         'controls/button/button.h',
         'controls/button/button_dropdown.cc',