Categories
React Native Answers

How to fix the parent opacity not affecting text issue with React Native?

Spread the love

To fix the parent opacity not affecting text issue with React Native, we should try changing the opacity using alpha-value of the background color instead of opacity props.

For example, we write


<View style={{ backgroundColor: "rgba(0,0,0,0.5)" }} />;

to set the backgroundColor style to "rgba(0,0,0,0.5)".

The last number is the opacity.

Then it should be possible applying different opacities for the children components.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *