How to create a rounded shape in react native?

I'm trying to this Register style shape in React Native:

But I have no idea how to create this shape in React Native. I'm using styled-components and tried messing with border-radius but it looks ugly."

This is my code:

export const HomeOptions = styled(TouchableOpacity)`    display: flex;    align-items: flex-end;    background-color: #43e394;    width: 200px;    height: 100px;    align-self: flex-end;    border-radius: 100px;    border-top-right-radius: 0;    border-bottom-right-radius: 0;    border-bottom-left-radius: 50px;    position: relative;  `;  

Can someone help me? I'm still learning Native.

I have also tried using some css shapes generators like clippy but I did not work as expected.

https://stackoverflow.com/questions/66449127/how-to-create-a-rounded-shape-in-react-native March 03, 2021 at 08:40AM