【问题标题】:Fixed View at bottom (variable height) and fill remaining height with other View固定底部视图(可变高度)并用其他视图填充剩余高度
【发布时间】:2018-08-03 23:10:20
【问题描述】:

我想建立一个聊天。在消息的视图中是消息和消息的输入字段。输入框应该在底部并且应该使用它需要的高度。如果用户输入多行文本,输入框的高度可能会发生变化。 msgs-View 应该填充其余的高度(上图)。我不想定位 Input absolute,因为消息的 FlatList 应该始终在“可见”区域中。

<View style={styles.wrapper}>
 <View style={styles.msgs}>Messages (FlatList)</View>
 <View style={styles.input}>Inputbox</View>
</View>

【问题讨论】:

  • 你试过 alignItems 的包装器:space-between;
  • 我拥有所有带有 flex: 1 的视图和带有空格的包装器,但我什么也看不到了..
  • 可能视图被 flex:1 推送到屏幕上;尝试仅在父视图中使用 flex: 1

标签: react-native flexbox react-native-flexbox


【解决方案1】:

不要为您的输入提供 flex 样式。

提供您的包装器并列出flex: 1 样式。 Wrapper 将占用其父级中的所有空间(我假设是屏幕)。并且 list 将占用包装器中的所有空间。输入将位于底部。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-05-29
    • 1970-01-01
    • 2021-03-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-08-29
    • 1970-01-01
    相关资源
    最近更新 更多