IjzerenHein / react-navigation-shared-element

React Navigation bindings for react-native-shared-element 💫
https://github.com/IjzerenHein/react-native-shared-element
MIT License
1.27k stars 124 forks source link

Weird Bounce and Shift on Android Only #139

Closed macist-m closed 3 years ago

macist-m commented 3 years ago

Hello, there is this weird effect happening only on android... Any help would be great...

Thanks...

ezgif-4-901741c20191

"@react-native-community/masked-view": "^0.1.10", "@react-navigation/native": "^5.9.2", "@react-navigation/stack": "^5.14.1", "install": "^0.13.0", "npm": "^6.14.11", "react": "16.13.1", "react-native": "0.63.4", "react-native-gesture-handler": "^1.9.0", "react-native-reanimated": "^1.13.2", "react-native-safe-area-context": "^3.1.9", "react-native-screens": "^2.15.2", "react-native-shared-element": "^0.7.0", "react-navigation-fluid-transitions": "^0.3.2", "react-navigation-shared-element": "^5.0.0-alpha1"

macist-m commented 3 years ago

Fading in the image fixed this using cardStyleInterpolator on the single view stack...

Here -> https://github.com/IjzerenHein/react-navigation-shared-element/issues/35#issuecomment-627242545

skinnynpale commented 3 years ago

it helps for me

 <Stack.Screen
          ...
          options={{ ...TransitionPresets.SlideFromRightIOS }}
          ... >
neerajdana996 commented 3 years ago

having the same issue any solution the one mentioned did not worked

IjzerenHein commented 3 years ago

Hi! react-native-shared-element@0.7.0 did not process scale transitions on Android correctly. Please upgrade to https://github.com/IjzerenHein/react-native-shared-element/releases/tag/v0.8.0 or higher. This fixes the new Android transition preset ScalefromCenterAndroid which is the default react-navigation preset on newer Android phones.

And please upgrade to the latest react-navigation-shared-element version, which has official support for React Navigation 5 and 6. https://github.com/IjzerenHein/react-navigation-shared-element/releases/tag/v3.1.2

IjzerenHein commented 3 years ago

Closing this issue. Feel free to reopen with additional details and a repro case in the example app if this is still a problem

Grey-1011 commented 6 months ago
# I'm facing the same issue. Has anyone solved it yet?

"@react-navigation/bottom-tabs": "^6.5.20",
"@react-navigation/native": "^6.1.17",
"@react-navigation/stack": "^6.3.29",
"react": "18.2.0",
"react-native": "0.73.6",
"react-native-gesture-handler": "^2.16.0",
"react-native-reanimated": "^3.8.1",
"react-native-safe-area-context": "^4.9.0",
"react-native-screens": "^3.30.1",
"react-native-shared-element": "^0.8.9",
"react-navigation-shared-element": "^3.1.3"