如何在ImageBackground中添加borderRadius？

Question

React Native ImageBackground组件应该接受与Image相同的属性签名。但是，它似乎不接受borderRadius。

这没有任何影响。

<ImageBackground
  style={{height: 100, width: 100, borderRadius: 6}}
  source={{ uri: 'www.imageislocatedhere.com }}
>

如何更改ImageBackground的边框半径

Answer 1

只需添加属性overflow: 'hidden'

<ImageBackground
  style={{height: 100, width: 100, borderRadius: 6, overflow: 'hidden'}}
  source={{ uri: 'www.imageislocatedhere.com }}>

Answer 2

如果您计划在ImageBackground项中添加内容，那么您应该使用J.C.Gras的答案。

只需添加属性overflow: 'hidden'

原因是，如果您按照GollyJer推荐的方式使用imageStyle属性，那么ImageBackground中的内容将不会遵循borderRadius，因此它将在边缘松弛。