Facebook/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Back out "Fix TextInput vertical alignment issue when using lineHeight prop on iOS (Paper - old arch)" (#38235)

Browse Source 
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/38235

changelog: [internal]

Original commit changeset: faece0940b15

Original Phabricator Diff: D46086661

This PR broke 50 diffs. Let's back it out.

I will communicate this to the PR owner with an example of what went wrong.

This causes a slight difference in text render:

 {F1043017930}

Reviewed By: javache

Differential Revision: D47284841

fbshipit-source-id: 29d28f62d3997740b2186bd60b327a0d009c4a6b
This commit is contained in:
Samuel Susla
2023-07-07 05:44:24 -07:00
committed by Facebook GitHub Bot
parent c9fee896a1
commit e075a3f424
9 changed files with 7 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-native/Libraries/Text/RCTTextAttributes.m
+3 -11
View File
@@ -130,12 +130,9 @@ NSString *const RCTTextAttributesTagAttributeName = @"RCTTextAttributesTagAttrib
if (!isnan(_lineHeight)) {
CGFloat lineHeight = _lineHeight * self.effectiveFontSizeMultiplier;
// text with lineHeight lower then font.lineHeight does not correctly vertically align
if (lineHeight > self.effectiveFont.lineHeight) {
paragraphStyle.minimumLineHeight = lineHeight;
paragraphStyle.maximumLineHeight = lineHeight;
isParagraphStyleUsed = YES;
}
paragraphStyle.minimumLineHeight = lineHeight;
paragraphStyle.maximumLineHeight = lineHeight;
isParagraphStyleUsed = YES;
}
if (isParagraphStyleUsed) {
@@ -175,11 +172,6 @@ NSString *const RCTTextAttributesTagAttributeName = @"RCTTextAttributesTagAttrib
NSParagraphStyle *paragraphStyle = [self effectiveParagraphStyle];
if (paragraphStyle) {
attributes[NSParagraphStyleAttributeName] = paragraphStyle;
// The baseline aligns the text vertically in the line height
if (!isnan(paragraphStyle.maximumLineHeight) && paragraphStyle.maximumLineHeight >= font.lineHeight) {
CGFloat baseLineOffset = (paragraphStyle.maximumLineHeight - font.lineHeight) / 2.0;
attributes[NSBaselineOffsetAttributeName] = @(baseLineOffset);
}
}
// Decoration
packages/react-native/Libraries/Text/TextInput/Multiline/RCTUITextView.h
-3
View File
@@ -27,9 +27,6 @@ NS_ASSUME_NONNULL_BEGIN
@property (nonatomic, assign, readonly) BOOL dictationRecognizing;
@property (nonatomic, copy, nullable) NSString *placeholder;
@property (nonatomic, strong, nullable) UIColor *placeholderColor;
@property (nonatomic, assign) CGRect fragmentViewContainerBounds;
@property (nonatomic, assign) UIEdgeInsets textBorderInsets;
@property (nonatomic, assign) UIControlContentVerticalAlignment contentVerticalAlignment;
@property (nonatomic, assign) CGFloat preferredMaxLayoutWidth;
packages/react-native/Libraries/Text/TextInput/Multiline/RCTUITextView.m
-8
View File
@@ -169,14 +169,6 @@ static UIColor *defaultPlaceholderColor(void)
[super paste:sender];
}
- (void)setTextBorderInsetsAndFrame:(CGRect)bounds textBorderInsets:(UIEdgeInsets)textBorderInsets
{
_textBorderInsets = textBorderInsets;
// We apply `borderInsets` as `RCTUITextView` layout offset.
self.frame = UIEdgeInsetsInsetRect(bounds, textBorderInsets);
[self setNeedsLayout];
}
// Turn off scroll animation to fix flaky scrolling.
// This is only necessary for iOS <= 14.
#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && __IPHONE_OS_VERSION_MAX_ALLOWED < 140000
packages/react-native/Libraries/Text/TextInput/RCTBackedTextInputViewProtocol.h
-3
View File
@@ -35,8 +35,6 @@ NS_ASSUME_NONNULL_BEGIN
@property (nonatomic, assign, readonly) CGFloat zoomScale;
@property (nonatomic, assign, readonly) CGPoint contentOffset;
@property (nonatomic, assign, readonly) UIEdgeInsets contentInset;
@property (nonatomic, assign) CGRect fragmentViewContainerBounds;
@property (nonatomic, assign) UIControlContentVerticalAlignment contentVerticalAlignment;
// This protocol disallows direct access to `selectedTextRange` property because
// unwise usage of it can break the `delegate` behavior. So, we always have to
@@ -45,7 +43,6 @@ NS_ASSUME_NONNULL_BEGIN
// If the change was a result of user actions (like typing or touches), we MUST notify the delegate.
- (void)setSelectedTextRange:(nullable UITextRange *)selectedTextRange NS_UNAVAILABLE;
- (void)setSelectedTextRange:(nullable UITextRange *)selectedTextRange notifyDelegate:(BOOL)notifyDelegate;
- (void)setTextBorderInsetsAndFrame:(CGRect)bounds textBorderInsets:(UIEdgeInsets)textBorderInsets;
// This protocol disallows direct access to `text` property because
// unwise usage of it can break the `attributeText` behavior.
packages/react-native/Libraries/Text/TextInput/RCTBaseTextInputShadowView.m
-18
View File
@@ -177,24 +177,6 @@
baseTextInputView.textAttributes = textAttributes;
baseTextInputView.reactBorderInsets = borderInsets;
// Fixes iOS issue caused by adding paragraphStyle.maximumLineHeight to an iOS UITextField.
// The CALayer _UITextLayoutFragmentView does not align correctly (see issue #28012).
if (!isnan(textAttributes.lineHeight) && !isnan(textAttributes.effectiveFont.lineHeight)) {
CGFloat effectiveLineHeight = textAttributes.lineHeight * textAttributes.effectiveFontSizeMultiplier;
CGFloat fontLineHeight = textAttributes.effectiveFont.lineHeight;
if (effectiveLineHeight >= fontLineHeight * 2.0) {
CGFloat height = self.layoutMetrics.frame.size.height;
CGFloat width = self.layoutMetrics.frame.size.width;
// sets the same origin.y coordinates for _UITextLayoutFragmentView and UITextField frame
baseTextInputView.contentVerticalAlignment = UIControlContentVerticalAlignmentTop;
// vertically center aligns the _UITextLayoutFragmentView in the parent UITextField
CGFloat padding = (height - effectiveLineHeight) / 2.0;
baseTextInputView.fragmentViewContainerBounds = CGRectMake(0, padding, width, effectiveLineHeight);
}
} else {
baseTextInputView.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
}
baseTextInputView.reactPaddingInsets = paddingInsets;
if (newAttributedText) {
packages/react-native/Libraries/Text/TextInput/RCTBaseTextInputView.h
-2
View File
@@ -31,8 +31,6 @@ NS_ASSUME_NONNULL_BEGIN
@property (nonatomic, strong, nullable) RCTTextAttributes *textAttributes;
@property (nonatomic, assign) UIEdgeInsets reactPaddingInsets;
@property (nonatomic, assign) UIEdgeInsets reactBorderInsets;
@property (nonatomic, assign) CGRect fragmentViewContainerBounds;
@property (nonatomic, assign) UIControlContentVerticalAlignment contentVerticalAlignment;
@property (nonatomic, copy, nullable) RCTDirectEventBlock onContentSizeChange;
@property (nonatomic, copy, nullable) RCTDirectEventBlock onSelectionChange;
packages/react-native/Libraries/Text/TextInput/RCTBaseTextInputView.m
+3 -18
View File
@@ -76,22 +76,6 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
backedTextInputView.defaultTextAttributes = textAttributes;
}
// Fixes iOS alignment issue caused by adding paragraphStyle.maximumLineHeight to an iOS UITextField
// vertically aligns _UITextLayoutFragmentView with the parent view UITextField
- (void)setContentVerticalAlignment:(UIControlContentVerticalAlignment)contentVerticalAlignment
{
_contentVerticalAlignment = contentVerticalAlignment;
self.backedTextInputView.contentVerticalAlignment = contentVerticalAlignment;
}
// Custom bounds used to control vertical position of CALayer _UITextLayoutFragmentView
// _UITextLayoutFragmentView is the CALayer of UITextField
- (void)setFragmentViewContainerBounds:(CGRect)fragmentViewContainerBounds
{
_fragmentViewContainerBounds = fragmentViewContainerBounds;
self.backedTextInputView.fragmentViewContainerBounds = fragmentViewContainerBounds;
}
- (void)setReactPaddingInsets:(UIEdgeInsets)reactPaddingInsets
{
_reactPaddingInsets = reactPaddingInsets;
@@ -103,8 +87,9 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
- (void)setReactBorderInsets:(UIEdgeInsets)reactBorderInsets
{
_reactBorderInsets = reactBorderInsets;
// Borders are added using insets (UITextField textRectForBound, UITextView setFrame)
[self.backedTextInputView setTextBorderInsetsAndFrame:self.bounds textBorderInsets:reactBorderInsets];
// We apply `borderInsets` as `backedTextInputView` layout offset.
self.backedTextInputView.frame = UIEdgeInsetsInsetRect(self.bounds, reactBorderInsets);
[self setNeedsLayout];
}
- (NSAttributedString *)attributedText
packages/react-native/Libraries/Text/TextInput/Singleline/RCTUITextField.h
-2
View File
@@ -27,8 +27,6 @@ NS_ASSUME_NONNULL_BEGIN
@property (nonatomic, assign, readonly) BOOL dictationRecognizing;
@property (nonatomic, strong, nullable) UIColor *placeholderColor;
@property (nonatomic, assign) UIEdgeInsets textContainerInset;
@property (nonatomic, assign) CGRect fragmentViewContainerBounds;
@property (nonatomic, assign) UIEdgeInsets textBorderInsets;
@property (nonatomic, assign, getter=isEditable) BOOL editable;
@property (nonatomic, getter=isScrollEnabled) BOOL scrollEnabled;
@property (nonatomic, strong, nullable) NSString *inputAccessoryViewID;
packages/react-native/Libraries/Text/TextInput/Singleline/RCTUITextField.m
+1 -18
View File
@@ -55,12 +55,6 @@
[self setNeedsLayout];
}
- (void)setTextBorderInsetsAndFrame:(CGRect)bounds textBorderInsets:(UIEdgeInsets)textBorderInsets
{
_textBorderInsets = textBorderInsets;
[self setNeedsLayout];
}
- (void)setPlaceholder:(NSString *)placeholder
{
[super setPlaceholder:placeholder];
@@ -176,18 +170,7 @@
- (CGRect)textRectForBounds:(CGRect)bounds
{
// Text is vertically aligned to the center
CGFloat leftPadding = _textContainerInset.left + _textBorderInsets.left;
CGFloat rightPadding = _textContainerInset.right + _textBorderInsets.right;
UIEdgeInsets borderAndPaddingInsets =
UIEdgeInsetsMake(_textContainerInset.top, leftPadding, _textContainerInset.bottom, rightPadding);
if (self.fragmentViewContainerBounds.size.height > 0) {
// apply custom bounds to fix iOS UITextField issue with lineHeight
// sets the correct y coordinates for _UITextLayoutFragmentView
return UIEdgeInsetsInsetRect([super textRectForBounds:self.fragmentViewContainerBounds], borderAndPaddingInsets);
} else {
return UIEdgeInsetsInsetRect([super textRectForBounds:bounds], borderAndPaddingInsets);
}
return UIEdgeInsetsInsetRect([super textRectForBounds:bounds], _textContainerInset);
}
- (CGRect)editingRectForBounds:(CGRect)bounds