Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: Add iOS Paper implementation of inset logical properties #36241

Closed
wants to merge 2 commits into from
Closed

feat: Add iOS Paper implementation of inset logical properties #36241

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
950ae01
feat: Add iOS Paper implementation of inset logical properties
gabrieldonadel Feb 22, 2023
474b0ca
Add position meta props to ShadowView
gabrieldonadel Feb 23, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions React/Views/RCTShadowView.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,13 @@ typedef void (^RCTApplierBlock)(NSDictionary<NSNumber *, UIView *> *viewRegistry
@property (nonatomic, assign) YGValue right;
@property (nonatomic, assign) YGValue start;
@property (nonatomic, assign) YGValue end;
@property (nonatomic, assign) YGValue inset;
@property (nonatomic, assign) YGValue insetInline;
@property (nonatomic, assign) YGValue insetInlineEnd;
@property (nonatomic, assign) YGValue insetInlineStart;
@property (nonatomic, assign) YGValue insetBlock;
@property (nonatomic, assign) YGValue insetBlockEnd;
@property (nonatomic, assign) YGValue insetBlockStart;

@property (nonatomic, assign) YGValue width;
@property (nonatomic, assign) YGValue height;
Expand Down
114 changes: 78 additions & 36 deletions React/Views/RCTShadowView.m
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,12 @@ typedef NS_ENUM(unsigned int, meta_prop_t) {
META_PROP_HORIZONTAL,
META_PROP_VERTICAL,
META_PROP_ALL,
META_PROP_INLINE,
META_PROP_INLINE_END,
META_PROP_INLINE_START,
META_PROP_BLOCK,
META_PROP_BLOCK_END,
META_PROP_BLOCK_START,
META_PROP_COUNT,
};

Expand All @@ -38,9 +44,11 @@ @implementation RCTShadowView {
BOOL _recomputePadding;
BOOL _recomputeMargin;
BOOL _recomputeBorder;
BOOL _recomputePosition;
YGValue _paddingMetaProps[META_PROP_COUNT];
YGValue _marginMetaProps[META_PROP_COUNT];
YGValue _borderMetaProps[META_PROP_COUNT];
YGValue _positionMetaProps[META_PROP_COUNT];
}

+ (YGConfigRef)yogaConfig
Expand Down Expand Up @@ -162,6 +170,47 @@ static void RCTProcessMetaPropsBorder(const YGValue metaProps[META_PROP_COUNT],
YGNodeStyleSetBorder(node, YGEdgeAll, metaProps[META_PROP_ALL].value);
}

static void RCTProcessMetaPropsPosition(const YGValue metaProps[META_PROP_COUNT], YGNodeRef node)
{
YGNodeStyleSetPosition(node, YGEdgeTop, metaProps[META_PROP_TOP].value);
YGNodeStyleSetPosition(node, YGEdgeBottom, metaProps[META_PROP_BOTTOM].value);
YGNodeStyleSetPosition(node, YGEdgeStart, metaProps[META_PROP_START].value);
YGNodeStyleSetPosition(node, YGEdgeEnd, metaProps[META_PROP_END].value);

if (![[RCTI18nUtil sharedInstance] doLeftAndRightSwapInRTL]) {
YGNodeStyleSetPosition(node, YGEdgeLeft, metaProps[META_PROP_LEFT].value);
YGNodeStyleSetPosition(node, YGEdgeRight, metaProps[META_PROP_RIGHT].value);
} else {
YGNodeStyleSetPosition(node, YGEdgeStart, metaProps[META_PROP_LEFT].value);
YGNodeStyleSetPosition(node, YGEdgeEnd, metaProps[META_PROP_RIGHT].value);
}

// Aliases with precedence
if (!YGFloatIsUndefined(metaProps[META_PROP_ALL].value)) {
YGNodeStyleSetPosition(node, YGEdgeAll, metaProps[META_PROP_ALL].value);
}
if (!YGFloatIsUndefined(metaProps[META_PROP_BLOCK].value)) {
YGNodeStyleSetPosition(node, YGEdgeVertical, metaProps[META_PROP_BLOCK].value);
}
if (!YGFloatIsUndefined(metaProps[META_PROP_INLINE].value)) {
YGNodeStyleSetPosition(node, YGEdgeHorizontal, metaProps[META_PROP_INLINE].value);
}
if (!YGFloatIsUndefined(metaProps[META_PROP_INLINE_END].value)) {
YGNodeStyleSetPosition(node, YGEdgeEnd, metaProps[META_PROP_INLINE_END].value);
}
if (!YGFloatIsUndefined(metaProps[META_PROP_INLINE_START].value)) {
YGNodeStyleSetPosition(node, YGEdgeStart, metaProps[META_PROP_INLINE_START].value);
}

// Aliases without precedence
if (YGFloatIsUndefined(metaProps[META_PROP_BOTTOM].value)) {
YGNodeStyleSetPosition(node, YGEdgeBottom, metaProps[META_PROP_BLOCK_END].value);
}
if (YGFloatIsUndefined(metaProps[META_PROP_TOP].value)) {
YGNodeStyleSetPosition(node, YGEdgeTop, metaProps[META_PROP_BLOCK_START].value);
}
}

- (CGRect)measureLayoutRelativeToAncestor:(RCTShadowView *)ancestor
{
CGPoint offset = CGPointZero;
Expand Down Expand Up @@ -193,6 +242,7 @@ - (instancetype)init
_paddingMetaProps[ii] = YGValueUndefined;
_marginMetaProps[ii] = YGValueUndefined;
_borderMetaProps[ii] = YGValueUndefined;
_positionMetaProps[ii] = YGValueUndefined;
}

_intrinsicContentSize = CGSizeMake(UIViewNoIntrinsicMetric, UIViewNoIntrinsicMetric);
Expand Down Expand Up @@ -512,42 +562,30 @@ -(YGValue)getProp \

// Position

#define RCT_POSITION_PROPERTY(setProp, getProp, edge) \
-(void)set##setProp : (YGValue)value \
{ \
RCT_SET_YGVALUE(value, YGNodeStyleSetPosition, _yogaNode, edge); \
} \
-(YGValue)getProp \
{ \
return YGNodeStyleGetPosition(_yogaNode, edge); \
}

RCT_POSITION_PROPERTY(Top, top, YGEdgeTop)
RCT_POSITION_PROPERTY(Bottom, bottom, YGEdgeBottom)
RCT_POSITION_PROPERTY(Start, start, YGEdgeStart)
RCT_POSITION_PROPERTY(End, end, YGEdgeEnd)

- (void)setLeft:(YGValue)value
{
YGEdge edge = [[RCTI18nUtil sharedInstance] doLeftAndRightSwapInRTL] ? YGEdgeStart : YGEdgeLeft;
RCT_SET_YGVALUE(value, YGNodeStyleSetPosition, _yogaNode, edge);
}
- (YGValue)left
{
YGEdge edge = [[RCTI18nUtil sharedInstance] doLeftAndRightSwapInRTL] ? YGEdgeStart : YGEdgeLeft;
return YGNodeStyleGetPosition(_yogaNode, edge);
}

- (void)setRight:(YGValue)value
{
YGEdge edge = [[RCTI18nUtil sharedInstance] doLeftAndRightSwapInRTL] ? YGEdgeEnd : YGEdgeRight;
RCT_SET_YGVALUE(value, YGNodeStyleSetPosition, _yogaNode, edge);
}
- (YGValue)right
{
YGEdge edge = [[RCTI18nUtil sharedInstance] doLeftAndRightSwapInRTL] ? YGEdgeEnd : YGEdgeRight;
return YGNodeStyleGetPosition(_yogaNode, edge);
}
#define RCT_POSITION_PROPERTY(setProp, getProp, metaProp) \
-(void)set##setProp : (YGValue)value \
{ \
_positionMetaProps[META_PROP_##metaProp] = value; \
_recomputePosition = YES; \
} \
-(YGValue)getProp \
{ \
return _positionMetaProps[META_PROP_##metaProp]; \
}

RCT_POSITION_PROPERTY(Top, top, TOP)
RCT_POSITION_PROPERTY(Bottom, bottom, BOTTOM)
RCT_POSITION_PROPERTY(Left, left, LEFT)
RCT_POSITION_PROPERTY(Right, right, RIGHT)
RCT_POSITION_PROPERTY(Start, start, START)
RCT_POSITION_PROPERTY(End, end, END)
RCT_POSITION_PROPERTY(Inset, inset, ALL)
RCT_POSITION_PROPERTY(InsetInline, insetInline, INLINE)
RCT_POSITION_PROPERTY(InsetInlineEnd, insetInlineEnd, INLINE_END)
RCT_POSITION_PROPERTY(InsetInlineStart, insetInlineStart, INLINE_START)
RCT_POSITION_PROPERTY(InsetBlock, insetBlock, BLOCK)
RCT_POSITION_PROPERTY(InsetBlockEnd, insetBlockEnd, BLOCK_END)
RCT_POSITION_PROPERTY(InsetBlockStart, insetBlockStart, BLOCK_START)

// Size

Expand Down Expand Up @@ -697,9 +735,13 @@ - (void)didSetProps:(__unused NSArray<NSString *> *)changedProps
if (_recomputeBorder) {
RCTProcessMetaPropsBorder(_borderMetaProps, _yogaNode);
}
if (_recomputePosition) {
RCTProcessMetaPropsPosition(_positionMetaProps, _yogaNode);
}
_recomputeMargin = NO;
_recomputePadding = NO;
_recomputeBorder = NO;
_recomputePosition = NO;
}

@end
7 changes: 7 additions & 0 deletions React/Views/RCTViewManager.m
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -394,6 +394,13 @@ - (RCTShadowView *)shadowView
RCT_EXPORT_SHADOW_PROPERTY(end, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(bottom, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(left, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(inset, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(insetInline, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(insetInlineEnd, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(insetInlineStart, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(insetBlock, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(insetBlockEnd, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(insetBlockStart, YGValue)

RCT_EXPORT_SHADOW_PROPERTY(width, YGValue)
RCT_EXPORT_SHADOW_PROPERTY(height, YGValue)
Expand Down