react-native-swipeout

2020-02-13

react-native-swipeout

iOS-style swipeout buttons behind component

DEPRECATED

this is no longer supported, please consider using https://github.com/jemise111/react-native-swipe-list-viewinstead.

react-native-swipeout

iOS-style swipeout buttons that appear from behind a component

swipeout preview

Installation

npm install --save react-native-swipeout

Usage example

See example/index.ios.js for a more detailed example. See the Wikiusage tips. To use swipeout behind a iOS-style listitem, try react-native-listitem.

import Swipeout from 'react-native-swipeout';

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

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

Props

PropTypeOptionalDefaultDescription
autoCloseboolYesfalseauto close on button press
backgroundColorstringYes'#dbddde'
closeboolYesclose swipeout
disabledboolYesfalsewhether to disable the swipeout
leftarrayYes[]swipeout buttons on left
onOpenfuncYes(sectionID, rowId, direction: string) => void
onClosefuncYes(sectionID, rowId, direction: string) => void
rightarrayYes[]swipeout buttons on right
scrollfuncYesprevent parent scroll
stylestyleYesstyle of the container
sensitivitynumberYes50change the sensitivity of gesture
buttonWidthnumberYeseach button width
Button props
PropTypeOptionalDefaultDescription
backgroundColorstringYes'#b6bec0'background color
colorstringYes'#ffffff'text color
componentReactNodeYesnullpass custom component to button
onPressfuncYesnullfunction executed onPress
textstringYes'Click Me'text
typestringYes'default'default, delete, primary, secondary
underlayColorstringYesnullbutton underlay color on press
disabledboolYesfalsedisable button

To Do

https://github.com/dancormier/react-native-swipeout/issues

以上是 react-native-swipeout 的使用教程帮助文档。


上一篇:@types/react-native
下一篇:rc-gesture
相关教程
关注微信

扫码加入 JavaScript 社区

相关文章

首次访问,需要验证
微信扫码,关注即可
(仅需验证一次)

欢迎加入 JavaScript 社区

号内回复关键字:

回到顶部