zoukankan      html  css  js  c++  java
  • [React Native] Use the SafeAreaView Component in React Native for iPhone X Compatibility

    In this lesson, you will learn how to use the SafeAreaView component to avoid the sensor cluster (the notch) and home activity indicator on the iPhone X.

    SafeAreaView is similar to the View, just for iphone X, the screen is different from previous version. Using SafeAreaView can ensure all the content will be visible

    import React from 'react';
    import {
      View,
      Text,
      StyleSheet,
      SafeAreaView,
    } from 'react-native';
    
    const App = () => (
      <View style={styles.container}>
        <SafeAreaView style={styles.nav}>
          <Text style={styles.text}>Nav bar</Text>
        </SafeAreaView>
        <SafeAreaView style={styles.content}>
          <Text style={styles.textLight}>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae diam consectetur nunc sollicitudin feugiat a sollicitudin velit. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus a dignissim orci. In commodo, velit ac hendrerit laoreet, mauris sapien mollis nulla, at convallis orci diam eu purus. Cras pharetra turpis ac massa laoreet, at consequat lorem pharetra. Pellentesque ac leo ut dui congue eleifend sed sed erat. Nunc at iaculis elit. Duis congue, odio sit amet rutrum imperdiet, quam arcu gravida leo, eu dapibus risus ex et ante. Fusce pellentesque interdum neque, a sodales lacus consequat id. Nunc faucibus lobortis blandit. Proin porttitor commodo pellentesque.
          </Text>
        </SafeAreaView>
        <SafeAreaView style={styles.tab}>
          <Text style={styles.text}>Tab bar</Text>
        </SafeAreaView>
      </View>
    );
  • 相关阅读:
    LALR(1)语法分析生成器--xbytes
    <<摩托车修理技术与禅>>读书笔记
    xscript脚本
    CentOS安装Erlang
    TCP中close和shutdown之间的区别
    Erlang高阶函数
    深度学习小记
    mac平台打造犀利的Android Studio开发环境
    MAC中如何配置两套android-sdk环境
    Ubuntu虚拟机编译Android6.0总结
  • 原文地址:https://www.cnblogs.com/Answer1215/p/8272590.html
Copyright © 2011-2022 走看看