Module: SlideGear

档位控件，滑动选择

Properties:
Name Type Description
type TYPE

容器和滑块的圆角类型
options array.<string>

档位可选项，以字符串数组表示，必填
showEndText bool

是否显示两端的文字，即options的第一个和最后一个，默认true
containerStyle style

容器样式，设置背景颜色无效
blockStyle style

滑块样式，尺寸始终比容器小
minimumTrackTintColor string

滑块左侧填充颜色
leftTextColor string

最左侧文字颜色，showEndText = true时有效
maximumTrackTintColor string

滑块右侧填充颜色
rightTextColor string

最右侧文字颜色，showEndText = true时有效
value number

被选择档位的数组下标, 0<=value<=options.length -1
disabled boolean

是否禁用交互，默认false
onValueChange function

滑动时的回调函数
onSlidingComplete function

滑动结束的回调函数
Since:
  • 10022
Author:
  • Geeook

Members

TYPE :string

容器和滑块的圆角类型

Methods

_onPanResponderGrant()

手势开始回调

_onPanResponderRelease()

手势释放回调

calculateCoord()

计算整个容器的大小和在屏幕上的位置，从而确定每个选项的圆心坐标

componentWillReceiveProps(newProps)

接收 options / value 动态变化

Parameters:
Name Type Description
newProps object

constructPanResponder(props)

根据传参动态创建手势控制器

Parameters:
Name Type Description
props object

getClosetIndex()

获取距离拖拽元素最近的选项下标 根据释放时的绝对坐标和各个选项的绝对坐标距离做对比

getCorrectLayout() → {Object}

根据选项的宽度、间距和 maxWidth ，计算容器实际宽度，选项实际宽度，实际间距

Returns:
Type
Object

getDragRange()

计算可拖拽的范围

isSameArray(arr1, arr2)

判断两个数组是否完全相等

Parameters:
Name Type Description
arr1 array
arr2 array

renderBackground()

滑块左侧背景

renderDraggable()

滑块

renderRightText()

最右侧文字