React-native <View>组件的"高程"样式导致丑陋的阴影

Question

高程样式属性为Android 5.0+启用了框阴影.

我在这里做了一些不寻常的"升高",导致丑陋,可以在下面的截图中看到？另外,有没有办法定义阴影偏移？

模拟器运行6.0(> 5.0),所以这不是问题.我正在运行react-native 25.1.

  "dependencies": {
    "react": "^0.14.8",
    "react-native": "^0.25.1",
    "react-native-gcm-android": "^0.2.0",
    "react-native-material-design": "^0.3.5",
    "react-native-system-notification": "^0.1.10",
    "react-redux": "^4.4.5",
    "redux": "^3.5.2"
  }

这是反应原生的View组件样式文档

这是我的渲染方法:

  render() {
    return (
      <ListView
        dataSource={alertData}
        renderRow={(rowData) =>
          <View style={style.cardContainer}>
            <Text>{rowData.blah}</Text>
            <Text>{"#" + rowData.foo}</Text>
            <Text>{rowData.blah}</Text>
            <Text>{rowData.foo}</Text>
            <Text>{rowData.baz}</Text>
          </View>
        }
      />
    );
  }

风格宣言:

var style = StyleSheet.create({
  cardContainer : {
    elevation   : 3,
    flex        : 1,
    margin      : 10,
    padding     : 10,
    borderWidth : 2,
    borderColor : beeStyles.colors.lightGray
  }
});

以某种方式导致这个......

Answer 1

缺少的部分是backgroundColor.向backgroundColor : '<anything>'View容器添加样式会使那些奇怪的内部阴影消失.