React Native Flatlist can't see the bottom of the flatlist

I want to show a flatlist but I have a problem. In the bottom of the phone, I can't show the integrality of the post and don't scroll to it. I don't know why. Some issues ? I have try some spacing stuff with style but that's don't work like I want.

import React, { Component } from 'react'
import { View, Text, FlatList } from 'react-native'
import BlockPhoto from '../ui/BlockPhoto';
import { isTemplateElement } from '@babel/types';

interface Props { }

interface State { monTabPost: Array<TabPost> }

interface TabPost { id: number, title: string, }

const monTabPost: Array<TabPost> = [
{ id: 1, title: "Chat 1", },
{ id: 2, title: "Chat 2", },
{ id: 3, title: "Chat 3", },
{ id: 4, title: "Chat 4", },
{ id: 5, title: "Chat 5", },
{ id: 6, title: "Chat 6", },
{ id: 7, title: "Chat 7", },
{ id: 8, title: "Chat 8", },
]

export default class VueFlatList extends Component<Props, State> {
state = {
    monTabPost: monTabPost ? monTabPost : []
}

render = () => {
    return (
        <View style={{ paddingHorizontal: 30 }}>
            <Text style={{ paddingVertical: 20, backgroundColor: "black", marginBottom: 5, color: "white", textTransform: "uppercase", textAlign: "center", fontWeight: "bold" }}>Mon titre</Text>
            <FlatList
                //inverted
                data={this.state.monTabPost}
                keyExtractor={item => item.id.toString()}
                renderItem={({ item }) =>
                    <View>
                        <Text>Mon post</Text>
                        <BlockPhoto title={item.title} />
                    </View>
                }
            />
        </View>
    )
}

}