Changed default ViewState

[piaskowyk]

Description

The problem occurs since #2651
Why?
Layout animations are disabled by default until someone call layout animation. Then layout animation is enabled. The problem is when someone uses layout animation in components that don't appear in the first render. It breaks the previous assumption of layout animation - "every component is sent to onViewCreate function". In effect, we tried to remove the view that wasn't registered in _viewForTag register.

There was also another problem because uses this:

ViewState state = [_states[tag] intValue];

without checking if _states[tag] is nil. Then nil was converted to 0 and then to the first value from ViewState (Appearing), but this is wrong because the default state should be Inactive because not every component has animation.

I added similar changes for Android also.

Reproduction

import React from 'react';
import { useEffect, useState } from 'react';
import { ActivityIndicator, StyleSheet, Text, View, findNodeHandle } from 'react-native';
import Animated, { FadeOutDown } from 'react-native-reanimated';

export default function App() {
  const [isLoading, setIsLoading] = useState<boolean>(true);
  useEffect(() => {
    const timeout = setTimeout(() => setIsLoading(false), 500);
    return () => {
      clearTimeout(timeout);
    };
  }, []);

  return (
    <View style={styles.container}>
      { isLoading ? 
          <ActivityIndicator size='large' color='red' />
        : 
          <Animated.View exiting={FadeOutDown} style={styles.scrollContainer}>
            {[...Array(10).keys()].map((value) => (
              <View style={styles.row} key={value}>
                <Text>row n°{value}</Text>
              </View>
            ))}
          </Animated.View>
      }
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  scrollContainer: {
    flex: 1,
    width: '100%',
  },
  row: {
    flexDirection: 'row',
    backgroundColor: 'transparent',
    height: 50,
  },
});

Fixes #2758

[piaskowyk]

I need to check it on Android also.

[tomekzaw]

Looks good to me!

[alexnaiman]

When will this be published? 😄

[skeie]

Any idea when this will be released? :)