dark_mode: Live update colors of system tray menu.

See recorded video at
https://drive.google.com/file/d/1hjHkN_gA7IMTTor6RehgF1mWMWkeLK9T/view?usp=sharing

This cl doesn't include all the elements in system tray menu, more
elements of it will be updated in follow up cls.

Bug: 1131543
Change-Id: I3a395e529764ab4e23a51ea5066e3e105a502552
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2486781Reviewed-by: Ahmed Fakhry <afakhry@chromium.org>
Commit-Queue: Min Chen <minch@chromium.org>
Cr-Commit-Position: refs/heads/master@{#820290}

ash/clipboard/views/clipboard_history_item_view.cc

@@ -114,9 +114,8 @@ ClipboardHistoryItemView::DeleteButton::DeleteButton(
   SetImageVerticalAlignment(views::ImageButton::ALIGN_MIDDLE);
   SetPreferredSize(gfx::Size(kDeleteButtonSizeDip, kDeleteButtonSizeDip));
 
-  AshColorProvider::Get()->DecorateCloseButton(
-      this, AshColorProvider::ButtonType::kCloseButtonWithSmallBase,
-      kDeleteButtonSizeDip, kCloseButtonIcon);
+  AshColorProvider::Get()->DecorateCloseButton(this, kDeleteButtonSizeDip,
+                                               kCloseButtonIcon);
 }
 
 ClipboardHistoryItemView::DeleteButton::~DeleteButton() = default;

ash/style/ash_color_provider.cc

@@ -256,24 +256,23 @@ SkColor AshColorProvider::GetBackgroundColor() const {
 }
 
 void AshColorProvider::DecoratePillButton(views::LabelButton* button,
-                                          ButtonType type,
-                                          const gfx::VectorIcon& icon) {
-  DCHECK_EQ(ButtonType::kPillButtonWithIcon, type);
-  DCHECK(!icon.is_empty());
+                                          const gfx::VectorIcon* icon) {
+  if (icon) {
     SkColor enabled_icon_color =
         GetContentLayerColor(ContentLayerType::kButtonIconColor);
     button->SetImage(views::Button::STATE_NORMAL,
-                   gfx::CreateVectorIcon(icon, enabled_icon_color));
+                     gfx::CreateVectorIcon(*icon, enabled_icon_color));
     button->SetImage(
         views::Button::STATE_DISABLED,
-      gfx::CreateVectorIcon(icon, GetDisabledColor(enabled_icon_color)));
+        gfx::CreateVectorIcon(*icon, GetDisabledColor(enabled_icon_color)));
+    button->SetImageLabelSpacing(kPillButtonImageLabelSpacingDp);
+  }
 
   SkColor enabled_text_color =
       GetContentLayerColor(ContentLayerType::kButtonLabelColor);
   button->SetEnabledTextColors(enabled_text_color);
   button->SetTextColor(views::Button::STATE_DISABLED,
                        GetDisabledColor(enabled_text_color));
-  button->SetImageLabelSpacing(kPillButtonImageLabelSpacingDp);
 
   // TODO(sammiequon): Add a default rounded rect background. It should probably
   // be optional as some buttons still require customization. At that point we
