Idea: fix React Native text clipped on Android 15 (useBoundsForWidth) #4
AmineYagoub
started this conversation in
Ideas
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
The problem. On Android 15 and later, for apps that target SDK 35 or later,
TextViewbreaks lines by the glyphs' ink bounds (useBoundsForWidth, on by default). React Native measures text by advances, inTextLayoutManagerwithStaticLayoutandLayout.getDesiredWidth. When a word's ink runs past its last advance, the box React Native sized for one line is too narrow, so Android wraps the line and the second line is clipped out of sight.What it cost us. In Minhajna (djazairdev/minhajna#185, fixed in djazairdev/minhajna#195), the chip label «تاريخ آخر» showed only «تاريخ». The label «سبب آخر», the same length, was fine.
In a probe on the Android 15 emulator, with Noto Naskh Arabic Medium at 28 px, «تاريخ آخر» measured 99 px of advances, but its ink ran from −1 to 99 px.
textBreakStrategydoesn't help. React Native 0.87.1 declares asetUseBoundsForWidthlookup inTextLayoutManager.ktbut never calls it.Our workaround is
<item name="android:useBoundsForWidth">false</item>in the app theme, kept in place by a test. The full analysis, and a report ready for React Native's tracker, are indocs/checks/text-bounds.md.Who else it hits. Arabic, Persian and Urdu apps first, since Naskh fonts overhang a lot. Also any font with overhanging glyphs, such as italics and some display fonts. It's easy to miss: only some words wrap, and only on Android 15 and later.
What to build
setUseBoundsForWidthmatching the TextView's setting, or that turns it off onReactTextView.<Text>both ways and warn when they disagree.Size: the config plugin is small, and the upstream pull request is a few lines plus tests. MIT, to match React Native.
From Minhajna's work; drafted with Claude Code.
All reactions