feat: Gapless underline text

Author: elliscwc

Libraries/Text/RCTTextAttributes.m

@@ -165,11 +165,11 @@ - (NSParagraphStyle *)effectiveParagraphStyle
     attributes[NSUnderlineColorAttributeName] = _textDecorationColor ?: effectiveForegroundColor;
   }
 
-  // @Taskadev1 Turn background color into underline highlight
+  // @Taskadev1 Turn background highlight into underline highlight
   if (_backgroundColor || !isnan(_opacity)) {
     isTextDecorationEnabled = YES;
     attributes[NSUnderlineColorAttributeName] = self.effectiveBackgroundColor;
-    attributes[NSUnderlineStyleAttributeName] = @(NSUnderlineStyleThick + NSUnderlineStyleThick);
+    attributes[NSUnderlineStyleAttributeName] = @(NSUnderlineStyleThick + NSUnderlineStyleSingle);
   }
 
   // Shadow

Libraries/Text/Text/RCTTextShadowView.m

@@ -15,6 +15,50 @@
 #import "NSTextStorage+FontScaling.h"
 #import <React/RCTTextView.h>
 
+// @Taskadev1 A custom layout manager to support gapless underlined text
+@interface CustomLayoutManager : NSLayoutManager {
+}
+  - (void)drawUnderlineForRect:(CGRect)rect;
+  - (void)drawUnderlineForGlyphRange:(NSRange)glyphRange 
+                     underlineType:(NSUnderlineStyle)underlineVal 
+                    baselineOffset:(CGFloat)baselineOffset 
+                  lineFragmentRect:(CGRect)lineRect 
+            lineFragmentGlyphRange:(NSRange)lineGlyphRange 
+                   containerOrigin:(CGPoint)containerOrigin;
+@end
+
+@implementation CustomLayoutManager
+
+- (void)drawUnderlineForRect:(CGRect)rect
+{
+  UIBezierPath *path = [UIBezierPath new];
+  path.lineWidth = 3.5;
+  [path moveToPoint: CGPointMake(CGRectGetMinX(rect), CGRectGetMaxY(rect))];
+  [path addLineToPoint: CGPointMake(CGRectGetMaxX(rect), CGRectGetMaxY(rect))];
+  [path stroke];
+}
+
+- (void)drawUnderlineForGlyphRange:(NSRange)glyphRange 
+                     underlineType:(NSUnderlineStyle)underlineVal 
+                    baselineOffset:(CGFloat)baselineOffset 
+                  lineFragmentRect:(CGRect)lineRect 
+            lineFragmentGlyphRange:(NSRange)lineGlyphRange 
+                   containerOrigin:(CGPoint)containerOrigin
+{
+  NSTextContainer *textContainer = [self textContainerForGlyphAtIndex:glyphRange.location effectiveRange: nil];
+  CGRect boundingRect = [self boundingRectForGlyphRange:glyphRange inTextContainer:textContainer];
+  CGRect offsetRect = CGRectOffset(boundingRect, containerOrigin.x, containerOrigin.y );
+  UIColor *color = [self.textStorage attribute:NSUnderlineColorAttributeName atIndex:glyphRange.location effectiveRange: nil];
+  
+  if (color) {
+    [color setStroke];
+  }
+
+  [self drawUnderlineForRect:offsetRect];
+}
+
+@end
+
 @implementation RCTTextShadowView
 {
   __weak RCTBridge *_bridge;
@@ -232,7 +276,7 @@ - (NSTextStorage *)textStorageAndLayoutManagerThatFitsSize:(CGSize)size
     _maximumNumberOfLines > 0 ? _lineBreakMode : NSLineBreakByClipping;
   textContainer.maximumNumberOfLines = _maximumNumberOfLines;
 
-  NSLayoutManager *layoutManager = [NSLayoutManager new];
+  CustomLayoutManager *layoutManager = [CustomLayoutManager new];
   layoutManager.usesFontLeading = NO;
   [layoutManager addTextContainer:textContainer];