Percentage units (%) support on borderRadius style property 🚀

[lgxm3z]

Introduction

As developers, we are constantly looking for ways to improve the user experience and make our designs as dynamic and adaptable as possible. One way to achieve this is by allowing for the use of percentage units on the borderRadius style property in React Native.

Allowing percentage units on the borderRadius property would greatly improve the flexibility and responsiveness of our designs. It would allow us to create more dynamic and adaptive UI elements, and make it easier to create designs that look and feel consistent across different screen sizes and resolutions. Some properties like width and height already support the use of percentage units.

Code example

<View style={{width: 300, height: 300, borderRadius: '50%'}} />

[andresribeiro]

+1

[ArthurLobopro]

+1

[adnandothussain]

+1

[paperrin]

+1

Annoyed of developers using random large values as border radius.
Already saw things like this several times :

const styles = StyleSheet.create({
  circle: {
    width: '60%',
    aspectRatio: 1,
    borderRadius: 999999, // lazy
    backgroundColor: 'red',
  },
})