Add RTL support

Summary:
Changelog: [internal]

layoutDirectionPass down layoutDirection from `RCTSurfacePresenter` down to `YogaLayutableShadowNode`.

In `ParagraphShadowNode`, we propagate layoutDirection from yoga node to `TextAttributes.layoutDirection`.

Reviewed By: shergin

Differential Revision: D20420041

fbshipit-source-id: 86e01d31ea9415acb8579c44c470cac870ec1b8f
This commit is contained in:
Samuel Susla
2020-03-17 14:09:28 -07:00
committed by Facebook GitHub Bot
parent 678f1c4490
commit 71c7e80bfd
3 changed files with 17 additions and 4 deletions
+6
View File
@@ -9,6 +9,7 @@
#import <react/components/view/AccessibilityPrimitives.h>
#import <react/components/view/primitives.h>
#import <react/core/LayoutPrimitives.h>
#import <react/graphics/Color.h>
#import <react/graphics/Geometry.h>
#import <react/graphics/Transform.h>
@@ -166,4 +167,9 @@ inline facebook::react::EdgeInsets RCTEdgeInsetsFromUIEdgeInsets(const UIEdgeIns
return {edgeInsets.left, edgeInsets.top, edgeInsets.right, edgeInsets.bottom};
}
inline facebook::react::LayoutDirection RCTLayoutDirection(BOOL isRTL)
{
return isRTL ? facebook::react::LayoutDirection::RightToLeft : facebook::react::LayoutDirection::LeftToRight;
}
NS_ASSUME_NONNULL_END
+7 -3
View File
@@ -14,6 +14,7 @@
#import <React/RCTComponentViewRegistry.h>
#import <React/RCTFabricSurface.h>
#import <React/RCTFollyConvert.h>
#import <React/RCTI18nUtil.h>
#import <React/RCTMountingManager.h>
#import <React/RCTMountingManagerDelegate.h>
#import <React/RCTScheduler.h>
@@ -137,7 +138,8 @@ using namespace facebook::react;
std::shared_lock<better::shared_mutex> lock(_schedulerMutex);
LayoutContext layoutContext = {.pointScaleFactor = RCTScreenScale()};
LayoutConstraints layoutConstraints = {.minimumSize = RCTSizeFromCGSize(minimumSize),
.maximumSize = RCTSizeFromCGSize(maximumSize)};
.maximumSize = RCTSizeFromCGSize(maximumSize),
.layoutDirection = RCTLayoutDirection([[RCTI18nUtil sharedInstance] isRTL])};
return [_scheduler measureSurfaceWithLayoutConstraints:layoutConstraints
layoutContext:layoutContext
surfaceId:surface.rootTag];
@@ -148,7 +150,8 @@ using namespace facebook::react;
std::shared_lock<better::shared_mutex> lock(_schedulerMutex);
LayoutContext layoutContext = {.pointScaleFactor = RCTScreenScale()};
LayoutConstraints layoutConstraints = {.minimumSize = RCTSizeFromCGSize(minimumSize),
.maximumSize = RCTSizeFromCGSize(maximumSize)};
.maximumSize = RCTSizeFromCGSize(maximumSize),
.layoutDirection = RCTLayoutDirection([[RCTI18nUtil sharedInstance] isRTL])};
[_scheduler constraintSurfaceLayoutWithLayoutConstraints:layoutConstraints
layoutContext:layoutContext
surfaceId:surface.rootTag];
@@ -258,7 +261,8 @@ using namespace facebook::react;
LayoutContext layoutContext = {.pointScaleFactor = RCTScreenScale()};
LayoutConstraints layoutConstraints = {.minimumSize = RCTSizeFromCGSize(surface.minimumSize),
.maximumSize = RCTSizeFromCGSize(surface.maximumSize)};
.maximumSize = RCTSizeFromCGSize(surface.maximumSize),
.layoutDirection = RCTLayoutDirection([[RCTI18nUtil sharedInstance] isRTL])};
[_scheduler startSurfaceWithSurfaceId:surface.rootTag
moduleName:surface.moduleName
@@ -32,7 +32,10 @@ Content const &ParagraphShadowNode::getContent() const {
auto textAttributes = TextAttributes::defaultTextAttributes();
textAttributes.apply(getConcreteProps().textAttributes);
textAttributes.layoutDirection =
YGNodeLayoutGetDirection(&yogaNode_) == YGDirectionRTL
? LayoutDirection::RightToLeft
: LayoutDirection::LeftToRight;
auto attributedString = AttributedString{};
auto attachments = Attachments{};
buildAttributedString(textAttributes, *this, attributedString, attachments);