diff --git a/ios/sdk/component/text/HippyShadowText.h b/ios/sdk/component/text/HippyShadowText.h index 97bb55d3cc0..5c39e71d677 100644 --- a/ios/sdk/component/text/HippyShadowText.h +++ b/ios/sdk/component/text/HippyShadowText.h @@ -41,6 +41,7 @@ extern NSString *const HippyShadowViewAttributeName; NSAttributedString *_cachedAttributedString; CGFloat _effectiveLetterSpacing; BOOL _textAlignSet; + CGFloat _maximumFontLineHeight; } @property (nonatomic, strong) UIColor *color; diff --git a/ios/sdk/component/text/HippyShadowText.mm b/ios/sdk/component/text/HippyShadowText.mm index 21f50e5affb..0ebca9f5d10 100644 --- a/ios/sdk/component/text/HippyShadowText.mm +++ b/ios/sdk/component/text/HippyShadowText.mm @@ -257,12 +257,20 @@ - (void)applyLayoutToChildren:(__unused MTTNodeRef)node if (isnan(width) || isnan(height)) { HippyLogError(@"Views nested within a must have a width and height"); } - UIFont *font = [textStorage attribute:NSFontAttributeName atIndex:range.location effectiveRange:nil]; + + /** + * For RichText, a view, which is top aligment by default, should be center alignment to text, + */ + CGRect glyphRect = [layoutManager boundingRectForGlyphRange:range inTextContainer:textContainer]; + NSParagraphStyle *style = [textStorage attribute:NSParagraphStyleAttributeName atIndex:0 effectiveRange:nil]; + CGFloat maxLineHeight = style ? style.maximumLineHeight : _maximumFontLineHeight; + CGRect usedOriginRect = [layoutManager lineFragmentRectForGlyphAtIndex:range.location effectiveRange:nil]; + CGFloat Roundedheight = x5RoundPixelValue(height); + CGFloat originY = usedOriginRect.origin.y + (maxLineHeight - Roundedheight) / 2; CGRect childFrame = { { x5RoundPixelValue(glyphRect.origin.x), - x5RoundPixelValue(glyphRect.origin.y + glyphRect.size.height - height + font.descender) }, - { x5RoundPixelValue(width), x5RoundPixelValue(height) } }; - + x5RoundPixelValue(originY) }, + { x5RoundPixelValue(width), Roundedheight } }; NSRange truncatedGlyphRange = [layoutManager truncatedGlyphRangeInLineFragmentForGlyphAtIndex:range.location]; BOOL childIsTruncated = NSIntersectionRange(range, truncatedGlyphRange).length != 0; @@ -460,7 +468,9 @@ - (void)_setParagraphStyleOnAttributedString:(NSMutableAttributedString *)attrib fontLineHeight:(CGFloat)fontLineHeight heightOfTallestSubview:(CGFloat)heightOfTallestSubview { NSTextStorage *textStorage = [[NSTextStorage alloc] initWithAttributedString:attributedString]; - + if (0 == _lineHeight) { + _lineHeight = fontLineHeight; + } // check if we have lineHeight set on self __block BOOL hasParagraphStyle = NO; if (_lineHeight || _textAlignSet) { @@ -515,12 +525,16 @@ - (void)_setParagraphStyleOnAttributedString:(NSMutableAttributedString *)attrib paragraphStyle.maximumLineHeight = maxHeight; [attributedString addAttribute:NSParagraphStyleAttributeName value:paragraphStyle range:(NSRange) { 0, attributedString.length }]; + /** + * for keeping text ertical center, we need to set baseline offset + */ if (lineHeight > fontLineHeight) { - [attributedString addAttribute:NSBaselineOffsetAttributeName value:@(newLineHeight / 2 - maximumFontLineHeight / 2) + CGFloat baselineOffset = newLineHeight / 2 - maximumFontLineHeight / 2; + [attributedString addAttribute:NSBaselineOffsetAttributeName value:@(baselineOffset) range:(NSRange) { 0, attributedString.length }]; } } - + _maximumFontLineHeight = maximumFontLineHeight; // Text decoration if (_textDecorationLine == HippyTextDecorationLineTypeUnderline || _textDecorationLine == HippyTextDecorationLineTypeUnderlineStrikethrough) { [self _addAttribute:NSUnderlineStyleAttributeName withValue:@(_textDecorationStyle) toAttributedString:attributedString];