react-native: shadow props of parent shouldn't inherit to children element...

Same here.

edit: Found a “fix” for my use case. The trick is to set a background color to the component on which you set the shadow. In the top example that would be:

<View 
  key={id} 
  style={[styles.box, { backgroundColor: white }]}
  shadowOffset={{height: 10}}
  shadowColor='black'
  shadowOpacity={0.5}
>
  <Text style={styles.text}>{title}</Text>
</View>

Unfortunately this only works with coloured backgrounds – when setting a transparent background with RGBA or ‘transparent’ is doesn’t help.

@ericnakagawa I can reproduce this with transparent or RBGA backgrounds on my view using RN 0.43.4

import React from 'react';
import {
  StyleSheet,
  Text,
  View,
} from 'react-native';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
      	<View style={ styles.withShadow }>
          <Text style={styles.text}>HELLO WORLD solid</Text>
      	</View>

        <View style={[styles.withShadow,{backgroundColor:'transparent'}]}>
          <Text style={styles.text}>HELLO WORLD transparent</Text>
        </View>

        <View style={[styles.withShadow,{backgroundColor:'rgba(33,33,33,0.05)'}]}>
          <Text style={styles.text}>HELLO WORLD rgba</Text>
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#fff',
  },
  text: {
    fontSize:24,
    color:'white',
    textAlign:'center',
  },
  withShadow: {
    margin: 20,
    height: 150,
    width: 150,
    backgroundColor: '#EEE',
    borderWidth:1,
    shadowColor: "#000000",
    shadowOpacity: 0.85,
    shadowRadius: 5,
    shadowOffset: {
      height: 0,
      width: 0
    }
  }
});

Can we re-open this issue? On React-Native 0.55.0 and experiencing this bug as well.

Can we reopen this? Child element still seem to inherit their parent’s shadows.

Please re-open this issue. I am experiencing this on 0.55.2 . Thankfully @sanderfish provided a temporary fix.