@@ -281,10 +280,8 @@ void AshColorProvider::DecoratePillButton(views::LabelButton* button,
 }
 
 void AshColorProvider::DecorateCloseButton(views::ImageButton* button,
-                                           ButtonType type,
                                            int button_size,
                                            const gfx::VectorIcon& icon) {
-  DCHECK_EQ(ButtonType::kCloseButtonWithSmallBase, type);
   DCHECK(!icon.is_empty());
   SkColor enabled_icon_color =
       GetContentLayerColor(ContentLayerType::kButtonIconColor);
@@ -295,17 +292,21 @@ void AshColorProvider::DecorateCloseButton(views::ImageButton* button,
   // it is a circle.
   SkColor icon_background_color = AshColorProvider::Get()->GetBaseLayerColor(
       AshColorProvider::BaseLayerType::kTransparent80);
-  button->SetBackground(
-      CreateBackgroundFromPainter(views::Painter::CreateSolidRoundRectPainter(
-          icon_background_color, button_size / 2)));
+  button->SetBackground(views::CreateRoundedRectBackground(
+      icon_background_color, button_size / 2));
 
   // TODO(sammiequon): Add background blur as per spec. Background blur is quite
   // heavy, and we may have many close buttons showing at a time. They'll be
   // added separately so its easier to monitor performance.
 }
 
+void AshColorProvider::DecorateFloatingIconButton(views::ImageButton* button,
+                                                  const gfx::VectorIcon& icon) {
+  DecorateIconButton(button, icon, /*toggled=*/false,
+                     GetDefaultSizeOfVectorIcon(icon));
+}
+
 void AshColorProvider::DecorateIconButton(views::ImageButton* button,
-                                          ButtonType type,
                                           const gfx::VectorIcon& icon,
                                           bool toggled,
                                           int icon_size) {
@@ -333,7 +334,7 @@ void AshColorProvider::DecorateIconButton(views::ImageButton* button,
   button->SetImage(views::Button::STATE_NORMAL, new_normal_image);
   button->SetImage(
       views::Button::STATE_DISABLED,
-      gfx::CreateVectorIcon(icon, icon_size, GetDisabledColor(normal_color)));
+      gfx::CreateVectorIcon(icon, icon_size, GetDisabledColor(icon_color)));
 }
 
 void AshColorProvider::AddObserver(ColorModeObserver* observer) {

ash/style/ash_color_provider.h

@@ -122,13 +122,6 @@ class ASH_EXPORT AshColorProvider : public SessionObserver {
     kRadioColorInactive,
   };
 
-  // Types of ash styled buttons.
-  enum class ButtonType {
-    kPillButtonWithIcon,
-    kCloseButtonWithSmallBase,
-    kIconButtonSmallOrMedium,
-  };
-
   // Attributes of ripple, includes the base color, opacity of inkdrop and
   // highlight.
   struct RippleAttributes {
@@ -181,21 +174,20 @@ class ASH_EXPORT AshColorProvider : public SessionObserver {
   // |is_themed_|).
   SkColor GetBackgroundColor() const;
 
-  // Helpers to style buttons based on the desired |type| and theme. Depending
-  // on the type may style text, icon and background colors for both enabled and
-  // disabled states. May overwrite an prior styles on |button|.
+  // Helpers to style different types of buttons. Depending on the type may
+  // style text, icon and background colors for both enabled and disabled
+  // states. May overwrite an prior styles on |button|.
   void DecoratePillButton(views::LabelButton* button,
-                          ButtonType type,
-                          const gfx::VectorIcon& icon);
+                          const gfx::VectorIcon* icon);
   void DecorateCloseButton(views::ImageButton* button,
-                           ButtonType type,
                            int button_size,
                            const gfx::VectorIcon& icon);
   void DecorateIconButton(views::ImageButton* button,
-                          ButtonType type,
                           const gfx::VectorIcon& icon,
                           bool toggled,
                           int icon_size);
+  void DecorateFloatingIconButton(views::ImageButton* button,
+                                  const gfx::VectorIcon& icon);
 
   void AddObserver(ColorModeObserver* observer);
   void RemoveObserver(ColorModeObserver* observer);

ash/system/audio/unified_volume_view.cc

@@ -21,6 +21,7 @@
 #include "ui/views/animation/ink_drop_highlight.h"
 #include "ui/views/animation/ink_drop_impl.h"
 #include "ui/views/animation/ink_drop_mask.h"
+#include "ui/views/background.h"
 #include "ui/views/controls/highlight_path_generator.h"
 #include "ui/views/controls/image_view.h"
 #include "ui/views/layout/box_layout.h"
@@ -53,6 +54,11 @@ const gfx::VectorIcon& GetVolumeIconForLevel(float level) {
   return *kVolumeLevelIcons[index];
 }
 
+SkColor GetBackgroundColorOfMoreButton() {
+  return AshColorProvider::Get()->GetControlsLayerColor(
+      AshColorProvider::ControlsLayerType::kControlBackgroundColorInactive);
+}
+
 class MoreButton : public views::Button {
  public:
   explicit MoreButton(views::ButtonListener* listener)
@@ -64,48 +70,23 @@ class MoreButton : public views::Button {
                     2),
         2));
 
-    auto* color_provider = AshColorProvider::Get();
-    const SkColor icon_color = color_provider->GetContentLayerColor(
-        AshColorProvider::ContentLayerType::kIconColorPrimary);
-
     if (!features::IsSystemTrayMicGainSettingEnabled()) {
-      auto* headset = new views::ImageView();
-      headset->SetCanProcessEventsWithinSubtree(false);
-      headset->SetImage(
-          CreateVectorIcon(vector_icons::kHeadsetIcon, icon_color));
-      AddChildView(headset);
+      headset_image_ = AddChildView(std::make_unique<views::ImageView>());
+      headset_image_->SetCanProcessEventsWithinSubtree(false);
     }
-    auto* more = new views::ImageView();
-    more->SetCanProcessEventsWithinSubtree(false);
-    auto icon_rotation = base::i18n::IsRTL()
-                             ? SkBitmapOperations::ROTATION_270_CW
-                             : SkBitmapOperations::ROTATION_90_CW;
-    more->SetImage(gfx::ImageSkiaOperations::CreateRotatedImage(
-        CreateVectorIcon(kUnifiedMenuExpandIcon, icon_color), icon_rotation));
-    AddChildView(more);
-
+    more_image_ = AddChildView(std::make_unique<views::ImageView>());
+    more_image_->SetCanProcessEventsWithinSubtree(false);
     SetTooltipText(l10n_util::GetStringUTF16(IDS_ASH_STATUS_TRAY_AUDIO));
     TrayPopupUtils::ConfigureTrayPopupButton(this);
 
     views::InstallRoundRectHighlightPathGenerator(this, gfx::Insets(),
                                                   kTrayItemCornerRadius);
-    focus_ring()->SetColor(color_provider->GetControlsLayerColor(
-        AshColorProvider::ControlsLayerType::kFocusRingColor));
+    SetBackground(views::CreateRoundedRectBackground(
+        GetBackgroundColorOfMoreButton(), kTrayItemCornerRadius));
   }
 
   ~MoreButton() override = default;
 
-  // views::Button:
-  void PaintButtonContents(gfx::Canvas* canvas) override {
-    gfx::RectF rect(GetContentsBounds());
-    cc::PaintFlags flags;
-    flags.setAntiAlias(true);
-    flags.setColor(AshColorProvider::Get()->GetControlsLayerColor(
-        AshColorProvider::ControlsLayerType::kControlBackgroundColorInactive));
-    flags.setStyle(cc::PaintFlags::kFill_Style);
-    canvas->DrawRoundRect(rect, kTrayItemCornerRadius, flags);
-  }
-
   std::unique_ptr<views::InkDrop> CreateInkDrop() override {
     return TrayPopupUtils::CreateInkDrop(this);
   }
@@ -123,7 +104,30 @@ class MoreButton : public views::Button {
 
   const char* GetClassName() const override { return "MoreButton"; }
 
+  void OnThemeChanged() override {
+    views::Button::OnThemeChanged();
+    auto* color_provider = AshColorProvider::Get();
+    const SkColor icon_color = color_provider->GetContentLayerColor(
+        AshColorProvider::ContentLayerType::kIconColorPrimary);
+    if (headset_image_) {
+      headset_image_->SetImage(
+          CreateVectorIcon(vector_icons::kHeadsetIcon, icon_color));
+    }
+    DCHECK(more_image_);
+    auto icon_rotation = base::i18n::IsRTL()
+                             ? SkBitmapOperations::ROTATION_270_CW
+                             : SkBitmapOperations::ROTATION_90_CW;
+    more_image_->SetImage(gfx::ImageSkiaOperations::CreateRotatedImage(
+        CreateVectorIcon(kUnifiedMenuExpandIcon, icon_color), icon_rotation));
+    focus_ring()->SetColor(color_provider->GetControlsLayerColor(
+        AshColorProvider::ControlsLayerType::kFocusRingColor));
+    background()->SetNativeControlColor(GetBackgroundColorOfMoreButton());
+  }
+
  private:
+  views::ImageView* headset_image_ = nullptr;
+  views::ImageView* more_image_ = nullptr;
+
   DISALLOW_COPY_AND_ASSIGN(MoreButton);
 };
 

ash/system/unified/collapse_button.cc

@@ -15,13 +15,7 @@
 namespace ash {
 
 CollapseButton::CollapseButton(views::ButtonListener* listener)
-    : CustomShapeButton(listener) {
-  SetImage(views::Button::STATE_NORMAL,
-           gfx::CreateVectorIcon(
-               kUnifiedMenuExpandIcon,
-               AshColorProvider::Get()->GetContentLayerColor(
-                   AshColorProvider::ContentLayerType::kIconColorPrimary)));
-}
+    : CustomShapeButton(listener) {}
 
 CollapseButton::~CollapseButton() = default;
 
@@ -62,4 +56,10 @@ const char* CollapseButton::GetClassName() const {
   return "CollapseButton";
 }
 
+void CollapseButton::OnThemeChanged() {
+  CustomShapeButton::OnThemeChanged();
+  AshColorProvider::Get()->DecorateFloatingIconButton(this,
+                                                      kUnifiedMenuExpandIcon);
+}
+
 }  // namespace ash

ash/system/unified/collapse_button.h

@@ -26,6 +26,7 @@ class CollapseButton : public CustomShapeButton {
   SkPath CreateCustomShapePath(const gfx::Rect& bounds) const override;
   void PaintButtonContents(gfx::Canvas* canvas) override;
   const char* GetClassName() const override;
+  void OnThemeChanged() override;
 
  private:
   double expanded_amount_ = 1.0;

ash/system/unified/feature_pod_button.cc

@@ -28,6 +28,7 @@
 namespace ash {
 
 using ContentLayerType = AshColorProvider::ContentLayerType;
+using ControlsLayerType = AshColorProvider::ControlsLayerType;
 
 namespace {
 
@@ -61,8 +62,6 @@ FeaturePodIconButton::FeaturePodIconButton(views::ButtonListener* listener,
   // Focus ring is around the whole view's bounds, but the ink drop should be
   // the same size as the content.
   TrayPopupUtils::ConfigureTrayPopupButton(this);
-  focus_ring()->SetColor(AshColorProvider::Get()->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kFocusRingColor));
   focus_ring()->SetPathGenerator(
       std::make_unique<views::CircleHighlightPathGenerator>(gfx::Insets()));
   views::InstallCircleHighlightPathGenerator(this,
@@ -91,11 +90,11 @@ void FeaturePodIconButton::PaintButtonContents(gfx::Canvas* canvas) {
 
   const AshColorProvider* color_provider = AshColorProvider::Get();
   SkColor color = color_provider->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kControlBackgroundColorInactive);
+      ControlsLayerType::kControlBackgroundColorInactive);
   if (GetEnabled()) {
     if (toggled_) {
       color = color_provider->GetControlsLayerColor(
-          AshColorProvider::ControlsLayerType::kControlBackgroundColorActive);
+          ControlsLayerType::kControlBackgroundColorActive);
     }
   } else {
     color = AshColorProvider::GetDisabledColor(color);
@@ -140,13 +139,20 @@ const char* FeaturePodIconButton::GetClassName() const {
   return "FeaturePodIconButton";
 }
 
+void FeaturePodIconButton::OnThemeChanged() {
+  views::ImageButton::OnThemeChanged();
+  focus_ring()->SetColor(AshColorProvider::Get()->GetControlsLayerColor(
+      ControlsLayerType::kFocusRingColor));
+  UpdateVectorIcon();
+  SchedulePaint();
+}
+
 void FeaturePodIconButton::UpdateVectorIcon() {
   if (!icon_)
     return;
 
-  AshColorProvider::Get()->DecorateIconButton(
-      this, AshColorProvider::ButtonType::kIconButtonSmallOrMedium, *icon_,
-      toggled_, kUnifiedFeaturePodVectorIconSize);
+  AshColorProvider::Get()->DecorateIconButton(this, *icon_, toggled_,
+                                              kUnifiedFeaturePodVectorIconSize);
 }
 
 FeaturePodLabelButton::FeaturePodLabelButton(views::ButtonListener* listener)
@@ -167,8 +173,6 @@ FeaturePodLabelButton::FeaturePodLabelButton(views::ButtonListener* listener)
   detailed_view_arrow_->SetCanProcessEventsWithinSubtree(false);
   detailed_view_arrow_->SetVisible(false);
 
-  OnEnabledChanged();
-
   AddChildView(label_);
   AddChildView(detailed_view_arrow_);
   AddChildView(sub_label_);
@@ -179,7 +183,7 @@ FeaturePodLabelButton::FeaturePodLabelButton(views::ButtonListener* listener)
   layer()->SetFillsBoundsOpaquely(false);
 
   focus_ring()->SetColor(AshColorProvider::Get()->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kFocusRingColor));
+      ControlsLayerType::kFocusRingColor));
   views::InstallRoundRectHighlightPathGenerator(
       this, gfx::Insets(), kUnifiedFeaturePodHoverCornerRadius);
 }
