wix / wix/react-native-navigation
Support custom scale property for dynamically downloaded tab/toolbar icons
Nobody has claimed this yet.
- Dominant language
- MDX
- Stars
- 13.2k
- Forks
- 2.6k
- Avg merge
- 6d 2h
- Merged PRs (30d)
- 1
Description
Description
When using dynamically downloaded images (e.g. user avatars fetched from a CDN) as tab-bar or toolbar icons, there is no way to specify the image scale factor. ImageParser delegates to [RCTConvert UIImage:], which defaults to scale = 1.0 for URI-based images. This causes icons to render at their full pixel size on Retina displays instead of the intended logical size.
The standard @2x/@3x filename suffix convention does not apply here because images are downloaded to the cache directory at runtime with arbitrary filenames.
Steps to reproduce
- Download an image to the local filesystem (e.g. a 60×60 px avatar for a 20pt tab icon on a 3x device)
- Pass it as a bottom tab icon:
{ uri: 'file:///path/to/avatar.png' } - Observe the icon renders at 60×60 points instead of 20×20 points
Expected behavior
Callers should be able to pass an optional scale property in the image source dictionary:
icon: { uri: 'file:///path/to/avatar.png', scale: 3 }
ImageParser would then re-create the UIImage at the requested scale using [UIImage imageWithCGImage:scale:orientation:], so the icon renders at the correct logical size.
Proposed fix
PR #8329 adds this support in a backwards-compatible way — the scale key is only read when explicitly provided.
Environment
- react-native-navigation: 8.8.8
- React Native: 0.85.3
- Platform: iOS
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the ImageParser entry point and review PR #8329, which the issue identifies as adding this support. Confirm the optional scale behavior for URI image sources and that existing sources retain their current behavior; done means the requested icon sizing works without regressions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- objective-c, react-native
- Domain
- mobile
- Issue type
- Feature
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 30/100