React Native SafeAreaView background color - How to assign two different background color for top and bottom of the screen?

Question

I\'m using SafeAreaView from React Native 0.50.1 and it\'s working pretty good except for the one part. I assigned the orange background color to the SafrAreaView

Answer 1

I was able to solve this using a version of Yoshiki's and Zach Schneider's answers. Notice how you set the top SafeAreaView's flex:0 so it doesn't expand.

render() {
  return (
    
      
      
        
      
    
  );
}