[Android] LayoutAnimation not running when screen back

[kockok]

Description

iOS works fine in my case

Layoutanimation not running when screen go back using default functions, and I guess the problem might be arising from the components not being remounted.

Reproduction

Just add this inside the Home screen, and yet, the subsequent Register screen ALSO have the same LayoutAnimation effects.

 LayoutAnimation.configureNext({
    duration: Platform.OS === 'android' ? 400 : 500,
    update: { type: LayoutAnimation.Types.spring, springDamping: Platform.OS === 'android' ? 0.7 : 0.6 },
  })

Steps To Reproduce

1. I use createNativeStackNavigator and the flow of direction is Home screen to Register screen back and forth:

  <AuthStack.Screen
      name="Register"
      component={Register}
      options={{
        headerLargeTitle: true,
        title: 'Create Account',
        headerTitleAlign: 'center',
        headerShadowVisible: false,
        headerBackTitle: ' ',
      }}

2. From Home To Register screen

navigation.navigate('Register', { navigation.navigate('Register', {
                      email: state.email,
                    });

3. tapping the back arrow icon from the Register screen header

4. Home screen Layoutanimation not working.

Expected behavior

The Layoutanimation should perform normally in Android

Actual behavior

The Layoutanimation NOT running normally in Android

Temp fix

I am currently hard coded the key prop to force the component to update.

<Input
            key={id}
            onFocus={() => setId(Math.random().toString()}

/>

Platform

• iOS
• [v ] Android
• Web
• Windows
• tvOS

Package versions

"react-native": "^0.68.2",
"react-native-reanimated": "^2.8.0",
"react-native-screens": "^3.13.1",
"@react-navigation/native": "^6.0.10",
"@react-navigation/native-stack": "^6.6.2",
"react-native-safe-area-context": "^4.3.1",
"react-native-gesture-handler": "^2.5.0",