[iOS][TabStrip] Add a maximum width for group cells

This CL adds a maximum width for group cells in the tab strip, using a
FadeTruncatingLabel to inject a gradient which truncates the title label
correctly depending on the text direction.

Demo:
https://drive.google.com/file/d/1tS_zOeu8eGIfdKVMHItzb6W-ET0jgN8O/view

Bug: 336513492
Change-Id: I12abbe010f2dc2512ad8ec6f855d061dc7455d8e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5490288
Reviewed-by: Ewann Pellé <ewannpv@chromium.org>
Commit-Queue: Quentin Pubert <qpubert@google.com>
Cr-Commit-Position: refs/heads/main@{#1293582}

ios/chrome/browser/ui/tab_switcher/tab_strip/ui/BUILD.gn

@@ -53,6 +53,7 @@ source_set("ui") {
     ":swift_constants_for_objective_c",
     "//base",
     "//ios/chrome/app/strings",
+    "//ios/chrome/browser/shared/ui/elements",
     "//ios/chrome/browser/shared/ui/symbols",
     "//ios/chrome/browser/shared/ui/util",
     "//ios/chrome/browser/shared/ui/util/image",

ios/chrome/browser/ui/tab_switcher/tab_strip/ui/tab_strip_constants.swift

@@ -37,8 +37,10 @@ public struct TabStripConstants {
     public static let titleContainerHorizontalPadding: CGFloat = 10
     public static let titleContainerHorizontalMargin: CGFloat = 4
     public static let fontSize: CGFloat = TabItem.fontSize
+    public static let maxTitleWidth: CGFloat = 150
     public static let minCellWidth =
       titleContainerHorizontalPadding * 2 + titleContainerHorizontalMargin * 2
+    public static let maxCellWidth = maxTitleWidth + minCellWidth
   }
 
   /// New tab button constants.

ios/chrome/browser/ui/tab_switcher/tab_strip/ui/tab_strip_constants_for_objective_c.swift

@@ -26,6 +26,7 @@ import ios_chrome_browser_ui_tab_switcher_tab_strip_ui_swift_constants
   public static let titleContainerHorizontalMargin = TabStripConstants.GroupItem
     .titleContainerHorizontalMargin
   public static let fontSize = TabStripConstants.GroupItem.fontSize
+  public static let maxTitleWidth = TabStripConstants.GroupItem.maxTitleWidth
 }
 
 /// Bridge to access `TabStripConstants.StaticSeparator` from Objective-C code.

ios/chrome/browser/ui/tab_switcher/tab_strip/ui/tab_strip_group_cell.mm

@@ -5,6 +5,7 @@
 #import "ios/chrome/browser/ui/tab_switcher/tab_strip/ui/tab_strip_group_cell.h"
 
 #import "base/task/sequenced_task_runner.h"
+#import "ios/chrome/browser/shared/ui/elements/fade_truncating_label.h"
 #import "ios/chrome/browser/ui/tab_switcher/tab_strip/ui/swift_constants_for_objective_c.h"
 #import "ios/chrome/browser/ui/tab_switcher/tab_strip/ui/tab_strip_group_stroke_view.h"
 #import "ios/chrome/common/ui/colors/semantic_color_names.h"
@@ -20,7 +21,7 @@ constexpr double kCollapseUpdateGroupStrokeDelaySeconds = 0.25;
 }  // namespace
 
 @implementation TabStripGroupCell {
-  UILabel* _titleLabel;
+  FadeTruncatingLabel* _titleLabel;
   UIView* _titleContainer;
   TabStripGroupStrokeView* _groupStrokeView;
   NSLayoutConstraint* _titleContainerHeightConstraint;
@@ -112,14 +113,14 @@ constexpr double kCollapseUpdateGroupStrokeDelaySeconds = 0.25;
 #pragma mark - View creation helpers
 
 // Returns a new title label.
-- (UILabel*)createTitleLabel {
-  UILabel* titleLabel = [[UILabel alloc] init];
+- (FadeTruncatingLabel*)createTitleLabel {
+  FadeTruncatingLabel* titleLabel = [[FadeTruncatingLabel alloc] init];
   titleLabel.translatesAutoresizingMaskIntoConstraints = NO;
   titleLabel.font = [UIFont systemFontOfSize:TabStripTabItemConstants.fontSize
                                       weight:UIFontWeightMedium];
   titleLabel.textColor = [UIColor colorNamed:kSolidWhiteColor];
   [titleLabel
-      setContentCompressionResistancePriority:UILayoutPriorityRequired
+      setContentCompressionResistancePriority:UILayoutPriorityRequired - 1
                                       forAxis:UILayoutConstraintAxisHorizontal];
   return titleLabel;
 }
@@ -152,13 +153,18 @@ constexpr double kCollapseUpdateGroupStrokeDelaySeconds = 0.25;
                      constant:kTitleContainerCenterYOffset]
       .active = YES;
   AddSameCenterConstraints(_titleLabel, _titleContainer);
+  NSLayoutConstraint* titleLabelMaxWidthConstraint = [_titleLabel.widthAnchor
+      constraintLessThanOrEqualToConstant:TabStripGroupItemConstants
+                                              .maxTitleWidth];
+  titleLabelMaxWidthConstraint.priority = UILayoutPriorityRequired;
+  titleLabelMaxWidthConstraint.active = YES;
   _titleContainerHeightConstraint =
       [_titleContainer.heightAnchor constraintEqualToConstant:0];
   _titleContainerHeightConstraint.active = YES;
   NSLayoutConstraint* groupStrokeViewTitleLabelConstraint =
       [_groupStrokeView.widthAnchor
           constraintEqualToAnchor:_titleLabel.widthAnchor];
-  groupStrokeViewTitleLabelConstraint.priority = UILayoutPriorityRequired - 2;
+  groupStrokeViewTitleLabelConstraint.priority = UILayoutPriorityRequired - 3;
   NSLayoutConstraint* groupStrokeViewTitleContainerConstraint =
       [_groupStrokeView.widthAnchor
           constraintLessThanOrEqualToAnchor:_titleContainer.widthAnchor
@@ -167,11 +173,11 @@ constexpr double kCollapseUpdateGroupStrokeDelaySeconds = 0.25;
                                        TabStripGroupItemConstants
                                            .titleContainerHorizontalPadding];
   groupStrokeViewTitleContainerConstraint.priority =
-      UILayoutPriorityRequired - 1;
+      UILayoutPriorityRequired - 2;
   NSLayoutConstraint* groupStrokeViewConstantConstraint =
       [_groupStrokeView.widthAnchor
           constraintGreaterThanOrEqualToConstant:kGroupStrokeViewMinimumWidth];
-  groupStrokeViewConstantConstraint.priority = UILayoutPriorityRequired;
+  groupStrokeViewConstantConstraint.priority = UILayoutPriorityRequired - 1;
   [NSLayoutConstraint activateConstraints:@[
     groupStrokeViewTitleLabelConstraint,
     groupStrokeViewConstantConstraint,

ios/chrome/browser/ui/tab_switcher/tab_strip/ui/tab_strip_layout.swift

@@ -705,6 +705,7 @@ class TabStripLayout: UICollectionViewFlowLayout {
       ]).width ?? 0
     width += 2 * TabStripConstants.GroupItem.titleContainerHorizontalMargin
     width += 2 * TabStripConstants.GroupItem.titleContainerHorizontalPadding
+    width = min(width, TabStripConstants.GroupItem.maxCellWidth)
     return CGSize(width: width, height: TabStripConstants.GroupItem.height)
   }