反应原生布局固定宽度并拉伸剩余空间

Posted 2023-03-15

【中文标题】反应原生布局固定宽度并拉伸剩余空间

【英文标题】：React native layout fixed width and stretch remaining space

【发布时间】：2017-05-05 11:34:54

【问题描述】：

如何在 react-native 中制作这样的东西？

在右边我想要一个具有固定宽度的组件，在左边占据所有剩余空间另一个组件。

【参考方案1】：

试试这个：

  <View style=flex: 1, flexDirection: 'row'>
    <View style=
      backgroundColor: 'blue',
      flexGrow: 1,
    >
      <Text>Fluid</Text>
    </View>
    <View style=
      backgroundColor: 'red',
      width: 100,
    >
      <Text>Fixed</Text>        
    </View>
  </View>

【讨论】：

不错。我不知道flexGrow 属性。泰

我在尝试使用此解决方案时遇到问题......也许这是我的代码......但如果我输入大量文本（替换“Fluid”）......列大小不起作用...请帮助

谢谢！为我省去了很多麻烦。直到我看到这个才弄明白。

即使我不知道 flexGrow 属性谢谢。