美文网首页
组件 swipeable - react-native-gest

组件 swipeable - react-native-gest

作者: JamesSawyer | 来源:发表于2019-04-03 23:06 被阅读0次

    这个组件允许实现可滑动的行(swipeable rows)或者类似的动作.

    它的子元素使用 panable container,允许水平向左或者向右滑动。

    使用 (Usage)

    引入方式:

    import Swipable from 'react-native-gesture-handler/Swipeable';
    

    属性 (Properties)

    • friction:{number} 相对于手势距离视觉交互上的延迟。比如,如果值为 1, 表示可滑动的面板和手势滑动的效果一直。如果为 2,则是手势滑动的2倍慢
    • leftThreshold: 打开左边面板的距离,默认是pannel宽度的一半
    • rightThreshold: 同上,只不过是右边
    • overshootLeft: {boolean} 可滑动面板是否可以比左边动作面板(left actions panel)的宽度拉得更远
    • overshootRight: 同上,只不过是右边动作面板
    • overshootFriction: {number} 指定超过时,视觉交互上和手势的延迟的比较。默认值是 1, 即没有friction,可以尝试使用 8 以上的值
    • onSwipeableLeftOpen:左边面板打开时的回调函数
    • onSwipeableRightOpen: 同上
    • onSwipeableOpen: 不管是左边还是右边面板打开时的回调
    • onSwipeableClose: 关闭action面板时的回调
    • onSwipeableLeftWillOpen: 左边面板开始滑动时的回调
    • onSwipeableRightWillOpen: 同上
    • onSwipeableWillOpen: 左边或者右边将打开时的回调
    • onSwipeableWillClose: 开始关闭action 面板时的回调
    • renderLeftActions: 当用户向右边滑动时,返回左边面板的组件
    • renderRightActions: 同上
    • containerStyle: 容器(Animated.View)的样式对象,比如 overflow: 'hidden'
    • childrenContainerStyle: 子元素容器(Animated.View)的样式对象,比如 flex: 1

    方法 (Methods)

    使用 Swipeable 组件的引用,来触发动作

    • close: 关闭组件
    • openLeft: 打开左边面板
    • openRight: 打开右边面板

    示例

    相关文章

      网友评论

          本文标题:组件 swipeable - react-native-gest

          本文链接:https://www.haomeiwen.com/subject/tmxxiqtx.html