Исправлен нижний колонтитул в React Native с FlatList

Следуя этому вопросу о фиксированном нижнем колонтитуле с помощью ScrollView, я пытаюсь реализовать фиксированный нижний колонтитул на экран с FlatList. Я попытался использовать полученный ответ, поместив плоский список в представление, но тогда ни один из элементов не отображается. Кто-нибудь знает, как реализовать фиксированный нижний колонтитул с плоским списком в качестве другого основного элемента компонента?


person avriis    schedule 11.03.2018    source источник


Ответы (3)


Используя это гибкое решение, мне удалось сделать это с помощью пары вложенные представления:

<View style={{flex: 1}}>
  <View style={{flex: 0.9}}>
    <FlatList/>
  </View>
  <View style={{flex: 0.1}}/>
</View>
person avriis    schedule 14.03.2018

Это похоже на ответ выше, но я думаю, что это тоже работает.

<View style={{flex: 1}}>
  <View style={{flex: 1}}>
    <FlatList/>
  </View>
  <View />
</View>
person 박제영    schedule 03.05.2021

FlatList поддерживает нижний колонтитул в виде ListFooterComponent

Попробуйте добавить что-то подобное в свой плоский список

ListFooterComponent={() => <Text>Footer content</Text>}

Надеюсь это поможет!

person tjkind    schedule 13.03.2018
comment
Спасибо за ответ. Насколько я понимаю, документы на facebook.github.io/react- native / docs /, это указывает на то, что отображается в нижней части всех элементов, а не в нижней части экрана ... - person avriis; 14.03.2018