diff --git a/Libraries/Animated/src/Animated.js b/Libraries/Animated/src/Animated.js
index 8678b21f14b889..5b831396c3fc74 100644
--- a/Libraries/Animated/src/Animated.js
+++ b/Libraries/Animated/src/Animated.js
@@ -11,8 +11,10 @@
'use strict';
const AnimatedImplementation = require('AnimatedImplementation');
+const FlatList = require('FlatList');
const Image = require('Image');
const ScrollView = require('ScrollView');
+const SectionList = require('SectionList');
const Text = require('Text');
const View = require('View');
@@ -22,4 +24,6 @@ module.exports = {
Text: AnimatedImplementation.createAnimatedComponent(Text),
Image: AnimatedImplementation.createAnimatedComponent(Image),
ScrollView: AnimatedImplementation.createAnimatedComponent(ScrollView),
+ FlatList: AnimatedImplementation.createAnimatedComponent(FlatList),
+ SectionList: AnimatedImplementation.createAnimatedComponent(SectionList),
};
diff --git a/Libraries/Animated/src/__tests__/AnimatedNative-test.js b/Libraries/Animated/src/__tests__/AnimatedNative-test.js
index d3ff6665cbc81f..f9f3836835fc47 100644
--- a/Libraries/Animated/src/__tests__/AnimatedNative-test.js
+++ b/Libraries/Animated/src/__tests__/AnimatedNative-test.js
@@ -19,6 +19,8 @@ jest
.setMock('View', ClassComponentMock)
.setMock('Image', ClassComponentMock)
.setMock('ScrollView', ClassComponentMock)
+ .setMock('FlatList', ClassComponentMock)
+ .setMock('SectionList', ClassComponentMock)
.setMock('React', {Component: class {}})
.setMock('NativeModules', {
NativeAnimatedModule: {},
diff --git a/RNTester/js/FlatListExample.js b/RNTester/js/FlatListExample.js
index 4098934dc0b63d..989b791829cff0 100644
--- a/RNTester/js/FlatListExample.js
+++ b/RNTester/js/FlatListExample.js
@@ -13,7 +13,7 @@
const Alert = require('Alert');
const React = require('react');
const ReactNative = require('react-native');
-const {Animated, FlatList, StyleSheet, View} = ReactNative;
+const {Animated, StyleSheet, View} = ReactNative;
const RNTesterPage = require('./RNTesterPage');
@@ -34,8 +34,6 @@ const {
renderSmallSwitchOption,
} = require('./ListExampleShared');
-const AnimatedFlatList = Animated.createAnimatedComponent(FlatList);
-
const VIEWABILITY_CONFIG = {
minimumViewTime: 3000,
viewAreaCoveragePercentThreshold: 100,
@@ -114,7 +112,7 @@ class FlatListExample extends React.PureComponent<{}, $FlowFixMeState> {
- }
ListFooterComponent={FooterComponent}
@@ -201,7 +199,7 @@ class FlatListExample extends React.PureComponent<{}, $FlowFixMeState> {
this._listRef.getNode().recordInteraction();
pressItem(this, key);
};
- _listRef: AnimatedFlatList;
+ _listRef: Animated.FlatList;
}
const styles = StyleSheet.create({
diff --git a/RNTester/js/SectionListExample.js b/RNTester/js/SectionListExample.js
index 5d3f73f70c2bde..1b0e67f0cdab17 100644
--- a/RNTester/js/SectionListExample.js
+++ b/RNTester/js/SectionListExample.js
@@ -12,15 +12,7 @@
const React = require('react');
const ReactNative = require('react-native');
-const {
- Alert,
- Animated,
- Button,
- SectionList,
- StyleSheet,
- Text,
- View,
-} = ReactNative;
+const {Alert, Animated, Button, StyleSheet, Text, View} = ReactNative;
const RNTesterPage = require('./RNTesterPage');
@@ -39,8 +31,6 @@ const {
renderStackedItem,
} = require('./ListExampleShared');
-const AnimatedSectionList = Animated.createAnimatedComponent(SectionList);
-
const VIEWABILITY_CONFIG = {
minimumViewTime: 3000,
viewAreaCoveragePercentThreshold: 100,
@@ -90,7 +80,7 @@ class SectionListExample extends React.PureComponent<{}, $FlowFixMeState> {
{useNativeDriver: true},
);
- _sectionListRef: any;
+ _sectionListRef: Animated.SectionList;
_captureRef = ref => {
this._sectionListRef = ref;
};
@@ -150,7 +140,7 @@ class SectionListExample extends React.PureComponent<{}, $FlowFixMeState> {
-