Sergei Mikhailovskii
Sergei Mikhailovskii

Reputation: 2465

Gradient background is not applied for screen

I have the following render function:

    <View style={styles.container}>
            <LinearGradient colors={['#4c669f', '#3b5998', '#192f6a']} start={[0, 0]} end={[1, 1]} />
            <View ... >
    </View>

I created it, because I want to create a Gradient background for my screen. But when I open this screen, I see, that this background isn't applied. So, what's the matter and what's wrong in my code?

Upvotes: 0

Views: 445

Answers (2)

Rishav Kumar
Rishav Kumar

Reputation: 5460

Everything's good in your code.

You just need to add an style also to your child component of style = {{flex:1}} This will render the gradient.

Upvotes: 0

warl0ck
warl0ck

Reputation: 3464

As per the document react native linear gradient you need to specify start and end as an object specifying x and y coordinates.

          <View style={styles.container}>
            <LinearGradient 
              colors={['#4c669f', '#3b5998', '#192f6a']} 
              start={{x: 0, y: 0}} 
              end={{x:1, y: 1}} 
            />
          <View>

Upvotes: 2

Related Questions