react native border radius not working ios

Isijola Ademie answered on June 16, 2021 Popularity 9/10 Helpfulness 4/10

answer react native border radius not working ios

related border radius not working ios react native

react native border radius not working ios

Comment

To anyone having this issue, I fixed It by wrapping the Image on a View component and applying the borderRadius to It instead of directly applying It to the Image.

{....}
<View style={styles.imageContainerIOS}>
	<Image
	     style={{ width: 100, height: 100 }} 
	    source={dummyImage}
	/>
</View>

{...}

imageContainerIOS: {
	borderBottomLeftRadius: 5,
	borderBottomRightRadius: 0,
	borderTopLeftRadius: 5,
	borderTopRightRadius: 0,
	overflow: 'hidden',
	marginRight: 20,
	},
{...}

Popularity 9/10 Helpfulness 4/10 Language javascript

Source: github.com

Tags: border-radius ios javascript react-native

Link to this answer
Share Copy Link

Contributed on Aug 13 2022

Isijola Ademie

0 Answers Avg Quality 2/10

Closely Related Answers

border radius not working ios react native

Comment

add
overflow: 'hidden'


Using overflow: 'hidden' on the same element that have borderRadius should fix this issue, I guess..

<Text
style={{
       borderRadius: 5,
       overflow: 'hidden',
       ....
      }}
        >

Popularity 10/10 Helpfulness 7/10 Language javascript

Source: Grepper

Tags: border-radius bo

Link to this answer
Share Copy Link

Contributed on Jun 16 2021

Different Dunlin

0 Answers Avg Quality 2/10

react native border radius not working ios

Contents

More Related Answers

react native border radius not working ios

Closely Related Answers

border radius not working ios react native

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.