Update NTP actions icons

The actions icon for the NTP are scaled down. Also, they are now
constructed with tinted assets.

Bug: 868106
Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: Iedb602f3e973a1bf3dfc5caca6e52644500b205c
Reviewed-on: https://chromium-review.googlesource.com/1164960Reviewed-by: Justin Cohen <justincohen@chromium.org>
Commit-Queue: Gauthier Ambard <gambard@chromium.org>
Cr-Commit-Position: refs/heads/master@{#581227}

ios/chrome/browser/ui/content_suggestions/cells/content_suggestions_most_visited_action_cell.mm

@@ -6,6 +6,7 @@
 
 #import "ios/chrome/browser/ui/content_suggestions/cells/content_suggestions_most_visited_constants.h"
 #include "ios/chrome/browser/ui/ui_util.h"
+#import "ios/chrome/browser/ui/uikit_ui_util.h"
 #import "ios/chrome/common/favicon/favicon_view.h"
 #import "ios/chrome/common/ui_util/constraints_ui_util.h"
 #import "ios/third_party/material_components_ios/src/components/Typography/src/MaterialTypography.h"
@@ -19,6 +20,8 @@ namespace {
 const CGFloat kCountWidth = 20;
 const CGFloat kCountBorderWidth = 24;
 
+const int kBackgroundColor = 0xE8F1FC;
+
 }  // namespace
 
 @implementation ContentSuggestionsMostVisitedActionCell : MDCCollectionViewCell
@@ -42,19 +45,33 @@ const CGFloat kCountBorderWidth = 24;
 
     _iconView = [[UIImageView alloc] initWithFrame:self.bounds];
 
+    UIImageView* iconBackground = [[UIImageView alloc] init];
+    iconBackground.image = [[UIImage imageNamed:@"ntp_most_visited_tile"]
+        imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
+    iconBackground.tintColor = UIColorFromRGB(kBackgroundColor);
+
     _titleLabel.translatesAutoresizingMaskIntoConstraints = NO;
     _iconView.translatesAutoresizingMaskIntoConstraints = NO;
+    iconBackground.translatesAutoresizingMaskIntoConstraints = NO;
 
+    [self.contentView addSubview:iconBackground];
     [self.contentView addSubview:_titleLabel];
     [self.contentView addSubview:_iconView];
 
     [NSLayoutConstraint activateConstraints:@[
       [_iconView.widthAnchor constraintEqualToConstant:kIconSize],
+      [iconBackground.widthAnchor
+          constraintEqualToAnchor:_iconView.widthAnchor],
       [_iconView.heightAnchor constraintEqualToAnchor:_iconView.widthAnchor],
+      [iconBackground.heightAnchor
+          constraintEqualToAnchor:iconBackground.widthAnchor],
       [_iconView.centerXAnchor
           constraintEqualToAnchor:_titleLabel.centerXAnchor],
     ]];
 
+    AddSameCenterXConstraint(iconBackground, _iconView);
+    AddSameCenterYConstraint(iconBackground, _iconView);
+
     ApplyVisualConstraintsWithMetrics(
         @[ @"V:|[icon]-(space)-[title]", @"H:|[title]|" ],
         @{@"icon" : _iconView, @"title" : _titleLabel},

ios/chrome/browser/ui/content_suggestions/cells/content_suggestions_most_visited_action_item.mm

@@ -93,16 +93,22 @@
 - (UIImage*)imageForAction:(ContentSuggestionsMostVisitedAction)action {
   switch (action) {
     case ContentSuggestionsMostVisitedActionBookmark:
-      return [UIImage imageNamed:@"ntp_bookmarks_icon"];
+      return [self imageGettingTintedNamed:@"ntp_bookmarks_icon"];
     case ContentSuggestionsMostVisitedActionReadingList:
-      return [UIImage imageNamed:@"ntp_readinglist_icon"];
+      return [self imageGettingTintedNamed:@"ntp_readinglist_icon"];
     case ContentSuggestionsMostVisitedActionRecentTabs:
-      return [UIImage imageNamed:@"ntp_recent_icon"];
+      return [self imageGettingTintedNamed:@"ntp_recent_icon"];
     case ContentSuggestionsMostVisitedActionHistory:
-      return [UIImage imageNamed:@"ntp_history_icon"];
+      return [self imageGettingTintedNamed:@"ntp_history_icon"];
   }
 }
 
+// Returns the image named |imageName| with a rendering mode "AlwaysTemplate".
+- (UIImage*)imageGettingTintedNamed:(NSString*)imageName {
+  return [[UIImage imageNamed:imageName]
+      imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
+}
+
 // Updates self.accessibilityLabel based on the current property values.
 - (void)updateAccessibilityLabel {
   // Resetting self.accessibilityLabel to nil will prompt self.title to be used