Skip to content

Latest commit

 

History

History
61 lines (41 loc) · 2 KB

README.md

File metadata and controls

61 lines (41 loc) · 2 KB
Raw

SquircleView

Apple flavored curvature continuity for React Native

Sponsors

Getting started

yarn add react-native-super-ellipse-mask

Mostly automatic installation

react-native link react-native-squircle-view

Manual installation

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-squircle-view and add RNSquircleView.xcodeproj
  3. In XCode, in the project navigator, select your project. Add libRNSquircleView.a to your project's Build Phases > Link Binary With Libraries
  4. Run your project (Cmd+R)<

Usage

<SquircleView style={styles.whatever} interpolatePath={true}>
  ...
</SquircleView>

Props

  • interpolatePath bool: Interpolates the corner shape from super elliptical to circular. Defaults to true

interpolatePath

Caveats

If XCode gives you a linker error and many warnings like Auto-Linking library not found for -lswiftCoreGraphics just add an empty swift file to the root of your .xcodeproj (Source)

Known Issues

  • Non compliant CSS borders: Currently this library doesn't support CSS compliant borders (like React Native's <View/> does).
  • Limited corner radius: The maximum corner radius for each corner can't be greater than half of the smallest side of the view.