native固定吸顶 react_ReactNative用ScrollView简单实现吸顶隐藏导航栏

效果如下

效果.gif

参考ScrollView代码如下

在ScrollView顶部嵌套一个Nav导航栏和一个搜索框，stickyHeaderIndices={[1]}让搜索框吸顶固定。此时已经可以实现吸顶，但还可处理一下，滑动一半便停下的情况。先给ref方便调用它的方法。

onScroll={this.onScroll}

stickyHeaderIndices={[1]}

showsVerticalScrollIndicator={false}

overScrollMode={'never'}

onScrollEndDrag={this.onStop}

ref={(component)=>{this._scrollView=component}}

>

>

style={styles.search}

inputStyle={ {color: 'black', fontSize: 14}}

iconSize={15}

placeholder='客官，需要什么？'

placeholderTextColor='#aaa'

onChangeText={()=>{}}

onFocus={()=>{Actions['first-search'].call()}}

/>