Fix Android Text clipping with Bold text setting#57118
Conversation
|
@javache has imported this pull request. If you are a Meta employee, you can view this in D108136049. |
| textEffectRegistry: TextEffectRegistry?, | ||
| ): Spannable { | ||
| var text: Spannable? | ||
| if (attributedString.contains(AS_KEY_CACHE_ID)) { |
There was a problem hiding this comment.
The new fontWeightAdjustment parameter is only applied when creating a fresh spannable. When AS_KEY_CACHE_ID is present, the previously cached spannable is returned (lines 704-716) without revalidation — carrying stale CustomStyleSpan weights from before the Bold Text setting changed.
| } | ||
|
|
||
| @Test | ||
| fun `plain text paint applies Android font weight adjustment`() { |
There was a problem hiding this comment.
The test only asserts paint.typeface is non-null. If applyFontWeightAdjustment returned any non-null typeface without applying the weight adjustment (e.g., always Typeface.DEFAULT at weight 400), the test would still pass while the production bug persisted.
| @OptIn(UnstableReactNativeAPI::class) | ||
| fun getOrCreateSpannableForText( | ||
| assets: AssetManager, | ||
| fontWeightAdjustment: Int, | ||
| attributedString: MapBuffer, | ||
| reactTextViewManagerCallback: ReactTextViewManagerCallback?, | ||
| ): Spannable = | ||
| getOrCreateSpannableForText( | ||
| assets, | ||
| fontWeightAdjustment, | ||
| attributedString, | ||
| reactTextViewManagerCallback, | ||
| null, | ||
| ) | ||
|
|
||
| @OptIn(UnstableReactNativeAPI::class) | ||
| internal fun getOrCreateSpannableForText( | ||
| assets: AssetManager, | ||
| attributedString: MapBuffer, | ||
| reactTextViewManagerCallback: ReactTextViewManagerCallback?, | ||
| textEffectRegistry: TextEffectRegistry?, | ||
| ): Spannable = |
There was a problem hiding this comment.
These are internal functions, so we don't need to keep all the overloads for backwards compatibility.
There was a problem hiding this comment.
Avoid duplication, use an early return
| val cachedSpannable = checkNotNull(tagToSpannableCache[cacheId]) | |
| if (cachedSpannable.fontWeightAdjustment == fontWeightAdjustment) { | |
| return cachedSpannable.spannable | |
| } | |
| return createSpannableFromAttributedString( | |
| assets, | |
| fontWeightAdjustment, | |
| attributedString.getMapBuffer(AS_KEY_FRAGMENTS), | |
| reactTextViewManagerCallback, | |
| null, | |
| textEffectRegistry, | |
| ) |
| createSpannableFromAttributedString( | ||
| assets, | ||
| fontWeightAdjustment, | ||
| attributedString.getMapBuffer(AS_KEY_FRAGMENTS), | ||
| reactTextViewManagerCallback, | ||
| null, | ||
| textEffectRegistry, | ||
| ) |
There was a problem hiding this comment.
Should we write back to the cache?
| if (attributedString.contains(AS_KEY_CACHE_ID)) { | ||
| paint = text.getSpans(0, 0, ReactTextPaintHolderSpan::class.java)[0].textPaint | ||
| val textPaintHolderSpans = text.getSpans(0, 0, ReactTextPaintHolderSpan::class.java) | ||
| paint = |
There was a problem hiding this comment.
Why the change here? Recreating paint here may have a performance impact - why can't we apply the adjustment when creating the ReactTextPaintHolderSpan?
| private const val FONT_WEIGHT_MIN = 1 | ||
| private const val FONT_WEIGHT_MAX = 1000 |
There was a problem hiding this comment.
Use FontStyle.FONT_WEIGHT_MIN/MAX
| .java | ||
| .getDeclaredMethod( | ||
| "updateTextPaint", | ||
| TextPaint::class.java, |
There was a problem hiding this comment.
Don't use reflection, mark the method internal instead
| reactTextViewManagerCallback: ReactTextViewManagerCallback?, | ||
| attachmentsPositions: FloatArray?, | ||
| textEffectRegistry: TextEffectRegistry? = null, | ||
| ): Long = |
There was a problem hiding this comment.
Internal method - don't add overloads
807447e to
97b3430
Compare
Summary:
Fixes #54931.
Close torin-asakura/workspace#119.
Android's Bold text accessibility setting updates
Configuration.fontWeightAdjustment, which makes platformTextViewdraw text with an adjusted typeface. React Native was measuring Text without that adjustment, so Yoga could allocate a row item width that was too small and the rendered text was clipped.This passes the current font weight adjustment through Fabric text measurement, prepared text layout, mounted Text spans, and TextInput spans, and applies it to the
TextPaint/CustomStyleSpantypeface used for measurement and drawing.Changelog:
[ANDROID] [FIXED] - Account for Android Bold text font weight adjustment when measuring Text.
Test Plan:
./gradlew :packages:react-native:ReactAndroid:testDebugUnitTest --tests com.facebook.react.views.text.TextLayoutManagerFontWeightAdjustmentTest -Preact.internal.useHermesStable=true./gradlew :packages:react-native:ReactAndroid:ktfmtCheck -Preact.internal.useHermesStable=trueReproduced locally before the fix with https://github.com/Lego4m/reproducer-react-native-android-bold-text on Android 16 AVD by toggling
font_weight_adjustmentbetween0and300.Screenshots from #54931: