Handle touch events in the status tray network info button

views::Views do not handle touch events, so we need to place the
InfoIcon button in front and cross fade the icon button and
throbber.

BUG=558777

Review URL: https://codereview.chromium.org/1585333002

Cr-Commit-Position: refs/heads/master@{#370872}

2 files changed, 59 insertions, 28 deletions

diff --git a/ash/system/chromeos/network/network_state_list_detailed_view.cc b/ash/system/chromeos/network/network_state_list_detailed_view.cc
index ea37786..ff68bac 100644
--- a/ash/system/chromeos/network/network_state_list_detailed_view.cc
+++ b/ash/system/chromeos/network/network_state_list_detailed_view.cc
@@ -6,6 +6,7 @@
 
 #include <vector>
 
+#include "ash/ash_constants.h"
 #include "ash/ash_switches.h"
 #include "ash/metrics/user_metrics_recorder.h"
 #include "ash/networking_config_delegate.h"
@@ -58,6 +59,7 @@
 #include "ui/views/layout/box_layout.h"
 #include "ui/views/layout/fill_layout.h"
 #include "ui/views/layout/layout_manager.h"
+#include "ui/views/painter.h"
 #include "ui/views/widget/widget.h"
 
 using chromeos::DeviceState;
@@ -145,45 +147,60 @@ class NetworkStateListDetailedView::InfoBubble
 
 //------------------------------------------------------------------------------
 
-// A throbber button that can also be clicked on.
-class ThrobberButton : public ThrobberView {
+const int kFadeIconMs = 500;
+
+// A throbber view that fades in/out when shown/hidden.
+class ScanningThrobber : public ThrobberView {
  public:
-  explicit ThrobberButton(NetworkStateListDetailedView* owner)
-      : owner_(owner) {}
-  ~ThrobberButton() override {}
+  ScanningThrobber() {
+    SetPaintToLayer(true);
+    layer()->SetFillsBoundsOpaquely(false);
+    layer()->SetOpacity(1.0);
+  }
+  ~ScanningThrobber() override {}
 
   // views::View
-  bool OnMousePressed(const ui::MouseEvent& event) override {
-    return owner_->ThrobberPressed(this, event);
+  void SetVisible(bool visible) override {
+    layer()->GetAnimator()->StopAnimating();  // Stop any previous animation.
+    ui::ScopedLayerAnimationSettings animation(layer()->GetAnimator());
+    animation.SetTransitionDuration(
+        base::TimeDelta::FromMilliseconds(kFadeIconMs));
+    layer()->SetOpacity(visible ? 1.0 : 0.0);
   }
 
  private:
-  NetworkStateListDetailedView* owner_;
-
-  DISALLOW_COPY_AND_ASSIGN(ThrobberButton);
+  DISALLOW_COPY_AND_ASSIGN(ScanningThrobber);
 };
 
 //------------------------------------------------------------------------------
 
-const int kFadeIconMs = 500;
-
-// A TrayPopupHeaderButton that fades in/out when shown/hidden.
-class InfoIcon : public TrayPopupHeaderButton {
+// An image button showing the info icon similar to TrayPopupHeaderButton,
+// but without the toggle properties, that fades in/out when shown/hidden.
+class InfoIcon : public views::ImageButton {
  public:
   explicit InfoIcon(views::ButtonListener* listener)
-      : TrayPopupHeaderButton(listener,
-                              IDR_AURA_UBER_TRAY_NETWORK_INFO,
-                              IDR_AURA_UBER_TRAY_NETWORK_INFO,
-                              IDR_AURA_UBER_TRAY_NETWORK_INFO_HOVER,
-                              IDR_AURA_UBER_TRAY_NETWORK_INFO_HOVER,
-                              IDS_ASH_STATUS_TRAY_NETWORK_INFO) {
+      : views::ImageButton(listener) {
+    ui::ResourceBundle& bundle = ui::ResourceBundle::GetSharedInstance();
+    SetImage(STATE_NORMAL, bundle.GetImageNamed(IDR_AURA_UBER_TRAY_NETWORK_INFO)
+                               .ToImageSkia());
+    SetImage(STATE_HOVERED,
+             bundle.GetImageNamed(IDR_AURA_UBER_TRAY_NETWORK_INFO_HOVER)
+                 .ToImageSkia());
+    SetImageAlignment(ALIGN_CENTER, ALIGN_MIDDLE);
+    SetAccessibleName(
+        bundle.GetLocalizedString(IDS_ASH_STATUS_TRAY_NETWORK_INFO));
     SetPaintToLayer(true);
     layer()->SetFillsBoundsOpaquely(false);
     layer()->SetOpacity(1.0);
   }
+
   ~InfoIcon() override {}
 
   // views::View
+  gfx::Size GetPreferredSize() const override {
+    return gfx::Size(ash::kTrayPopupItemHeight, ash::kTrayPopupItemHeight);
+  }
+
   void SetVisible(bool visible) override {
     layer()->GetAnimator()->StopAnimating();  // Stop any previous animation.
     ui::ScopedLayerAnimationSettings animation(layer()->GetAnimator());
@@ -192,6 +209,17 @@ class InfoIcon : public TrayPopupHeaderButton {
     layer()->SetOpacity(visible ? 1.0 : 0.0);
   }
 
+  // views::CustomButton
+  void StateChanged() override {
+    if (state() == STATE_HOVERED || state() == STATE_PRESSED) {
+      set_background(views::Background::CreateSolidBackground(
+          kTrayPopupHoverBackgroundColor));
+    } else {
+      set_background(nullptr);
+    }
+    SchedulePaint();
+  }
+
  private:
   DISALLOW_COPY_AND_ASSIGN(InfoIcon);
 };
@@ -451,15 +479,15 @@ void NetworkStateListDetailedView::CreateHeaderEntry() {
   info_throbber_container->SetLayoutManager(info_throbber_layout);
   footer()->AddView(info_throbber_container, true /* add_separator */);
 
-  info_icon_ = new InfoIcon(this);
-  info_throbber_container->AddChildView(info_icon_);
+  // Place the throbber behind the info icon so that the icon receives
+  // click / touch events. The info icon is hidden when the throbber is active.
+  scanning_throbber_ = new ScanningThrobber();
+  info_throbber_container->AddChildView(scanning_throbber_);
 
-  scanning_throbber_ = new ThrobberButton(this);
-  // Since the throbber is added last, it will be "on top" of the info button,
-  // so it gets the info tooltip.
-  scanning_throbber_->SetTooltipText(
+  info_icon_ = new InfoIcon(this);
+  info_icon_->SetTooltipText(
       l10n_util::GetStringUTF16(IDS_ASH_STATUS_TRAY_NETWORK_INFO));
-  info_throbber_container->AddChildView(scanning_throbber_);
+  info_throbber_container->AddChildView(info_icon_);
 }
 
 void NetworkStateListDetailedView::CreateNetworkExtra() {
@@ -534,11 +562,13 @@ void NetworkStateListDetailedView::UpdateHeaderButtons() {
     wifi_scanning_ = scanning;
     if (scanning) {
       info_icon_->SetVisible(false);
+      scanning_throbber_->SetVisible(true);
       scanning_throbber_->Start();
       scanning_throbber_->SetTooltipText(
           l10n_util::GetStringUTF16(IDS_ASH_STATUS_TRAY_WIFI_SCANNING_MESSAGE));
     } else {
       scanning_throbber_->Stop();
+      scanning_throbber_->SetVisible(false);
       scanning_throbber_->SetTooltipText(
           l10n_util::GetStringUTF16(IDS_ASH_STATUS_TRAY_NETWORK_INFO));
       info_icon_->SetVisible(true);
diff --git a/ash/system/chromeos/network/network_state_list_detailed_view.h b/ash/system/chromeos/network/network_state_list_detailed_view.h
index e637974..9a2b193 100644
--- a/ash/system/chromeos/network/network_state_list_detailed_view.h
+++ b/ash/system/chromeos/network/network_state_list_detailed_view.h
@@ -27,6 +27,7 @@ class NetworkListViewBase;
 
 namespace views {
 class BubbleDelegateView;
+class ImageButton;
 }
 
 namespace ash {
@@ -125,7 +126,7 @@ class NetworkStateListDetailedView
   bool wifi_scanning_;
 
   // Child views.
-  TrayPopupHeaderButton* info_icon_;
+  views::ImageButton* info_icon_;
   TrayPopupHeaderButton* button_wifi_;
   TrayPopupHeaderButton* button_mobile_;
   TrayPopupLabelButton* other_wifi_;