Javascript 如何仅对 1 个角使用边框半径（react-native）？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/35341502/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use border radius only for 1 corner (react-native)?
提问by Maksim
How to use border radius in React Native only for 1 corner?
如何在 React Native 中仅对 1 个角使用边框半径？
I have a modal window
我有一个模态窗口
As you can see bottom corners not rounded, it happens when I used backgroundColor for buttons. I was trying to set overflow hidden to modal wrapper and it didn't help me. Now I want to use border radius to buttons (only for 1 corner).
正如您所看到的底角没有圆角，当我将 backgroundColor 用于按钮时会发生这种情况。我试图将溢出隐藏设置为模式包装器，但它没有帮助我。现在我想对按钮使用边框半径（仅用于 1 个角）。
回答by Matteo Mazzarolo
Did you already try with the following?
- borderBottomLeftRadius: number
- borderBottomRightRadius: number
- borderTopLeftRadius: number
- borderTopRightRadius: number
您是否已经尝试过以下操作？
- borderBottomLeftRadius: 号码
- borderBottomRightRadius: 号码
- borderTopLeftRadius: 号码
- borderTopRightRadius: 号码
Also, you can find more info in the view component docs.
此外，您可以在视图组件文档中找到更多信息。
回答by Syn Adhitya
Add the following properties in your style:
在您的样式中添加以下属性：
borderBottomLeftRadius: numberborderBottomRightRadius: numberborderTopLeftRadius: numberborderTopRightRadius: number
borderBottomLeftRadius: numberborderBottomRightRadius: numberborderTopLeftRadius: numberborderTopRightRadius: number
This worked for me.
这对我有用。
Thanks
谢谢
回答by Shirly Chen
Suppose only the radius is set for the upper left and lower left corners of the Image tag.
假设只为 Image 标签的左上角和左下角设置了半径。
<View style={styles.imgBox}>
<Image source={{ uri: 'your image url' }} style={styles.img} />
</View>
const styles = EStyleSheet.create({
imgBox: {
width: px(72),
height: px(72),
borderBottomLeftRadius: 2,
borderTopLeftRadius: 2,
overflow: 'hidden',
},
img: {
width: px(72),
height: px(72),
},
})
looks good for ios.
ios 看起来不错。
