Repository navigation
fix(android): center inline images on the cap height like iOS - #1089
Merged
hryhoriiK97 merged 2 commits intoOct 27, 2026
Merged
hryhoriiK97 merged 2 commits into
hryhoriiK97 merged 2 commits into
Conversation
An inline image's bottom sat on the baseline, so an icon taller than the capitals stood above the line of text. iOS centers inline attachments on the font's cap height; Android now draws the image centered on the cap height of the paint it is drawn with. Both ImageSpan copies change the same way.
juliusmarminge
added a commit
to pingdotgg/t3code
that referenced
this pull request
Oct 24, 2026
Android drew an inline image with its bottom on the baseline, so icons sat above the line while iOS centers them on the cap height. The Enriched Markdown archive now carries software-mansion/enriched-markdown#1089, which centers them the same way on Android. Co-Authored-By: Claude Opus 5.5 <[email protected]>
Centered on the cap height, an inline image taller than the text ran past both edges of its line and the view clipped it. iOS grows the line for such an attachment; getSize now widens the line metrics the same way. Re-records the Android inline image screenshots for the new placement. Co-Authored-By: Claude Opus 5.5 <[email protected]>
Collaborator
|
Pushed a fixup on top: 7bf92da (fix(android): grow the line to fit a tall inline image) Centering on the cap height fixes normal-size icons, but Android never let an inline image change the line height ( Checked in the RN example on the Pixel 9 / API 36 emulator, and on the iOS simulator for reference. The first three rows use the default 20dp icon (body text, wrapped text, heading); the last row uses
|
hryhoriiK97
approved these changes
Oct 27, 2026
juliusmarminge
added a commit
to pingdotgg/enriched-markdown
that referenced
this pull request
Nov 6, 2026
Upstream merged our software-mansion#1086, software-mansion#1087, software-mansion#1088 and software-mansion#1089; the fork's copies of software-mansion#1088 and software-mansion#1089 were reverted first because upstream edited them before merging. Conflicts were the md4c flag lists, where upstream added strikethrough (software-mansion#1090) next to our preserveWindowsPaths, and the parser TurboModule's flag struct now has ten fields.
5 of 6 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What/Why?
On Android an inline image is drawn with its bottom near the baseline (
y - h + 0.1h), so an icon taller than the capitals stands above the line of text. iOS centers inline attachments on the font's cap height (ENRMImageAttachment,(capHeight - height) / 2), so the same Markdown lines up on iOS and sits high on Android.Both
ImageSpancopies (the React Native package andenriched-markdown-android) now center the image on the cap height of the paint it is drawn with, matching iOS. Line metrics are unchanged, sincegetSizeandchooseHeightdon't look at inline images.Measured in T3 Code on an Android 17 emulator and an iOS 27 simulator. The offset is the gap between the image's center and the text's cap center, in cap heights:
Testing
InlineImagePlacementTest(native graphics, likeSpoilerPaintingTest) draws an inline image between text and checks that its painted center is the cap-height center. It fails onmain(9.5 against 11.0) and passes here.enriched-markdown-android::ui:testDebugUnitTest(526 tests) and:ui:ktlintCheckpass. React Native package:testDebugUnitTestandktlintCheckpass.PR Checklist
Model: Claude Opus 5.5. Harness: Claude Code in T3 Code.