Свернуть и развернуть список Flatlist

Разрабатываю проект на react native.

Там я вывожу категории товаров.

Есть список, созданные с помощью flatlist.

                   <FlatList 
                    data = { cur_ctg }
                    keyExtractor={item => item.category_id.toString()}
                    refreshing={true}
                    contentContainerStyle={{
                        padding: SPACING
                    }}
                    renderItem={ ({ item, index }) => {
                        return (                                
                            <TouchableOpacity  style={{
                                     flex: 1,                                         
                                     padding: 6,
                                     marginBottom: SPACING - 5,
                                     borderWidth: 1,                                         
                                     backgroundColor: 'rgba(255,255,255,0.8)',                                
                                     borderRadius: 5,
                                     shadowColor: Colors.black,
                                     shadowOffset: { width: 0, height: 2 },
                                     shadowOpacity: .3,
                                     shadowRadius: 10,
                                     elevation: 2
                                }}
                                onPress={() => 
                                    navigation.navigate('CatalogItemScreen', {
                                        categoryId : item.category_id,
                                        prevcatId : categoryId,
                                        prevcatNm : categoryTitle,
                                        categoryTitle : item.name
                                    })
                                }
                            >
                                <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
                                    <Text
                                        style={{
                                            fontSize: 20,
                                            fontFamily: 'Roboto-Bold'
                                        }}
                                    >
                                        { item.name }
                                    </Text>
                                </View>
                            </TouchableOpacity>
                            
                        )
                    }}

У меня вопрос в следующем, как сделать мне , чтоб список сворачивался допустим и разворачивался. То есть если у меня 10 категорий, при свернутом списке отображается только 3, при нажатии кнопки разворачиваются остальные, при повторном нажатии сворачивается список и отображаются только 3.

Спасибо.