software-mansion / software-mansion/react-native-screens
iOS 26: Source screen has sharp corners during zoom transition pushback
@t0maboro is already working on this.
Since Mar 19, 2026.
- Dominant language
- TypeScript
- Stars
- 3.7k
- Forks
- 714
- Avg merge
- 2d 23h
- Merged PRs (30d)
- 71
Description
Description
On iOS 26, when using the zoom transition (Link.AppleZoom via expo-router), the transition itself works — the destination screen zooms in from the source card. However, the source screen that pushes back during the zoom has sharp corners instead of the rounded corners that native iOS 26 apps show.
In native iOS 26 apps (e.g., Photos, App Store), when a zoom transition pushes the source screen back, the source gets rounded corners matching the device's screen radius. With react-native-screens, the source screen remains sharp/rectangular.
Steps to reproduce
- Clone the repro:
git clone https://github.com/agru97/rn-screens-zoom-repro.git npm install && npx expo run:ios- Tap the card to trigger the zoom transition
- Observe: the source screen pushes back with sharp corners instead of rounded corners
Snack or a link to a repository
https://github.com/agru97/rn-screens-zoom-repro
Screens version
4.24.0
React Native version
0.83.2
Platforms
- iOS
Environment
- expo-router: 55.0.5
- Expo SDK: 55
- iOS: 26.3
- Xcode: 26.3
Setup
Source (card):
<Link href={{ pathname: "/pin/[id]", params: { id } }} asChild>
<Link.Trigger withAppleZoom>
<Pressable>{/* card content */}</Pressable>
</Link.Trigger>
</Link>
Destination (detail screen):
<Link.AppleZoomTarget>
<View>{heroContent}</View>
</Link.AppleZoomTarget>
Stack screen config (no animation override):
<Stack.Screen
name="pin/[id]"
options={{
contentStyle: { flex: 1, backgroundColor: themeColors.background },
}}
/>
Feature flag:
featureFlags.experiment.ios26AllowInteractionsDuringTransition = true;
Observed behavior
- Zoom transition activates correctly (destination zooms from source card) ✅
- Source screen pushes back ~10% ✅
- Source screen has sharp corners during pushback ❌
Expected behavior
Source screen should have rounded corners (matching device screen radius) during the zoom pushback, like native iOS 26 apps.
Likely cause
RNSScreenView has clipsToBounds = NO by default, which prevents iOS 26's corner masking (cornerConfiguration / container-concentric rounding) from being applied to the source screen during the transition.
I tried patching self.clipsToBounds = YES in initCommonProps but it had no effect — the corner rounding might need to be applied at the UIViewController.view level or via cornerConfiguration on the screen's layer.
Contributor guide
No contributing guide indexed for this repository
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.
Assessment
This issue has not been assessed yet.