react-native-super-ellipse-mask

1.0.7 • Public • Published

SuperEllipse

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

Screenshots

Individual Corners

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

Dependents (1)

Package Sidebar

Install

npm i react-native-super-ellipse-mask

Weekly Downloads

21

Version

1.0.7

License

Apple flavored smooth corners for React Native

Unpacked Size

43.8 kB

Total Files

18

Last publish

Collaborators

  • everdrone