CODEWITHSUNDEEP
androidiosreactjsreact-native
user984621
user984621

Reputation: 48453

React Native - a fresh new app shows only a black screen. How to debug?

I am starting exploring building mobile apps with React Native and running, even after going through many tutorials, into repeating issues.

I generated a new app via the react-native init MyApp command - I noticed that in the App.js file were included these styles definitions:

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

However, if I decided to only use

export default class App extends Component {
  render() {
    return (
      <View>
        <Header />
      </View>
    );
  }
}

I only get back a black screen in the simulator - to "see" something, I need to add the style definition, as:

<View style={styles.container}>
  <Header />
</View>

How do I avoid always specifying the style definition for <View>? Is the default setup that the background of the screen is black or am I overlooking something?

So far - the development is quite confusing and difficult, I spent basically the whole afternoon restarting the iOS app (hot reloading doesn't always work) to see new code changes in the app instead of building some new functionality.

Am I doing something fundamentally wrong (like using the wrong development tools)?

Upvotes: 3

Views: 4126

Answers (2)

Gagandeep Singh
Gagandeep Singh

Reputation: 65

For me I was using dark mode. but when I switched to light mode I was able to see content in my app.

Upvotes: 0

Andrew
Andrew

Reputation: 28539

If you look in the AppDelegate.m you will see that the the rootView has its color set as follows

rootView.backgroundColor = [UIColor blackColor];

This sets the default color to black, you can change it to whatever you want.

However it won't affect anything that you do on Android so it would be best just to set your backgroundColor in the View.

Upvotes: 1

Related Questions