rn 实现上下滑动选择列表_RN-自定义下拉选择框

image.png

思路：

1.按钮点击，计算出按钮的位置大小信息，得到相对于屏幕的位置。

2.计算出以后显示一个modal,根据按钮的位置信息在下方显示下拉框View

如果想要实现下拉框随着页面滚动，先计算按钮的位置信息，然后绝对定位View到ScrollView上。

所有代码

import React, { Component } from 'react';

import {

StyleSheet,

View,

TouchableOpacity,

Modal,

TouchableWithoutFeedback,

ScrollView,

Text,

} from 'react-native';

import * as c from '../../common/ScreenUtil';

const itemHeight = 30

const maxCount = 5

/**

*

* @param props:{

* options：array(数据源)

* itemHeight：number(下拉框item的高度)

* onChoose:func (item点击触发事件)(index)

* renderRow:func(外部传入item组件,方便自己定义)(index,onDismiss),存在时 options 无用

* index：