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

Question

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

在右侧，我想要一个具有固定宽度的组件，在左侧，将所有剩余空间放在另一个组件上。

Answer 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>