Skip to content

Commit a340eec

Browse files
qutrekmeta-codesync[bot]
authored andcommitted
Resolve natural text alignment from the layout direction for LTR as well as RTL (#59249)
Summary: 0.88 made `Text` with no `textAlign` align to the right when the layout direction is RTL, which matches Android. That check only runs when the direction is RTL, so for LTR the paragraph style is left alone and iOS falls back to its own "natural" alignment. iOS works that out from the language it picked for the process, not from the layout direction React Native is using. This shows up in apps that ship more than one language and let people choose it in the app. On an iPhone set to Arabic, with the app set to English (`I18nManager.isRTL` is false, the layout is LTR), every `Text` without `textAlign` is right-aligned inside a left-to-right layout. Android doesn't have this problem. This change runs the same resolution whenever a layout direction is set, so natural alignment follows the layout direction both ways. Text with an explicit `textAlign` is not affected, and RTL behaves as it does today. ## Changelog: [IOS] [FIXED] - Natural text alignment follows the layout direction for LTR text, not the process language Pull Request resolved: #59249 Test Plan: Our app on 0.88.0 (built from source), iOS 27 simulator with the device language set to Arabic, app set to English, `I18nManager.isRTL` false: - Without the change, the labels and descriptions on a settings screen (`Text` without `textAlign`) are right-aligned while the rows, icons and switches are laid out left to right. - With the change, the same text is left-aligned. Nothing else on the screen moves. - With the app in Arabic (RTL), text is right-aligned with the change, as before (the RTL path takes the same branch it took already). We carry this as a patch in our app's current test builds. Happy to add screenshots. Reviewed By: christophpurrer Differential Revision: D126698053 Pulled By: javache fbshipit-source-id: c363af359dee730f7b1589ad40cb0ab48b53ad1a
1 parent 79a5629 commit a340eec

1 file changed

Lines changed: 2 additions & 2 deletions

File tree

  • packages/react-native/ReactCommon/react/renderer/textlayoutmanager/platform/ios/react/renderer/textlayoutmanager

‎packages/react-native/ReactCommon/react/renderer/textlayoutmanager/platform/ios/react/renderer/textlayoutmanager/RCTAttributedTextUtils.mm‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -218,8 +218,8 @@ inline static CGFloat RCTEffectiveFontSizeMultiplierFromTextAttributes(const Tex
218218
// Paragraph Style
219219
NSMutableParagraphStyle *paragraphStyle = [NSMutableParagraphStyle new];
220220
BOOL isParagraphStyleUsed = NO;
221-
const bool isRTL = textAttributes.layoutDirection == LayoutDirection::RightToLeft;
222-
if (textAttributes.alignment.has_value() || isRTL) {
221+
if (textAttributes.alignment.has_value() || textAttributes.layoutDirection.has_value()) {
222+
const bool isRTL = textAttributes.layoutDirection == LayoutDirection::RightToLeft;
223223
TextAlignment textAlignment =
224224
RCTResolveTextAlignment(textAttributes.alignment.value_or(TextAlignment::Natural), isRTL);
225225

0 commit comments

Comments
 (0)