【问题标题】:View border shadow without affect its child查看边框阴影而不影响其子项
【发布时间】:2018-06-05 21:33:52
【问题描述】:

我想在视图的边框上添加阴影。但是,我不希望视图中的所有孩子也受到阴影的影响。我只想要视图边界之外的阴影,而不是视图中的文本或图像。可以这样做吗?

        <View style ={{
            margin:5,
            borderWidth:0.5,
            borderColor:'grey',
            borderRadius:15,
            overflow:'hidden',
            elevation:10,
            height:100}}

            ></View>

【问题讨论】:

    标签: css reactjs react-native


    【解决方案1】:

    你可以用它来做阴影:

    view: {
        height : 100,
        width : 100,
        shadowColor: "#000000",
        shadowOpacity: 0.8,
        shadowRadius: 2,
        shadowOffset: {
          height: 1,
          width: 0
        }
      }
    

    我希望这会有所帮助。

    【讨论】:

    • 嗨,它不起作用。阴影仍然会影响视图中的文本
    • 好的。那么您可以根据您的要求使用第 3 方吗? react-native-shadow
    【解决方案2】:

    我想在视图的边框上添加阴影

    您可以将属性 boxShadow 应用于您的 &lt;View&gt; 元素。

    例如

    boxShadow: '6px 6px 4px rgb(127, 127, 127)',
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-08-29
      • 2015-09-19
      • 1970-01-01
      相关资源
      最近更新 更多