How to Make a Round Image in React Native [iOS and Android]

Sometimes you may want to show an image in round shape your React Native app. Usually, we show images such as profile images in round shape.

Making round images in Android and iOS are bit different. In Android, you just need to style your image by giving same value to height, width and borderRadius. In the case of iOS you should have same height and width but borderRadius should be the half of width and height value.

See the example snippet below:

<Image source={yourImage} style={{
height: 30,
width: 30,
borderRadius: Platform.OS === 'ios' ? 30/2 : 30
}}
/>