Breaking News: Grepper is joining You.com. Read the official announcement!

react native make safe view in mobile

Shirshak Kandel answered on February 3, 2022 Popularity 4/10 Helpfulness 3/10

answer react native make safe view in mobile

react native make safe view in mobile

Comment

//import libraries to create components
import React from 'react'
import { Text, StyleSheet, View, SafeAreaView, StatusBar } from 'react-native'

//create a component that return some jsx/simple function
//======following code use SafeAreaView and statusBar.currentHeight to 
//    solve this problem===============================
const App = () => {
  return (
    <SafeAreaView style={styles.container}>
      <Text style={styles.textStyle}>hello world</Text>
    </SafeAreaView>
  )
}

//Create a StyleSheet object to style the component
const styles = StyleSheet.create({
  container: {
    flex: 1,
    marginTop: StatusBar.currentHeight || 0,
  },
})

//export the component, so it can be used in other parts of the app
export default App

Popularity 4/10 Helpfulness 3/10 Language javascript

Source: Grepper

Tags: javascript mobile react-native view

Link to this answer
Share Copy Link

Contributed on Feb 03 2022

Shirshak Kandel

0 Answers Avg Quality 2/10

react native make safe view in mobile

Contents

More Related Answers

react native make safe view in mobile

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.