React-native-router-flux: How to style Modal to have a transparent background, like an overlay?

Created on 28 May 2016 · 4Comments · Source: aksonov/react-native-router-flux

question

Source

sibelius

👍4

Most helpful comment

I achieved this as follows:

in your render method where you are _rendering_ Modal, pass a prop transparent={true}
add a _single_ View child to your modal (put all other things inside this View) and apply style to it with backgroundColor = 'rgba(r, g, b, a)' as described above

react-native v0.46.4

y2k-shubham on 27 Aug 2017

👍32 🎉3 ❤2

backgroundColor:'rgba(255,255,255,0.5'

mnadbader on 29 May 2016

👍10 🎉6 👎2

I believe it is out of scope of this component. Example project has modal popup with usage of 3rd party component.

aksonov on 8 Jun 2016

I achieved this as follows:

in your render method where you are _rendering_ Modal, pass a prop transparent={true}
add a _single_ View child to your modal (put all other things inside this View) and apply style to it with backgroundColor = 'rgba(r, g, b, a)' as described above