ScrollView и FlatList

import { ScrollView, Text, View } from 'react-native';

<ScrollView>
    <Text>Строка 1</Text>
    <Text>Строка 2</Text>
    {/* ... */}
</ScrollView>

<ScrollView
    horizontal
    showsVerticalScrollIndicator={false}
    contentContainerStyle={{ padding: 16 }}
    onScroll={(e) => console.log(e.nativeEvent.contentOffset.y)}
    scrollEventThrottle={16}
    refreshControl={<RefreshControl refreshing={refreshing} onRefresh={onRefresh} />}
>
    {/* контент */}
</ScrollView>

import { FlatList, Text, View } from 'react-native';

<FlatList
    data={items}
    keyExtractor={(item) => item.id.toString()}
    renderItem={({ item }) => (
        <View>
            <Text>{item.title}</Text>
        </View>
    )}
/>

<FlatList
    data={items}
    ItemSeparatorComponent={() => <View style={styles.separator} />}
    ListHeaderComponent={<Text>Заголовок</Text>}
    ListFooterComponent={<Text>Конец</Text>}
    ListEmptyComponent={<Text>Пусто</Text>}
/>

const [refreshing, setRefreshing] = useState(false);

async function onRefresh() {
    setRefreshing(true);
    await loadData();
    setRefreshing(false);
}

<FlatList
    data={items}
    refreshing={refreshing}
    onRefresh={onRefresh}
    renderItem={...}
/>

<FlatList
    data={items}
    onEndReached={() => loadMore()}
    onEndReachedThreshold={0.5}
    ListFooterComponent={isLoading ? <ActivityIndicator /> : null}
/>

<FlatList
    data={items}
    renderItem={renderItem}
    keyExtractor={keyExtractor}
    initialNumToRender={10}
    maxToRenderPerBatch={10}
    windowSize={5}
    removeClippedSubviews
    getItemLayout={(data, index) => ({
        length: ITEM_HEIGHT,
        offset: ITEM_HEIGHT * index,
        index,
    })}
/>

const renderItem = useCallback(
    ({ item }: { item: Item }) => <ItemCard item={item} />,
    []
);

const keyExtractor = useCallback(
    (item: Item) => item.id.toString(),
    []
);

import { SectionList } from 'react-native';

<SectionList
    sections={[
        { title: 'A', data: ['Алиса', 'Антон'] },
        { title: 'Б', data: ['Борис', 'Богдан'] },
    ]}
    keyExtractor={(item, index) => item + index}
    renderItem={({ item }) => <Text>{item}</Text>}
    renderSectionHeader={({ section }) => <Text>{section.title}</Text>}
/>