如何在React Native中将整个屏幕分割成不同大小的部分

Question

我是 React-Native 的新手。请帮我解答这个问题。我尝试了以下方法，但无法垂直分割屏幕。

1. 尝试以百分比改变高度。

       <View style={{width: '100%', height: 150, backgroundColor: 'powderblue'}} />
       <View style={{width: '100%', height: 150, backgroundColor: 'skyblue'}} />
       <View style={{width: '100%', height: 150, backgroundColor: 'steelblue'}} />
   </View> ```
   

2.

如何在react-native中将屏幕分为两部分？

3.

响应原生 Flexbox 分屏

Answer 1

您应该使用Flexbox。

<View style={{flex: 1}}>
    <View style={{flex: 1}}></View>
    <View style={{flex: 1}}></View>
    <View style={{flex: 1}}></View>
</View>