Skip to content

Commit

Permalink
Fixed dynamic behavior of <Text adjustsFontSizeToFit={true}> on Andro…
Browse files Browse the repository at this point in the history
…id (#31538)

Summary:
This PR fixes #30717, a bug in `<Text adjustsFontSizeToFit={true}>` implementation that prevents it from adjusting text size dynamically on Android.

The way `adjustsFontSizeToFit` was implemented in #26389 (and the design of ReactTextShadowNode) implies that Yoga will call `onMeasure` on every size change of a `<Text>` component, which is actually not the case (Yoga can cache the results of the measures, call the function multiple times or do not call at all inferring the size from the size constraints). The implementation of `adjustsFontSizeToFit` computes the adjusted string inside the measure function and then eventually passes that to the view layer where it's being rendered.

The proper fix of this issue requires the full redesign of the measure and rendering pipelines and separating them, and that... would be too invasive. And, I believe, this issue is already fixed in Fabric where this part is already designed this way.

Instead, this diff implements a small workaround: if `adjustsFontSizeToFit` is enabled, we manually dirty the Yoga node and mark the shadow node updated to force remeasuring.

## Changelog

[Android] [Fixed] - Fixed dynamic behavior of <Text adjustsFontSizeToFit={true}> on Android

Pull Request resolved: #31538

Test Plan: https://user-images.githubusercontent.com/22032/118508162-8c79cc80-b6f4-11eb-853f-a1a09f82935f.mov

Reviewed By: mdvacca

Differential Revision: D28631465

Pulled By: yungsters

fbshipit-source-id: 7db1d22e2a5a464c7bf941d1d3df8e3fe8df66a2
  • Loading branch information
shergin-cb authored and facebook-github-bot committed Aug 25, 2021
1 parent dcfa0dc commit 5902152
Showing 1 changed file with 5 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -327,6 +327,11 @@ public void onCollectExtraUpdates(UIViewOperationQueue uiViewOperationQueue) {
mJustificationMode);
uiViewOperationQueue.enqueueUpdateExtraData(getReactTag(), reactTextUpdate);
}

if (mAdjustsFontSizeToFit) {
// Nodes with `adjustsFontSizeToFit` enabled need to be remeasured on every relayout.
markUpdated();
}
}

@ReactProp(name = "onTextLayout")
Expand Down

0 comments on commit 5902152

Please sign in to comment.