react-native-swipeout

iOS-style swipeout buttons that appear from behind a component

To do for v3.0.0 (issues)

Done

• Android compatibility (#43)
• Implement Animated library
  • Remove react-tween-state dependency (#49, #73)
• Add ability to pass props to swipeout parent
  • Including style
• Add ability to pass props to buttons
  • Including onPress, style, underlayColor
• Add ability to pass props to buttons
• Add onClose prop (#32)
• Update button type prop
• Add ability to set custom button widths (#42)
• Reimplement scroll prop (considering Animated library)
• Reimplement close(now open) prop (#54)

Needs Outside Verification

• iPhone 6s compatibility (#44)

Not Done

• Test on Android (#60, #78)
• Verify performance improvements (#40, #41)
• Add overswipe button prop (#10)
• Compensate for device rotation (#7)
• Rewrite Readme
  • Update preview gif (#21)
• Update wiki

Installation

npm install --save react-native-swipeout

Usage example

See index.ios.js for a more detailed example. See the Wiki usage tips.

var Swipeout = require('react-native-swipeout')

// Buttons
var swipeoutBtns = [
  {
    text: 'Button'
  }
]

// Swipeout component
<Swipeout right={swipeoutBtns}>
  <View>
    <Text>Swipe me left</Text>
  </View>
</Swipeout>

Props

All props are optional.

Prop	Type	Default	Description
autoClose	bool	false	auto close on button press
open	string/bool		"left", "right", or false
left	array	[]	swipeout buttons on left
onClose	func		function when buttons are hidden
onOpen	func		function when buttons are exposed
props	object	null	pass props to swipeout (ex: style)
right	array	[]	swipeout buttons on right
scroll	func		prevent parent scroll

Button props

Prop	Type	Default	Description
component	string	null	pass custom component to button
props	object	null	pass props to button (ex: onPress, style, underlayColor)
text	string	'Click Me'	text
type	string	null	danger/delete, primary, secondary, success