How to change background color of rootView in React Native

Krzysztof Borowy
Aug 28, 2017 · 1 min read

Introduction

In order to make App’s starting screen look and feel better, you can either add a splash screen or change the background color of the rootView. In this short article, I’ll show You how to the latter.

iOS

In Your react-native project locate ios/YourAppName/AppDelegate.m file. There, just below rootView initialization, add desired background color:

As You can see, instead of well-know RGB or HEX color values, we have UIColor values. To get those, we can use online tool at http://uicolor.xyz/.

Android

From Your project root, go to android/app/src/main/res/values. There, create a file colors.xml, with a content:

Next, head to android/app/src/main/res/values/styles.xml

That’s it!

I hope You enjoyed this tutorial and I saved someone time searching for this solution.

)
Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade