Warning "type RCTView has a shadow set but cannot calculate shadow efficiently"

[zhaomingli007]

Hi Steffey,

This plugin helped me a lot. Thank you.

I encountered a warning when run your test from "react-native-popover-view-test-app", each time I click the "settings" icon on top-right.

My code looks like it below:

let shouldShowInPopover = true;

class MoreDropdown extends Component {
  render() {
    return (
      <ScrollView contentContainerStyle={{padding: 20}}>
        <Text style={{fontSize: 16, fontWeight: 'bold', marginBottom: 10}}>Popover Navigation</Text>
        <Text>Show Stack Views in Popover</Text>
        <View style={styles.row}>
          <View style={{flex: 1}}>
            <Text>Show Stack Views in Popover</Text>
            <Text style={{fontSize: 10, color: 'gray', marginTop: 5}}>You will need to change the device orientation for this setting to take effect.</Text>
          </View>
          <Switch value={shouldShowInPopover} onValueChange={() => {
            shouldShowInPopover = !shouldShowInPopover;
            this.forceUpdate();
          }} />
        </View>
      </ScrollView>
    )
  }
}

const AnaPopoverStack = createPopoverStackNavigator({
    Analysis: {
        screen: props =><Analysis navigation = {props.navigation} {...props.screenProps}/>,
        navigationOptions: ({navigation}) => ({
            title: '知己',
            headerRight: 
                <TouchableOpacity ref={ref => createPopoverStackNavigator.registerRefForView(ref, 'MoreDropdown')} onPress={() => navigation.navigate('MoreDropdown')} style={{width: 60, alignItems: 'center'}}><Icon name="dots-horizontal" size={30} /></TouchableOpacity>, 
    })
  },
  MoreDropdown: {
    screen: MoreDropdown,
    navigationOptions: {title: "MoreDropdown"},
    popoverOptions: {
      contentContainerStyle: {
        minWidth: 300
      }
    }
  }
}, {
  popoverOptions: {
    verticalOffset: Platform.OS === 'android' ? -StatusBar.currentHeight : 0
  }
})


export default class StackWrapper extends Component {
  render() {
    return (
        <AnaPopoverStack screenProps={{showInPopover: shouldShowInPopover}} />
    );
  }
}

Any idea about that?

[SteffeyDev]

I think it is because I am putting the shadows on an Animated.View. I don't see this warning when running on my phone, what device are you running on that you see this error with my test app? If I can reproduce the warning I think I can fix it.

[zhaomingli007]

The warning appears on iOS simulator (iPhone with version 11.2) .
I didn't use expo. this warning is from chrome debug console, not a "yellow" box on iPhone simulator.

[SteffeyDev]

You mentioned my "react-native-popover-view-test-app" in your original comment, which is an Expo app. Did you copy-paste the code into a non-expo app and see the warning there? I can check if I get the same warning in my non-expo app, but it may be a few days.

[zhaomingli007]

Yes, exactly I did copy and paste your test code into my non-expo app.
This is just a warning it does not stuck me.
Take your time and thank you for your reply.