小编nin*_*yen的帖子

现在我想像 Facebook 的应用程序一样创建一个显示在我的 tabNavigator 上方的栏。此选项卡在向下滚动时隐藏并在向上滚动时显示。现在我正在使用 FlatList，但 FlatList 组件具有 ListHeaderComponent 选项，用于呈现他的标题，向下滚动时也会隐藏。（因为它在顶部，所以需要滚动到开始才能看到它，对我很长的列表项不友好）

请帮助我任何想法。

目前，我在使用 FlatList 时遇到了问题。我有一个组件来呈现列表簿。按照设计，header 的宽度是屏幕的宽度，body 将左右填充 10px。

所以我使用了contentContainerStyle={{paddingHorizontal: 10}}. 但是结果是header和body都是10px左右填充。

请提出解决方法。对不起，我的英语不好！！

更新：我很抱歉没有彻底描述我的问题。

在 main.tsx

...
public render() {
  return (
    <FlatList
      key...
      data={..}
      renderItem={this.renderItems}
      ListHeaderComponent={this.renderHeader}
      contentContainerStyle={styles.contentStyle}
    />
  );
}

private renderHeader = () => {
  return (
    <View style={style.header}
      //TODO something ...
    </View>
  );
}

private renderItems: ListRenderItem<IBook> = ({ item: {bookId} }) => bookId ?
  (
    <BookGridCell
      title={...}
      image={...}
      //TODO more..
    />
  ) : <View style={styles.emptyBox} /> 
}

在renderItems，我调用了一个组件BookGridCell。在这个组件中，设置了书籍的设计。所以如果我直接在里面添加样式renderItems，每本书的左右边距都是10px，而不是整个正文。

contentContainerStyle 与 …