您可以使用尺寸来计算设备的宽度和高度，然后设置边距或填充

import { Dimensions } from 'react-native'

var deviceWidth = Dimensions.get('window').width
var deviceHeight: Dimensions.get('window').height

视图代码
x一个一个一个一个x一个一个二个x
参考链接
Dimensions link
有一个看这个链接太PixelRatio
React Native Styling Cheat Sheet

您可以使用SafeAreaView component轻松实现这一点，其目的是在iOS设备（版本11或更高版本）的安全区域边界内渲染内容。
SafeAreaView呈现嵌套内容，并自动应用填充来反映视图中未被导航栏、标签栏、工具栏和其他祖先视图覆盖的部分。此外，最重要的是，SafeAreaView的填充反映了屏幕的物理限制，如圆角或相机凹槽（即iPhone X上的传感器 shell 区域）。

我一直在使用这个小型实用程序库react-native-size-matters
这个库最好的地方是你可以根据大小随设备的增长来改变规模。唯一的一个小问题是设置测量的基础设备。我克隆了repo并根据我的需要进行了更改。看看吧！

使用此库进行响应式设计：

import {widthPercentageToDP as wp, heightPercentageToDP as hp} from 'react-native-responsive-screen';

class Login extends Component {
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.textWrapper}>
          <Text style={styles.myText}>Login</Text>
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: { flex: 1 },
  textWrapper: {
    height: hp('70%'), // 70% of height device screen
    width: wp('80%')   // 80% of width device screen
  },
  myText: {
    fontSize: hp('5%') // End result looks like the provided UI mockup
  }
});

export default Login;