1

I'm creating an translucent overlay and I want to add a shadow using elevation for Android with react-native. Problem is that it's rendering an internal "shadow" as well and the higher elevation, larger the shadow. How do I get rid of it?

Relevant code:

<View style={{
  backgroundColor: 'rgba(255, 255, 255, .5)',
  padding: 50,
  elevation: 10, // 20 on image in the right
}}>
  <MyButton onPress={() => this.newGame()} title="New Game" />
</View>

enter image description here enter image description here

Andre Figueiredo
  • 12,930
  • 8
  • 48
  • 74
  • Maybe this can help you: https://stackoverflow.com/questions/41320131/how-to-set-shadows-in-react-native-for-android/47241019 – Rudy Oct 16 '18 at 07:30
  • Unfortunately no. Because that button is opaque, I'm already got the shadow and it's messing with box. The problem here, is that in react-native create the shadow starting from inside the limits of the box and behind it, hence being visible in translucent box background. – Andre Figueiredo Oct 16 '18 at 12:37

0 Answers0