Apple flavored smooth corners for React Native (iOS only).

Screenshots

Install

yarn add react-native-super-ellipse-mask

Link

Automatic

react-native link react-native-super-ellipse-mask

Manual

iOS

1. In XCode, in the project navigator, right click Libraries > Add Files to [your project's name]
2. Go to node_modules > react-native-super-ellipse-mask and add RNSuperEllipseMask.xcodeproj
3. In XCode, in the project navigator, select your project. Add libRNSuperEllipseMask.a to your project's Build Phases > Link Binary With Libraries
4. Run your project (Cmd+R)

Usage

<SuperEllipseMask radius={30}>
  <View
    style={{
      width: 200,
      height: 300,
      backgroundColor: 'black',
    }}
  />
</SuperEllipseMask>

Props

• radius object | number: Sets the corner radius.
  • number: uniform corner radius.
  • object: {topLeft, topRight, bottomRight, bottomLeft}

Contribute

Found a bug? File an issue
Already know how to fix it? Open a Pull Request