Touches are not working for positioned absolutely Animated.View on Android only #3786
Description
Description
Screenrecorder-2025-10-29-15-24-48-903.mp4
<Animated.View className="flex-1 items-center justify-center bg-red-600">
<Animated.View className="h-40 w-48 bg-green-800">
<Animated.View className="absolute top-96 h-20 bg-blue-800">
<Switch onValueChange={setIsEnabled} value={isEnabled} />
</Animated.View>
</Animated.View>
</Animated.View>
When an Animated.View (the blue box) inside another Animated.View(the green box) is absolutely positioned so that it goes outside the layout of its parent, it stops receiving touches. therefore the < switch /> stops working
However, if I replace the parent Animated.View(the green box) with a normal View, everything works fine:
// it works as shown in the video below
<Animated.View className="flex-1 items-center justify-center bg-red-600">
<View className="h-40 w-48 bg-green-800">
<Animated.View className="absolute top-96 h-20 bg-blue-800">
<Switch onValueChange={setIsEnabled} value={isEnabled} />
</Animated.View>
</View>
</Animated.View>
Screenrecorder-2025-10-29-17-28-22-859.mp4
Also, this issue does not happen on iOS. touches work perfectly fine there
Steps to reproduce
1- Create an Animated.View as the main container (for example, a full-screen red background).
2- Inside that container, create another Animated.View. this will act as the parent box (for example, a green box with fixed width and height).
3- Inside the green box, create a third Animated.View that has position: 'absolute' and a large top value so it goes outside the green box
4- Inside that absolutely positioned blue box, create a touchable element such as a Switch from react native
5- Run the app on Android and try interacting with the <Switch/>:
You’ll notice that the <Switch/> doesn’t respond to touches when it’s outside the green box (its parent).
6- Run the same setup on iOS, or replace the parent green Animated.View with a regular View: In both cases, the <Switch/> works normally, even when positioned outside the parent’s layout.
A link to a Gist, an Expo Snack or a link to a repository based on this template that reproduces the bug.
https://snack.expo.dev/@khldon123/ludicrous-yellow-cheese
Gesture Handler version
2.28.0
React Native version
0.81.4
Platforms
Android
JavaScript runtime
Hermes
Workflow
Using Expo Prebuild or an Expo development build
Architecture
New Architecture (Fabric)
Build type
Debug mode
Device
Real device
Device model
Xiaomi Redmi Note 13 Pro+
Acknowledgements
Yes