How to use border radius only for 1 corner (react-native)?
Did you already try with the following?
- borderBottomLeftRadius
: number
- borderBottomRightRadius
: number
- borderTopLeftRadius
: number
- borderTopRightRadius
: number
Also, you can find more info in the view component docs.
Add the following properties in your style:
borderBottomLeftRadius: number
borderBottomRightRadius: number
borderTopLeftRadius: number
borderTopRightRadius: number
This worked for me.
Thanks
Suppose only the radius is set for the upper left and lower left corners of the Image tag.
<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.