Explanation: In the code below, the main view has a style opacity
set to 1
and shadow works perfectly. When I set the opacity
to 0.6
, shadow makes the view disrupted. Please check the images to see the difference. How do I solve this problem?
Note: I didn't test it on IOS but it looks like this on android.
<View
style={{
flex: 1,
justifyContent: 'center',
alignItems: 'center',
opacity: 1,
}}>
<View
style={{
padding: 20,
borderRadius: 10,
backgroundColor: Colors.white,
shadowColor: '#000',
elevation: 5,
}}>
<Text>Test 123</Text>
</View>
<View></View>
</View>