CODEWITHSUNDEEP
react-nativereact-native-stylesheet
Suhail Moh
Suhail Moh

Reputation: 55

How to add faded border in a Image component in React Native?

How

How to fade the border of an image shown below or how can achieve it? Any help would be appreciated

Upvotes: 0

Views: 1839

Answers (1)

Samuli Hakoniemi
Samuli Hakoniemi

Reputation: 19059

You can use React Native Linear Gradient library for achieving this.

The API is very simple, e.g.

<LinearGradient
  colors={['rgba(192,32,64,0.9)', 'transparent']}
  style={{position: 'absolute', left: 0, right: 0, bottom: 0, height: 200}}
  start={{x:0, y:1.0}}
  end={{x: 0, y: 0}}
/>

Please, see my Expo Snack example for details: https://snack.expo.io/@zvona/linear-gradient.

Upvotes: 1

Related Questions