ScreenBackground

A simple component that renders either a color or gradient as a background.

This component works well with the Page component. It's responsible for providing the Page's background.

import { ScreenBackground } from 'react-native-doorman'

Example

You should use this component with Page. See the Page docs for a full example.

Usage

To customize the background color, use the color prop. The default color is ['#FF2C55', '#7048e8'], which looks like this:

You can opt to either use a gradient or solid color.

To use a gradient, pass an array of colors.

To use a solid color, pass a string with a single color.

// gradient background
<ScreenBackground color={['#FF2C55', '#7048e8']} />

// solid color background 
<ScreenBackground color="blue" />

// default Doorman gradient
<ScreenBackground />

Want help finding your favorite gradient? Check out a tool I made back in the day called Gradient God.