@@ -256,6 +260,11 @@ const char* FeaturePodLabelButton::GetClassName() const {
   return "FeaturePodLabelButton";
 }
 
+void FeaturePodLabelButton::OnThemeChanged() {
+  views::Button::OnThemeChanged();
+  OnEnabledChanged();
+}
+
 void FeaturePodLabelButton::SetLabel(const base::string16& label) {
   label_->SetText(label);
   InvalidateLayout();

ash/system/unified/feature_pod_button.h

@@ -40,6 +40,7 @@ class FeaturePodIconButton : public views::ImageButton {
       const override;
   void GetAccessibleNodeData(ui::AXNodeData* node_data) override;
   const char* GetClassName() const override;
+  void OnThemeChanged() override;
 
   bool toggled() const { return toggled_; }
 
@@ -86,6 +87,7 @@ class FeaturePodLabelButton : public views::Button {
   std::unique_ptr<views::InkDropHighlight> CreateInkDropHighlight()
       const override;
   const char* GetClassName() const override;
+  void OnThemeChanged() override;
 
  private:
   // Layout |child| in horizontal center with its vertical origin set to |y|.

ash/system/unified/page_indicator_view.cc

@@ -21,7 +21,6 @@
 #include "ui/base/l10n/l10n_util.h"
 #include "ui/gfx/animation/throb_animation.h"
 #include "ui/gfx/canvas.h"
-#include "ui/gfx/color_palette.h"
 #include "ui/gfx/geometry/insets.h"
 #include "ui/gfx/skia_util.h"
 #include "ui/strings/grit/ui_strings.h"
@@ -47,19 +46,11 @@ constexpr int kInkDropRadius = 3 * kUnifiedPageIndicatorButtonRadius;
 class PageIndicatorView::PageIndicatorButton : public views::Button,
                                                public views::ButtonListener {
  public:
-  explicit PageIndicatorButton(UnifiedSystemTrayController* controller,
-                               int page)
+  PageIndicatorButton(UnifiedSystemTrayController* controller, int page)
       : views::Button(this), controller_(controller), page_number_(page) {
     DCHECK_EQ(views::View::FocusBehavior::ACCESSIBLE_ONLY, GetFocusBehavior());
     SetFocusBehavior(views::View::FocusBehavior::ACCESSIBLE_ONLY);
     SetInkDropMode(InkDropMode::ON);
-
-    const AshColorProvider::RippleAttributes ripple_attributes =
-        AshColorProvider::Get()->GetRippleAttributes();
-    ripple_base_color_ = ripple_attributes.base_color;
-    highlight_opacity_ = ripple_attributes.highlight_opacity;
-    inkdrop_opacity_ = ripple_attributes.inkdrop_opacity;
-
     views::InstallFixedSizeCircleHighlightPathGenerator(this, kInkDropRadius);
   }
 
@@ -100,6 +91,16 @@ class PageIndicatorView::PageIndicatorButton : public views::Button,
                        flags);
   }
 
+  // views::Button:
+  void OnThemeChanged() override {
+    views::Button::OnThemeChanged();
+    auto ripple_attributes = AshColorProvider::Get()->GetRippleAttributes();
+    ripple_base_color_ = ripple_attributes.base_color;
+    highlight_opacity_ = ripple_attributes.highlight_opacity;
+    inkdrop_opacity_ = ripple_attributes.inkdrop_opacity;
+    SchedulePaint();
+  }
+
   // views::ButtonListener:
   void ButtonPressed(views::Button* sender, const ui::Event& event) override {
     DCHECK(controller_);

ash/system/unified/rounded_label_button.cc

@@ -10,17 +10,23 @@
 #include "ui/views/animation/ink_drop.h"
 #include "ui/views/animation/ink_drop_highlight.h"
 #include "ui/views/animation/ink_drop_ripple.h"
+#include "ui/views/background.h"
 #include "ui/views/border.h"
 #include "ui/views/controls/highlight_path_generator.h"
 
 namespace ash {
+namespace {
+
+SkColor GetBackgroundColor() {
+  return AshColorProvider::Get()->GetControlsLayerColor(
+      AshColorProvider::ControlsLayerType::kControlBackgroundColorInactive);
+}
+
+}  // namespace
 
 RoundedLabelButton::RoundedLabelButton(views::ButtonListener* listener,
                                        const base::string16& text)
     : views::LabelButton(listener, text) {
-  auto* color_provider = AshColorProvider::Get();
-  SetEnabledTextColors(color_provider->GetContentLayerColor(
-      AshColorProvider::ContentLayerType::kTextColorPrimary));
   SetHorizontalAlignment(gfx::ALIGN_CENTER);
   SetBorder(views::CreateEmptyBorder(gfx::Insets()));
   label()->SetElideBehavior(gfx::NO_ELIDE);
@@ -30,9 +36,17 @@ RoundedLabelButton::RoundedLabelButton(views::ButtonListener* listener,
   TrayPopupUtils::ConfigureTrayPopupButton(this);
   views::InstallRoundRectHighlightPathGenerator(this, gfx::Insets(),
                                                 kTrayItemSize / 2.f);
+  SetBackground(views::CreateRoundedRectBackground(GetBackgroundColor(),
+                                                   kTrayItemCornerRadius));
+}
 
+void RoundedLabelButton::OnThemeChanged() {
+  views::LabelButton::OnThemeChanged();
+  auto* color_provider = AshColorProvider::Get();
+  color_provider->DecoratePillButton(this, /*icon=*/nullptr);
   focus_ring()->SetColor(color_provider->GetControlsLayerColor(
       AshColorProvider::ControlsLayerType::kFocusRingColor));
+  background()->SetNativeControlColor(GetBackgroundColor());
 }
 
 RoundedLabelButton::~RoundedLabelButton() = default;
@@ -46,18 +60,6 @@ int RoundedLabelButton::GetHeightForWidth(int width) const {
   return kTrayItemSize;
 }
 
-void RoundedLabelButton::PaintButtonContents(gfx::Canvas* canvas) {
-  gfx::RectF rect(GetContentsBounds());
-  cc::PaintFlags flags;
-  flags.setAntiAlias(true);
-  flags.setColor(AshColorProvider::Get()->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kControlBackgroundColorInactive));
-  flags.setStyle(cc::PaintFlags::kFill_Style);
-  canvas->DrawRoundRect(rect, kTrayItemCornerRadius, flags);
-
-  views::LabelButton::PaintButtonContents(canvas);
-}
-
 std::unique_ptr<views::InkDrop> RoundedLabelButton::CreateInkDrop() {
   return TrayPopupUtils::CreateInkDrop(this);
 }

ash/system/unified/rounded_label_button.h

@@ -25,12 +25,12 @@ class RoundedLabelButton : public views::LabelButton {
   // views::LabelButton:
   gfx::Size CalculatePreferredSize() const override;
   int GetHeightForWidth(int width) const override;
-  void PaintButtonContents(gfx::Canvas* canvas) override;
   std::unique_ptr<views::InkDrop> CreateInkDrop() override;
   std::unique_ptr<views::InkDropRipple> CreateInkDropRipple() const override;
   std::unique_ptr<views::InkDropHighlight> CreateInkDropHighlight()
       const override;
   const char* GetClassName() const override;
+  void OnThemeChanged() override;
 
  private:
   DISALLOW_COPY_AND_ASSIGN(RoundedLabelButton);

ash/system/unified/top_shortcut_button.cc

@@ -21,26 +21,13 @@ namespace ash {
 TopShortcutButton::TopShortcutButton(views::ButtonListener* listener,
                                      const gfx::VectorIcon& icon,
                                      int accessible_name_id)
-    : views::ImageButton(listener) {
+    : views::ImageButton(listener), icon_(icon) {
   SetImageHorizontalAlignment(ALIGN_CENTER);
   SetImageVerticalAlignment(ALIGN_MIDDLE);
   if (accessible_name_id)
     SetTooltipText(l10n_util::GetStringUTF16(accessible_name_id));
   TrayPopupUtils::ConfigureTrayPopupButton(this);
   views::InstallCircleHighlightPathGenerator(this);
-
-  auto* color_provider = AshColorProvider::Get();
-  const SkColor icon_color = color_provider->GetContentLayerColor(
-      AshColorProvider::ContentLayerType::kIconColorPrimary);
-  SetImage(
-      views::Button::STATE_NORMAL,
-      gfx::CreateVectorIcon(icon, kTrayTopShortcutButtonIconSize, icon_color));
-  SetImage(
-      views::Button::STATE_DISABLED,
-      gfx::CreateVectorIcon(icon, kTrayTopShortcutButtonIconSize,
-                            AshColorProvider::GetDisabledColor(icon_color)));
-  focus_ring()->SetColor(color_provider->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kFocusRingColor));
 }
 
 TopShortcutButton::~TopShortcutButton() = default;
@@ -80,4 +67,15 @@ const char* TopShortcutButton::GetClassName() const {
   return "TopShortcutButton";
 }
 
+void TopShortcutButton::OnThemeChanged() {
+  views::ImageButton::OnThemeChanged();
+  auto* color_provider = AshColorProvider::Get();
+  color_provider->DecorateIconButton(this, icon_,
+                                     /*toggled_=*/false,
+                                     kTrayTopShortcutButtonIconSize);
+  focus_ring()->SetColor(color_provider->GetControlsLayerColor(
+      AshColorProvider::ControlsLayerType::kFocusRingColor));
+  SchedulePaint();
+}
+
 }  // namespace ash

ash/system/unified/top_shortcut_button.h

@@ -30,8 +30,11 @@ class TopShortcutButton : public views::ImageButton {
   std::unique_ptr<views::InkDropHighlight> CreateInkDropHighlight()
       const override;
   const char* GetClassName() const override;
+  void OnThemeChanged() override;
 
  private:
+  const gfx::VectorIcon& icon_;
+
   DISALLOW_COPY_AND_ASSIGN(TopShortcutButton);
 };
 

ash/system/unified/unified_slider_view.cc

@@ -98,8 +98,6 @@ UnifiedSliderButton::UnifiedSliderButton(views::ButtonListener* listener,
   // Focus ring is around the whole view's bounds, but the ink drop should be
   // the same size as the content.
   TrayPopupUtils::ConfigureTrayPopupButton(this);
-  focus_ring()->SetColor(AshColorProvider::Get()->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kFocusRingColor));
   focus_ring()->SetPathGenerator(
       std::make_unique<views::CircleHighlightPathGenerator>(gfx::Insets()));
   views::InstallCircleHighlightPathGenerator(
@@ -108,15 +106,6 @@ UnifiedSliderButton::UnifiedSliderButton(views::ButtonListener* listener,
 
 UnifiedSliderButton::~UnifiedSliderButton() = default;
 
-gfx::Size UnifiedSliderButton::CalculatePreferredSize() const {
-  return gfx::Size(kTrayItemSize + kUnifiedCircularButtonFocusPadding.width(),
-                   kTrayItemSize + kUnifiedCircularButtonFocusPadding.height());
-}
-
-const char* UnifiedSliderButton::GetClassName() const {
-  return "UnifiedSliderButton";
-}
-
 void UnifiedSliderButton::SetVectorIcon(const gfx::VectorIcon& icon) {
   icon_ = &icon;
   UpdateVectorIcon();
@@ -168,13 +157,29 @@ void UnifiedSliderButton::GetAccessibleNodeData(ui::AXNodeData* node_data) {
                                       : ax::mojom::CheckedState::kFalse);
 }
 
+const char* UnifiedSliderButton::GetClassName() const {
+  return "UnifiedSliderButton";
+}
+
+gfx::Size UnifiedSliderButton::CalculatePreferredSize() const {
+  return gfx::Size(kTrayItemSize + kUnifiedCircularButtonFocusPadding.width(),
+                   kTrayItemSize + kUnifiedCircularButtonFocusPadding.height());
+}
+
+void UnifiedSliderButton::OnThemeChanged() {
+  views::ImageButton::OnThemeChanged();
+  UpdateVectorIcon();
+  focus_ring()->SetColor(AshColorProvider::Get()->GetControlsLayerColor(
+      AshColorProvider::ControlsLayerType::kFocusRingColor));
+  SchedulePaint();
+}
+
 void UnifiedSliderButton::UpdateVectorIcon() {
   if (!icon_)
     return;
 
   AshColorProvider::Get()->DecorateIconButton(
-      this, AshColorProvider::ButtonType::kIconButtonSmallOrMedium, *icon_,
-      toggled_, GetDefaultSizeOfVectorIcon(*icon_));
+      this, *icon_, toggled_, GetDefaultSizeOfVectorIcon(*icon_));
 }
 
 UnifiedSliderView::UnifiedSliderView(UnifiedSliderListener* listener,

ash/system/unified/unified_slider_view.h

@@ -37,20 +37,16 @@ class UnifiedSliderButton : public views::ImageButton {
   // Change the toggle state.
   void SetToggled(bool toggled);
 
-  // views::View:
-  gfx::Size CalculatePreferredSize() const override;
-
-  // views::Button:
-  const char* GetClassName() const override;
-
   // views::ImageButton:
   std::unique_ptr<views::InkDrop> CreateInkDrop() override;
   std::unique_ptr<views::InkDropRipple> CreateInkDropRipple() const override;
   std::unique_ptr<views::InkDropHighlight> CreateInkDropHighlight()
       const override;
-
   void PaintButtonContents(gfx::Canvas* canvas) override;
   void GetAccessibleNodeData(ui::AXNodeData* node_data) override;
+  const char* GetClassName() const override;
+  gfx::Size CalculatePreferredSize() const override;
+  void OnThemeChanged() override;
 
  private:
   void UpdateVectorIcon();

ash/system/unified/unified_system_info_view.cc

@@ -67,6 +67,7 @@ class DateView : public views::Button,
 
   // views::Button:
   const char* GetClassName() const override { return "DateView"; }
+  void OnThemeChanged() override;
 
  private:
   void Update();
@@ -90,26 +91,17 @@ class DateView : public views::Button,
 };
 
 DateView::DateView(UnifiedSystemTrayController* controller)
-    : Button(this), controller_(controller), label_(new views::Label) {
+    : Button(this), controller_(controller) {
   SetLayoutManager(std::make_unique<views::FillLayout>());
-  AddChildView(label_);
-
-  auto* color_provider = AshColorProvider::Get();
+  label_ = AddChildView(std::make_unique<views::Label>());
   label_->SetAutoColorReadabilityEnabled(false);
   label_->SetSubpixelRenderingEnabled(false);
-  label_->SetEnabledColor(color_provider->GetContentLayerColor(
-      ContentLayerType::kTextColorPrimary));
   Update();
 
   Shell::Get()->system_tray_model()->clock()->AddObserver(this);
-
   SetEnabled(Shell::Get()->system_tray_model()->clock()->IsSettingsAvailable());
-
   SetInstallFocusRingOnFocus(true);
   SetFocusForPlatform();
-  focus_ring()->SetColor(color_provider->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kFocusRingColor));
-
   SetInkDropMode(views::InkDropHostView::InkDropMode::OFF);
 }
 
@@ -117,6 +109,15 @@ DateView::~DateView() {
   Shell::Get()->system_tray_model()->clock()->RemoveObserver(this);
 }
 
+void DateView::OnThemeChanged() {
+  views::Button::OnThemeChanged();
+  auto* color_provider = AshColorProvider::Get();
+  label_->SetEnabledColor(color_provider->GetContentLayerColor(
+      ContentLayerType::kTextColorPrimary));
+  focus_ring()->SetColor(color_provider->GetControlsLayerColor(
+      AshColorProvider::ControlsLayerType::kFocusRingColor));
+}
+
 void DateView::ButtonPressed(views::Button* sender, const ui::Event& event) {
   controller_->HandleOpenDateTimeSettingsAction();
 }
@@ -158,6 +159,7 @@ class BatteryView : public views::View, public PowerStatus::Observer {
   void ChildPreferredSizeChanged(views::View* child) override;
   void ChildVisibilityChanged(views::View* child) override;
   const char* GetClassName() const override { return "BatteryView"; }
+  void OnThemeChanged() override;
 
   // PowerStatus::Observer:
   void OnPowerStatusChanged() override;
@@ -174,26 +176,16 @@ class BatteryView : public views::View, public PowerStatus::Observer {
   DISALLOW_COPY_AND_ASSIGN(BatteryView);
 };
 
-BatteryView::BatteryView()
-    : percentage_(new views::Label),
-      separator_(new views::Label),
-      status_(new views::Label) {
+BatteryView::BatteryView() {
   PowerStatus::Get()->AddObserver(this);
-
   SetLayoutManager(std::make_unique<views::BoxLayout>(
       views::BoxLayout::Orientation::kHorizontal));
 
+  percentage_ = AddChildView(std::make_unique<views::Label>());
+  separator_ = AddChildView(std::make_unique<views::Label>());
+  status_ = AddChildView(std::make_unique<views::Label>());
   separator_->SetText(
       l10n_util::GetStringUTF16(IDS_ASH_STATUS_TRAY_BATTERY_STATUS_SEPARATOR));
-
-  ConfigureLabel(percentage_);
-  ConfigureLabel(separator_);
-  ConfigureLabel(status_);
-
-  AddChildView(percentage_);
-  AddChildView(separator_);
-  AddChildView(status_);
-
   Update();
 }
 
@@ -214,6 +206,13 @@ void BatteryView::ChildVisibilityChanged(views::View* child) {
   PreferredSizeChanged();
 }
 
+void BatteryView::OnThemeChanged() {
+  views::View::OnThemeChanged();
+  ConfigureLabel(percentage_);
+  ConfigureLabel(separator_);
+  ConfigureLabel(status_);
+}
+
 void BatteryView::OnPowerStatusChanged() {
   Update();
 }
@@ -250,6 +249,7 @@ class ManagedStateView : public views::Button {
 
   // views::Button:
   const char* GetClassName() const override { return "ManagedStateView"; }
+  void OnThemeChanged() override;
 
  protected:
   ManagedStateView(views::ButtonListener* listener,
@@ -257,39 +257,44 @@ class ManagedStateView : public views::Button {
                    const gfx::VectorIcon& icon);
 
  private:
+  views::Label* label_ = nullptr;
+  views::ImageView* image_ = nullptr;
+  const gfx::VectorIcon& icon_;
+
   DISALLOW_COPY_AND_ASSIGN(ManagedStateView);
 };
 
+void ManagedStateView::OnThemeChanged() {
+  views::Button::OnThemeChanged();
+  auto* color_provider = AshColorProvider::Get();
+  label_->SetEnabledColor(color_provider->GetContentLayerColor(
+      ContentLayerType::kTextColorSecondary));
+  image_->SetImage(
+      gfx::CreateVectorIcon(icon_, color_provider->GetContentLayerColor(
+                                       ContentLayerType::kIconColorSecondary)));
+  focus_ring()->SetColor(color_provider->GetControlsLayerColor(
+      AshColorProvider::ControlsLayerType::kFocusRingColor));
+}
+
 ManagedStateView::ManagedStateView(views::ButtonListener* listener,
                                    int label_id,
                                    const gfx::VectorIcon& icon)
-    : Button(listener) {
+    : Button(listener), icon_(icon) {
   SetLayoutManager(std::make_unique<views::BoxLayout>(
       views::BoxLayout::Orientation::kHorizontal, gfx::Insets(),
       kUnifiedSystemInfoSpacing));
 
-  auto* color_provider = AshColorProvider::Get();
-  auto* label = new views::Label;
-  label->SetAutoColorReadabilityEnabled(false);
-  label->SetSubpixelRenderingEnabled(false);
-  label->SetEnabledColor(color_provider->GetContentLayerColor(
-      ContentLayerType::kTextColorSecondary));
-  label->SetText(l10n_util::GetStringUTF16(label_id));
-  AddChildView(label);
+  label_ = AddChildView(std::make_unique<views::Label>());
+  label_->SetAutoColorReadabilityEnabled(false);
+  label_->SetSubpixelRenderingEnabled(false);
+  label_->SetText(l10n_util::GetStringUTF16(label_id));
 
-  auto* image = new views::ImageView;
-  image->SetImage(
-      gfx::CreateVectorIcon(icon, color_provider->GetContentLayerColor(
-                                      ContentLayerType::kIconColorSecondary)));
-  image->SetPreferredSize(
+  image_ = AddChildView(std::make_unique<views::ImageView>());
+  image_->SetPreferredSize(
       gfx::Size(kUnifiedSystemInfoHeight, kUnifiedSystemInfoHeight));
-  AddChildView(image);
 
   SetInstallFocusRingOnFocus(true);
   SetFocusForPlatform();
-  focus_ring()->SetColor(color_provider->GetControlsLayerColor(
-      AshColorProvider::ControlsLayerType::kFocusRingColor));
-
   SetInkDropMode(views::InkDropHostView::InkDropMode::OFF);
 }
 
@@ -410,28 +415,22 @@ UnifiedSystemInfoView::UnifiedSystemInfoView(
   layout->set_cross_axis_alignment(
       views::BoxLayout::CrossAxisAlignment::kCenter);
 
-  AddChildView(new DateView(controller));
+  AddChildView(std::make_unique<DateView>(controller));
 
   if (PowerStatus::Get()->IsBatteryPresent()) {
-    auto* separator = new views::Separator();
-    separator->SetColor(AshColorProvider::Get()->GetContentLayerColor(
-        ContentLayerType::kSeparatorColor));
-    separator->SetPreferredHeight(kUnifiedSystemInfoHeight);
-    AddChildView(separator);
-
-    AddChildView(new BatteryView());
+    separator_ = AddChildView(std::make_unique<views::Separator>());
+    separator_->SetPreferredHeight(kUnifiedSystemInfoHeight);
+    AddChildView(std::make_unique<BatteryView>());
   }
 
-  auto* spacing = new views::View;
-  AddChildView(spacing);
+  auto* spacing = AddChildView(std::make_unique<views::View>());
   layout->SetFlexForView(spacing, 1);
 
   if (!features::IsManagedDeviceUIRedesignEnabled()) {
     // UnifiedManagedDeviceView is shown instead.
-    enterprise_managed_ = new EnterpriseManagedView(controller);
-    supervised_ = new SupervisedUserView();
-    AddChildView(enterprise_managed_);
-    AddChildView(supervised_);
+    enterprise_managed_ =
+        AddChildView(std::make_unique<EnterpriseManagedView>(controller));
+    supervised_ = AddChildView(std::make_unique<SupervisedUserView>());
   }
 }
 
@@ -449,4 +448,12 @@ const char* UnifiedSystemInfoView::GetClassName() const {
   return "UnifiedSystemInfoView";
 }
 
+void UnifiedSystemInfoView::OnThemeChanged() {
+  views::View::OnThemeChanged();
+  if (separator_) {
+    separator_->SetColor(AshColorProvider::Get()->GetContentLayerColor(
+        ContentLayerType::kSeparatorColor));
+  }
+}
+
 }  // namespace ash

ash/system/unified/unified_system_info_view.h

@@ -9,6 +9,10 @@
 #include "ash/system/unified/unified_system_tray_controller.h"
 #include "ui/views/view.h"
 
+namespace views {
+class Separator;
+}  // namespace views
+
 namespace ash {
 
 // A view at the bottom of UnifiedSystemTray bubble that shows system
@@ -23,6 +27,7 @@ class ASH_EXPORT UnifiedSystemInfoView : public views::View {
   void ChildPreferredSizeChanged(views::View* child) override;
   void ChildVisibilityChanged(views::View* child) override;
   const char* GetClassName() const override;
+  void OnThemeChanged() override;
 
  private:
   FRIEND_TEST_ALL_PREFIXES(UnifiedSystemInfoViewTest, EnterpriseManagedVisible);
@@ -38,6 +43,8 @@ class ASH_EXPORT UnifiedSystemInfoView : public views::View {
   // kManagedDeviceUIRedesign is enabled.
   views::View* supervised_ = nullptr;
 
+  views::Separator* separator_ = nullptr;
+
   DISALLOW_COPY_AND_ASSIGN(UnifiedSystemInfoView);
 };
 

ash/wm/desks/close_desk_button.cc

@@ -64,9 +64,7 @@ SkColor CloseDeskButton::GetInkDropBaseColor() const {
 void CloseDeskButton::OnThemeChanged() {
   views::ImageButton::OnThemeChanged();
   AshColorProvider* color_provider = AshColorProvider::Get();
-  color_provider->DecorateCloseButton(
-      this, AshColorProvider::ButtonType::kCloseButtonWithSmallBase,
-      kCloseButtonSize, kCloseButtonIcon);
+  color_provider->DecorateCloseButton(this, kCloseButtonSize, kCloseButtonIcon);
 
   auto ripple_attributes =
       color_provider->GetRippleAttributes(background()->get_color());

ash/wm/desks/desk_name_view.cc

@@ -54,6 +54,8 @@ DeskNameView::DeskNameView() {
 
   SetCursorEnabled(true);
   SetHorizontalAlignment(gfx::HorizontalAlignment::ALIGN_CENTER);
+  SetBackground(views::CreateRoundedRectBackground(GetBackgroundColor(),
+                                                   kDeskNameViewBorderRadius));
 }
 
 DeskNameView::~DeskNameView() = default;
@@ -127,10 +129,6 @@ void DeskNameView::OnMouseExited(const ui::MouseEvent& event) {
 
 void DeskNameView::OnThemeChanged() {
   Textfield::OnThemeChanged();
-
-  SetBackground(views::CreateRoundedRectBackground(GetBackgroundColor(),
-                                                   kDeskNameViewBorderRadius));
-
   AshColorProvider* color_provider = AshColorProvider::Get();
   const SkColor text_color = color_provider->GetContentLayerColor(
       AshColorProvider::ContentLayerType::kTextColorPrimary);

ash/wm/desks/new_desk_button.cc

@@ -167,9 +167,7 @@ std::unique_ptr<views::LabelButtonBorder> NewDeskButton::CreateDefaultBorder()
 
 void NewDeskButton::OnThemeChanged() {
   LabelButton::OnThemeChanged();
-  AshColorProvider::Get()->DecoratePillButton(
-      this, AshColorProvider::ButtonType::kPillButtonWithIcon,
-      kDesksNewDeskButtonIcon);
+  AshColorProvider::Get()->DecoratePillButton(this, &kDesksNewDeskButtonIcon);
   UpdateButtonState();
 }