[ios] Uses the styler to set ChromeTableVC cell highlight color

Bug: 838823
Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: If039925b436a01310906be0bbf74807f3310b2cc
Reviewed-on: https://chromium-review.googlesource.com/1176862
Commit-Queue: Sergio Collazos <sczs@chromium.org>
Reviewed-by: Rohit Rao <rohitrao@chromium.org>
Cr-Commit-Position: refs/heads/master@{#584790}

ios/chrome/browser/ui/tab_grid/grid/grid_constants.h

@@ -68,6 +68,7 @@ extern const int kGridDarkThemeCellTitleColor;
 extern const int kGridDarkThemeCellHeaderColor;
 extern const int kGridDarkThemeCellSelectionColor;
 extern const int kGridDarkThemeCellCloseButtonTintColor;
+extern const CGFloat kGridDarkThemeCellHighlightColorAlpha;
 
 // GridCell dimensions.
 extern const CGSize kGridCellSizeSmall;

ios/chrome/browser/ui/tab_grid/grid/grid_constants.mm

@@ -62,6 +62,7 @@ const int kGridDarkThemeCellTitleColor = 0xFFFFFF;
 const int kGridDarkThemeCellHeaderColor = 0x5F6368;
 const int kGridDarkThemeCellSelectionColor = 0x9AA0A6;
 const int kGridDarkThemeCellCloseButtonTintColor = 0xFFFFFF;
+const CGFloat kGridDarkThemeCellHighlightColorAlpha = 0.7;
 
 // GridCell dimensions.
 const CGSize kGridCellSizeSmall = CGSize{144.0f, 168.0f};

ios/chrome/browser/ui/tab_grid/tab_grid_view_controller.mm

@@ -627,6 +627,8 @@ NSUInteger GetPageIndexFromPage(TabGridPage page) {
   styler.tableViewBackgroundColor = UIColorFromRGB(kGridBackgroundColor);
   styler.cellTitleColor = UIColorFromRGB(kGridDarkThemeCellTitleColor);
   styler.headerFooterTitleColor = UIColorFromRGB(kGridDarkThemeCellTitleColor);
+  styler.cellHighlightColor =
+      [UIColor colorWithWhite:0 alpha:kGridDarkThemeCellHighlightColorAlpha];
   self.remoteTabsViewController.styler = styler;
 
   UIView* contentView = self.scrollContentView;

ios/chrome/browser/ui/table_view/cells/table_view_cells_constants.h

@@ -22,11 +22,6 @@ extern const CGFloat kTableViewSubViewHorizontalSpacing;
 // Animation duration for highlighting selected section header.
 extern const CGFloat kTableViewCellSelectionAnimationDuration;
 
-// Color and alpha used to highlight a cell with a middle gray color to
-// represent a user tap.
-extern const CGFloat kTableViewHighlightedCellColor;
-extern const CGFloat kTableViewHighlightedCellColorAlpha;
-
 // Setting the font size to 0 for a custom preferred font lets iOS manage
 // sizing.
 extern const CGFloat kUseDefaultFontSize;

ios/chrome/browser/ui/table_view/cells/table_view_cells_constants.mm

@@ -13,8 +13,6 @@ const CGFloat kTableViewHorizontalSpacing = 16.0;
 const CGFloat kTableViewVerticalSpacing = 8.0;
 const CGFloat kTableViewSubViewHorizontalSpacing = 12.0;
 const CGFloat kTableViewCellSelectionAnimationDuration = 0.15;
-const CGFloat kTableViewHighlightedCellColor = 0xA6A6A6;
-const CGFloat kTableViewHighlightedCellColorAlpha = 0.5;
 const CGFloat kUseDefaultFontSize = 0.0;
 const CGFloat kTableViewLabelVerticalTopSpacing = 13.0;
 

ios/chrome/browser/ui/table_view/cells/table_view_disclosure_header_footer_item.h

@@ -34,6 +34,8 @@ typedef NS_ENUM(NSInteger, DisclosureDirection) {
 @property(nonatomic, readwrite, strong) UILabel* subtitleLabel;
 // Determines if disclosureImageView should be pointing down or to the right.
 @property(nonatomic, assign) DisclosureDirection disclosureDirection;
+// Color used on the highlight animation.
+@property(nonatomic, readwrite, strong) UIColor* highlightColor;
 // Animates a change in the backgroundView color and then changes it back to the
 // original backGround color in order to simulate a selection highlight.
 - (void)animateHighlight;

ios/chrome/browser/ui/table_view/cells/table_view_disclosure_header_footer_item.mm

@@ -49,6 +49,8 @@ constexpr float kRotationNinetyCCW = -(90 / 180.0) * M_PI;
   [header setInitialDirection:direction];
   if (styler.headerFooterTitleColor)
     header.titleLabel.textColor = styler.headerFooterTitleColor;
+  if (styler.cellHighlightColor)
+    header.highlightColor = styler.cellHighlightColor;
 }
 
 - (CGFloat)headerHeightForWidth:(CGFloat)width {
@@ -82,6 +84,7 @@ constexpr float kRotationNinetyCCW = -(90 / 180.0) * M_PI;
 @synthesize cellAnimator = _cellAnimator;
 @synthesize disclosureDirection = disclosureDirection;
 @synthesize disclosureImageView = _disclosureImageView;
+@synthesize highlightColor = _highlightColor;
 @synthesize subtitleLabel = _subtitleLabel;
 @synthesize titleLabel = _titleLabel;
 
@@ -208,9 +211,7 @@ constexpr float kRotationNinetyCCW = -(90 / 180.0) * M_PI;
       initWithDuration:kTableViewCellSelectionAnimationDuration
                  curve:UIViewAnimationCurveLinear
             animations:^{
-              self.contentView.backgroundColor =
-                  UIColorFromRGB(kTableViewHighlightedCellColor,
-                                 kTableViewHighlightedCellColorAlpha);
+              self.contentView.backgroundColor = self.highlightColor;
             }];
   __weak TableViewDisclosureHeaderFooterView* weakSelf = self;
   [self.cellAnimator addCompletion:^(UIViewAnimatingPosition finalPosition) {

ios/chrome/browser/ui/table_view/cells/table_view_item.mm

@@ -29,6 +29,16 @@
   if (!cell.backgroundView) {
     cell.backgroundColor = styler.tableViewBackgroundColor;
   }
+  // Since this Cell might get reconfigured while it's being highlighted,
+  // re-setting the selectedBackgroundView will interrupt the higlight
+  // animation. Make sure that if the cell already has the correct
+  // selectedBackgroundView it doesn't get set again.
+  if (styler.cellHighlightColor && ![cell.selectedBackgroundView.backgroundColor
+                                       isEqual:styler.cellHighlightColor]) {
+    UIView* selectedBackgroundView = [[UIView alloc] init];
+    selectedBackgroundView.backgroundColor = styler.cellHighlightColor;
+    cell.selectedBackgroundView = selectedBackgroundView;
+  }
 }
 
 @end

ios/chrome/browser/ui/table_view/cells/table_view_text_header_footer_item.h

@@ -19,6 +19,8 @@
 // UITableViewHeaderFooterView that displays a text label.
 @interface TableViewTextHeaderFooterView : UITableViewHeaderFooterView
 @property(nonatomic, readwrite, strong) UILabel* subtitleLabel;
+// Color used on the highlight animation.
+@property(nonatomic, readwrite, strong) UIColor* highlightColor;
 // Animates a change in the backgroundView color and then changes it back to the
 // original backGround color in order to simulate a selection highlight.
 - (void)animateHighlight;

ios/chrome/browser/ui/table_view/cells/table_view_text_header_footer_item.mm

@@ -6,6 +6,7 @@
 
 #include "base/mac/foundation_util.h"
 #import "ios/chrome/browser/ui/table_view/cells/table_view_cells_constants.h"
+#import "ios/chrome/browser/ui/table_view/chrome_table_view_styler.h"
 #import "ios/chrome/browser/ui/uikit_ui_util.h"
 
 #if !defined(__has_feature) || !__has_feature(objc_arc)
@@ -35,6 +36,8 @@
   header.textLabel.text = self.text;
   header.subtitleLabel.text = self.subtitleText;
   header.accessibilityLabel = self.text;
+  if (styler.cellHighlightColor)
+    header.highlightColor = styler.cellHighlightColor;
 }
 
 @end
@@ -48,6 +51,7 @@
 
 @implementation TableViewTextHeaderFooterView
 @synthesize cellAnimator = _cellAnimator;
+@synthesize highlightColor = _highlightColor;
 @synthesize subtitleLabel = _subtitleLabel;
 @synthesize textLabel = _textLabel;
 
@@ -132,9 +136,7 @@
       initWithDuration:kTableViewCellSelectionAnimationDuration
                  curve:UIViewAnimationCurveLinear
             animations:^{
-              self.contentView.backgroundColor =
-                  UIColorFromRGB(kTableViewHighlightedCellColor,
-                                 kTableViewHighlightedCellColorAlpha);
+              self.contentView.backgroundColor = self.highlightColor;
             }];
   __weak TableViewTextHeaderFooterView* weakSelf = self;
   [self.cellAnimator addCompletion:^(UIViewAnimatingPosition finalPosition) {

ios/chrome/browser/ui/table_view/chrome_table_view_styler.h

@@ -20,6 +20,8 @@
 // Text colors.
 @property(nonatomic, readwrite, strong) UIColor* cellTitleColor;
 @property(nonatomic, readwrite, strong) UIColor* headerFooterTitleColor;
+// Cell highlight color.
+@property(nonatomic, readwrite, strong) UIColor* cellHighlightColor;
 
 @end
 

ios/chrome/browser/ui/table_view/chrome_table_view_styler.mm

@@ -13,6 +13,8 @@
 namespace {
 // The width and height of the favicon ImageView.
 const int kTableViewBackgroundRGBColor = 0xF9F9F9;
+// The default color used to highlight tableview cells.
+const CGFloat kTableViewHighlightColorAlpha = 0.05;
 }
 
 @implementation ChromeTableViewStyler
@@ -21,6 +23,7 @@ const int kTableViewBackgroundRGBColor = 0xF9F9F9;
 @synthesize tableViewBackgroundColor = _tableViewBackgroundColor;
 @synthesize cellTitleColor = _cellTitleColor;
 @synthesize headerFooterTitleColor = _headerFooterTitleColor;
+@synthesize cellHighlightColor = _cellHighlightColor;
 
 - (instancetype)init {
   if ((self = [super init])) {
@@ -28,6 +31,9 @@ const int kTableViewBackgroundRGBColor = 0xF9F9F9;
 
     _tableViewSectionHeaderBlurEffect =
         [UIBlurEffect effectWithStyle:UIBlurEffectStyleExtraLight];
+
+    _cellHighlightColor =
+        [UIColor colorWithWhite:0 alpha:kTableViewHighlightColorAlpha];
   }
   return self;
 }