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

Apply padding to the text attachements (#44258)

Browse Source 
Summary:
Paddings are not applied to inline views in text, this PR fixes that.

Closes https://github.com/facebook/react-native/issues/42099

## Changelog:

[GENERAL] [FIXED] - Fixed padding not being applied to inline views in text

Pull Request resolved: https://github.com/facebook/react-native/pull/44258

Test Plan:
<details>
<summary>A simple test case</summary>

```jsx
      <Text style={{paddingHorizontal: 40, paddingVertical: 40, backgroundColor: 'green', width: 300 }}>
        <View style={{backgroundColor: 'red', width: 50, height: 50}} />
        foobar foobar
        <View style={{backgroundColor: 'red', width: 50, height: 50}} />
      </Text>
```

|iOS before|iOS after|Android before|Android after|
|-|-|-|-|
|<img width="502" alt="Screenshot 2024-04-25 at 17 17 50" src="https://github.com/facebook/react-native/assets/21055725/e6981de0-6714-4bb0-a006-547b30374b8a">|<img width="546" alt="Screenshot 2024-04-25 at 17 15 56" src="https://github.com/facebook/react-native/assets/21055725/51e8458b-ad4e-4755-865c-664414bfee55">|<img width="457" alt="Screenshot 2024-04-26 at 11 18 17" src="https://github.com/facebook/react-native/assets/21055725/ac351eff-6d24-40a0-bf7e-0cf3782e9368">|<img width="457" alt="Screenshot 2024-04-26 at 11 17 11" src="https://github.com/facebook/react-native/assets/21055725/3284a79a-157d-43ea-b080-849520e2ee7d">|

</details>

Reviewed By: christophpurrer

Differential Revision: D56789213

Pulled By: NickGerleman

fbshipit-source-id: 2dd0e4bf291e20b3e4c4d73f58079d1abafc3f8e
This commit is contained in:
Jakub Piasecki
2024-04-30 20:59:35 -07:00
committed by Facebook GitHub Bot
parent 639d890dff
commit 12aef32b82
1 changed files with 3 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-native/ReactCommon/react/renderer/components/text/ParagraphShadowNode.cpp
+3
View File
@@ -243,6 +243,9 @@ void ParagraphShadowNode::layout(LayoutContext layoutContext) {
dynamic_cast<LayoutableShadowNode&>(*clonedShadowNode);
auto attachmentFrame = measurement.attachments[i].frame;
attachmentFrame.origin.x += layoutMetrics.contentInsets.left;
attachmentFrame.origin.y += layoutMetrics.contentInsets.top;
auto attachmentSize = roundToPixel<&ceil>(
attachmentFrame.size, layoutMetrics.pointScaleFactor);
auto attachmentOrigin = roundToPixel<&round>(