Material Refresh - Horizontally offset the tab interior path.

Make the separator height 24dip for touchable mode.

Bug: 845161
Change-Id: I61b3653d5f7f6726c1e85d42b90c1d5ed7e360e7
Reviewed-on: https://chromium-review.googlesource.com/1060349
Commit-Queue: Allen Bauer <[email protected]>
Reviewed-by: Bret Sepulveda <[email protected]>
Cr-Commit-Position: refs/heads/master@{#560567}

Author: Allen Bauer

chrome/browser/ui/views/tabs/tab.cc

@@ -75,23 +75,28 @@ using MD = ui::MaterialDesignController;
 
 namespace {
 
-const int kExtraLeftPaddingToBalanceCloseButtonPadding = 2;
+constexpr int kExtraLeftPaddingToBalanceCloseButtonPadding = 2;
 
 // When a non-pinned tab becomes a pinned tab the width of the tab animates. If
 // the width of a pinned tab is at least kPinnedTabExtraWidthToRenderAsNormal
 // larger than the desired pinned tab width then the tab is rendered as a normal
 // tab. This is done to avoid having the title immediately disappear when
 // transitioning a tab from normal to pinned tab.
-const int kPinnedTabExtraWidthToRenderAsNormal = 30;
+constexpr int kPinnedTabExtraWidthToRenderAsNormal = 30;
 
 // How opaque to make the hover state (out of 1).
-const double kHoverOpacity = 0.33;
+constexpr double kHoverOpacity = 0.33;
 
 // Opacity of the active tab background painted over inactive selected tabs.
-const double kSelectedTabOpacity = 0.3;
+constexpr double kSelectedTabOpacity = 0.3;
 
 // Inactive selected tabs have their throb value scaled by this.
-const double kSelectedTabThrobScale = 0.95 - kSelectedTabOpacity;
+constexpr double kSelectedTabThrobScale = 0.95 - kSelectedTabOpacity;
+
+// Height of the separator painted on the left edge of the tab for the material
+// refresh mode.
+constexpr int kTabSeparatorHeight = 20;
+constexpr int kTabSeparatorTouchHeight = 24;
 
 ////////////////////////////////////////////////////////////////////////////////
 // Drawing and utility functions
@@ -148,43 +153,47 @@ gfx::Path GetInteriorPath(float scale,
   gfx::Path left_path;
   if (MD::IsRefreshUi()) {
     const float radius = (endcap_width / 2) * scale;
-
     const float stroke_thickness = TabStrip::ShouldDrawStrokes() ? 1 : 0;
 
     // Bottom right.
-    right_path.moveTo(right, bottom);
+    right_path.moveTo(right - scaled_horizontal_inset, bottom);
+    right_path.rLineTo(0, stroke_thickness);
 
     right_path.arcTo(radius, radius, 0, SkPath::kSmall_ArcSize,
-                     SkPath::kCW_Direction, right - radius, bottom - radius);
+                     SkPath::kCW_Direction,
+                     right - radius - scaled_horizontal_inset, bottom - radius);
 
     // Right vertical.
-    right_path.lineTo(right - radius, radius + stroke_thickness);
+    right_path.lineTo(right - radius - scaled_horizontal_inset,
+                      radius - stroke_thickness);
 
     // Top right.
-    right_path.arcTo(radius, radius, 0, SkPath::kSmall_ArcSize,
-                     SkPath::kCCW_Direction, right - radius * 2,
-                     stroke_thickness);
+    right_path.arcTo(
+        radius, radius, 0, SkPath::kSmall_ArcSize, SkPath::kCCW_Direction,
+        right - radius * 2 - scaled_horizontal_inset, stroke_thickness);
 
     // Top edge.
     right_path.lineTo(0, stroke_thickness);
     right_path.lineTo(0, bottom);
     right_path.close();
 
     // Top left.
-    left_path.moveTo(radius * 2, stroke_thickness);
+    left_path.moveTo(radius * 2 + scaled_horizontal_inset, stroke_thickness);
 
     left_path.arcTo(radius, radius, 0, SkPath::kSmall_ArcSize,
-                    SkPath::kCCW_Direction, radius, radius + stroke_thickness);
+                    SkPath::kCCW_Direction, radius + scaled_horizontal_inset,
+                    radius);
 
     // Left vertical.
-    left_path.lineTo(radius, bottom - radius);
+    left_path.lineTo(radius + scaled_horizontal_inset, bottom - radius);
 
     // Bottom left.
     left_path.arcTo(radius, radius, 0, SkPath::kSmall_ArcSize,
-                    SkPath::kCW_Direction, 0, bottom);
+                    SkPath::kCW_Direction, scaled_horizontal_inset,
+                    bottom + stroke_thickness);
 
     // Bottom edge.
-    left_path.lineTo(right, bottom);
+    left_path.lineTo(right, bottom + stroke_thickness);
     left_path.lineTo(right, stroke_thickness);
     left_path.close();
   } else {
@@ -237,7 +246,7 @@ gfx::Path GetBorderPath(float scale,
   gfx::Path path;
 
   path.moveTo(0, bottom);
-  path.rLineTo(0, -1);
+  path.rLineTo(0, -stroke_thickness);
 
   if (MD::IsRefreshUi()) {
     const float radius = (endcap_width / 2) * scale;
@@ -1205,7 +1214,9 @@ void Tab::PaintSeparator(gfx::Canvas* canvas, SkColor inactive_color) {
 
   const int tab_height = GetContentsBounds().height();
   gfx::RectF separator_bounds;
-  separator_bounds.set_size(gfx::SizeF(1, 20));
+  separator_bounds.set_size(gfx::SizeF(1, MD::IsTouchOptimizedUiEnabled()
+                                              ? kTabSeparatorTouchHeight
+                                              : kTabSeparatorHeight));
   separator_bounds.set_origin(gfx::PointF(
       GetTabEndcapWidth() / 2, (tab_height - separator_bounds.height()) / 2));
   // The following will paint the separator using an opacity that should